B.TIL
1.B.TIL 01 : Vue-router, History모드 사용시 새로고침 오류 문제 해결법
vue-router의 기본모드는 hash-bang 모드이다.해쉬뱅 모드를 사용 후 프론트서버를 실행시키면 상단에 있는 주소바에 자동으로 히스토리 모드는 뷰는 SPA(Single Page Application)를 기준으로 작성되는 프레임워크다.라우터기능을 통해 링크의 주
2.B.TIL 02 : Vue vs React
Vue와 React 공통점 첫째. 가상 DOM을 활용한다. 둘째. 반응적이고 조합가능한 컴포넌트를 제공한다 셋째. 코어 라이브러리에만 집중하고 있고 라우팅 및 전역 상태를 관리하는 컴패니언 라이브러리가 존재한다. 무엇이 다른가? 첫째. 런타임 퍼포먼스(속도)
3.B.TIL 03 : Error: Cannot find module 'webpack/bin/config-yargs' 에러 해결법
웹팩의 모든 파일은 모듈화되서 번들링화되어있고, 서로가 의존성을 띄게 됩니다.하지만 웹팩에 묶여있는 각각의 모듈은 실제로는 각자의 개발팀에서 개발을 하게됩니다.webpack과 webpack-devserver라는 파일은 이름은 비슷해보이지만 다른 개발팀에서 개발을 하게되
4.B-TIL 04 : Vue Router
현대 웹 앱 형태인 SPA에서 새로고침이나 링크를 직접 입력하지 않고 컴포넌트간에 이동을 쉽게 하기 위해 만든 라이브러리SPA는 실제로는 하나의 웹페이지지만 여러개의 페이지가 있는 것 처럼 기능구현을 해야하므로 컴포넌트와 라우터가 필수적으로 사용된다.뷰 라우터의 기능을
5.B.TIL 05 : history를 이용한 컴포넌트 이동(뒤로가기 등)
이전 게시물에 언급했다싶이 히스토리 모드는 다음과 같은 특징을 가지고 있다.1) 해쉬뱅 모드와 달리 링크에 2) 라우터를 사용해 컴포넌트를 이동(교체)할 때 마다 스택이 쌓인다.이 중 히스토리 모드의 두 번째 특징과 라우터 메소드를 사용하면 뒤로가기, 홈으로 가기 같은
6.B.TIL 06 : vue $ref 활용하기
Props & Event 컴포넌트는 Vue.js의 꽃이다. 재사용 가능한 코드를 캡슐화(컴포넌트화)해서 재사용을 할 수 있고, 컴포넌트간에 통신을 활용해 복합적인 기능 구현을 완성을 할 수 있게 된다. Props & Event는 단방향 데이터 흐름(바인딩)을 보여주
7.재귀 테이블(Recursive Table)
재귀테이블의 개념 재귀테이블이란 한 테이블 안에 칼럼이 다른 칼럼을 참조하는 형식을 갖춘 테이블을 말한다. 대부분의 재귀테이블은 계층구조와 밀접한 연관이 있다. 부서 위에 상위부서가 존재하는 회사 조직도 관리에 굉장히 많이 쓰이는 테이블 구조며 생각보다 형식이 단순해
8.B.TIL 07 : Vuex
Vuex에 대해서 VueX는 Vue.js에 어플리케이션에 대한 상태 관리를 도와주는 라이브러리이다. 어플리케이션에 모든 컴포넌트에 대한 중앙집중식 저장소 역할을 하며 예측 가능한 방식으로 상태를 변경하는 기능을 가지고 있다. React에서 Redux가 존재하듯, V
9.B.TIL 08 : Event
키 이벤트 마우스 이벤트 HTML javascript
10.B.TIL 09: VueWatch
Vue는 Vue 인스턴스의 데이터 변경을 관찰하고 이에 반응하는 보다 일반적인 watch 속성을 제공한다. 다른 데이터 기반으로 변경할 필요가 있는 데이터가 있는 경우, Watch를 사용하는게 적합한 사용방식이라 할 수 있겠다. watch 속성은 감시할 데이터를 지정하
11.B.TIL 10 : Drag&Drop
드래그 앤 드롭은 HTML이나 CSS부터 바닐라자바스크립트로도 구현 할 수 있는 액션입니다.하지만 vue를 쓸 때는 draggable 라이브러리를 추천드리고싶습니다.draggable 라이브러리는 다음과 같은 강점을 가지고 있습니다.첫째. 간편합니다.굉장히 간단한 방식으
12.B.TIL 11 : Computed
데이터의 변화를 감지하는 Watch 속성과 다르게 Computed는 method와 비슷하게 하나의 함수로서 작성됩니다. 그렇다면 method와 computed에 다른점은 무엇일까요?computed 속성 대신 메소드와 같은 함수를 정의할 수도 있습니다. 최종 결과에 대해
13.What is 모달? or 팝업?
특정 역영의 위치에 원하는 사이즈의 별도 레이어를 만들어 방문자에게 원하는 시점에 보여줍니다.팝업창의 경우 웹 시작과 동시에 띄우는 경우가 많지만 모달창의 경우 중간 중간 사용자에게 보여주는 경우가 많습니다.즉, 현재 의도하는 목적과 상관없는 경우에는 주로 팝업창을 표
14.Rebase를 통한 Git Flow 관리
기준 : Dev 브랜치1\. Git checkout -b feature/kkw 우선 개인 할당업무를 진행할 branch를 생성해준다checkout -b 를 쓰면 브랜치 생성 및 전환을 동시에 실행가능2\. Git add .업데이트 할 내용을 Add한다3\. Git co
15.B.TIL 12 : V-model.lazy
Vue를 사용하다보면 정말 많이 쓰이는게 input 태그와 같이 양방향 바인딩으로 활용되는 v-model입니다.이런 v-model에는 함께 사용할 수 있는 옵션이 있습니다. 그 중 v-model.lazy에 대하여 알아보도록 합시다. .lazy기본적으로, v-model은