Every step counts

Node.js Node.js란? 자바스크립트는 브라우저를 조작하는 유일한 언어지만 브라우저 밖에서는 구동 불가 구동을 위한 런타임 환경인 Node.js로 인해 브라우저가 아닌 환경에서도 구동할 수 있게됨 Chrome V8엔진을 제공하여 여러 OS 환경에서 실행할 수 있는 환경을 제공 Server-Side-Programming 또한 가능해짐 NPM(Node Package Manage) 자바스크립트 패키지 관리자 Python에 pip가 있다면 Node.js에는 npm pip와 마찬가지로 다양한 의존성 패키지를 관리 Node.js의 기본 패키지 관리자 Node.js 설치 시 함께 설치됨 Vue CLI Vue 개발을 위한 표준 도구 프로잭트의 구성을 도와주는 역할 확장 플러그인, GUI, Babel등 다양한 t..

computed Vue instance가 가진 options 중 하나 computed 객체에 정의한 함수를 페이지가 최초로 렌더링 될 때 호출하여 계산 계산 결과가 변하기 전까지 함수를 재호출하는 것이 아닌 계산된 값을 반환 10_computed.html에서 methods와의 차이 확인 methods VS computed methods 호출 될 때마다 함수를 실행 같은 결과여도 매번 새롭게 계산 computed 함수의 종속 대상의 변화에 따라 계산 여부가 결정됨 종속 대상이 변하지 않으면 항상 저장(캐싱)된 값을 반환 watch 특정 데이터의 변화를 감지하는 기능 watch 객체를 정의 감시할 대상 data를 지정 data가 변할 시 실행할 함수를 정의 첫번째 인자는 변동 후 data 두번째 인자는 변동..

Template Syntax 렌더링된 DOM을 기본 Vue instance의 data에 선언적으로 바인딩 할 수 있는 HTML 기반 template syntax를 사용 렌더링된 DOM: 브라우저에 의해 보기 좋게 그려질 HTML 코드 HTML 기반 template syntax: HTML 코드에 직접 작성할 수 있는 문법 제공 선언적으로 바인딩: Vue instance와 DOM을 연결 Text Interpolation 가장 기본적인 바인딩(연결) 방법 중괄호 2개로 표기 DTL과 동일한 형태로 작성 Text interpolation 방법은 모두 일반 텍스트로 표현 Raw HTML v-html directive를 사용하여 data와 바인딩 directive - HTML 기반 template syntax HT..

개요 Front-end 개발은 Web App 또는 Web Site의 UI/UX를 제작하고 관리하는 과정 Front-end 프레임워크와 라이브러리(React, Angular, Vue.js)를 사용하여 개발 효율성을 높잉고, Web App의 복잡성을 관리 Front-end 개발에 사용되는 주요 기술은 HTML, CSS, JavaScript Web App 이란? 웹 브라우저에서 구동되는 서비스 웹 페이지가 그대로 보이는 것이 아닌 디바이스에 설치된 App처럼 보이는 것 웹 페이지가 디바이스에 맞는 적절한 UX/UI로 표현되는 형태 SPA(Single Page Application) 이전까지는 사용자의 요청에 대해 적절한 페이지 별 template을 반환 SPA는 서버에서 최초 1장의 HTML만 전달받아 모든 ..