Front-End

Visual Studio Code(VS Code) 개발 하는데 유용한 플러그인

유용한 플러그인 Night Owl Material Icon Theme Live Server Prettier Auto Close Tag Atom Keymap Night Owl VScode 편집기의 배경색을 눈에 부담을 주지 않는 색깔로 변환하는 확장프로그램 Material Icon Theme 파일 아이콘 이미지를 바꿔주는 아이콘 테마 확장프로그램 Live Server HTML, CSS, JS 등의 내용을 실시간으로 서버를 띄워 화면에 표시 하는 확장프로그램 live Server 서버 열기 Alt + L, O / 닫기 Alt + L, C Prettier ESLint와 같이 오류내용을 잡아주지는 않지만 코드를 자동으로 형식화 하는데 있어서 매우 용이한 확장프로그램 Auto Close Tag 자동 닫는 태그를 ..

Visual Studio Code(VS Code) 설치방법 필수 확장 플러그인

필수 확장 플러그인 Vetur Vue 3 Snippets ESLint Korea Language Pack for Visual Studio Code Extension 설치를 하려면 VS Code 좌측 사이드바 하단의 Extension 아이콘 버튼을 클릭 한다. (Ctrl + Shift + X) Vetur .vue 파일의 코드 하이라이팅을 위해서 사용 Vue 3 Snippets 스니펫을 이용하여 코드 자동 완성 ESLint JavaScript의 Coding Convention을 체크해주는 익스텐션 Korea Language Pack for Visual Studio Code 한국어 버전으로 VS Code를 사용할 수 있도록 해주는 확장 플러그인 참고 : [Vue] VSCode 유용한 확장 플러그인 [Vue] ..

Vue 개발 환경 설정

Vue 환경설정 Chrome vscode node 설치 vue.js dev tools Chrome 설치 Chrome 웹브라우저 더욱 스마트해진 Google로 더 간편하고 안전하고 빠르게. www.google.com vscode 설치 Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code...

Node.js 설치 하기

Node.js란? Node.js는 Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임 다양한 자바스크립트 애플리케이션을 실행할 수 있으며, 서버를 실행하는 데 많이 사용함 React, Vue 사용하기 위해선 설치 필요 Node.js 설치 하기 Node.js 한글 사이트에 접속해서 다운로드 ( https://nodejs.org/ko/ ) Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org LTS 버전 Stable 버전 서버환경에서 장기적으로 안정적인 지원을 제공하는 버전 잦은 업데이트를 진행 안정성과 보안성에 초점을 두어 개발 추가적인 기능개발과 기존 API기능 개..

[Vue] v-show vs v-if

v-show element 를 렌더링 후 조건에 따라 표기함 v-if 조건에 맞을 경우만 렌더링 후 표기 초기 렝더링시 조건이 false 면 아무작업도 하지 않으며 조건부 블록이 true 가 될때까지 렌더링이 되지 않음 v-show vs v-if v-show v-if 초기 렌더링 비용이 높음 전환비용이 높음 자주 전환될경우 사용하는게 좋음 런타임 시 조건이 변경되지 않을 경우 사용하는게 좋음

[Vue] computed 속성

computed 데이터 연산을 정의하는 영역 data() 속성값이 변했을 경우 이를 감지하고 자동으로 다시 연산 캐싱 (결과값을 저장) 주로 복잡한 로직 연산이 많은 로직을 처리할 때 많이 사용