Beyond the Laziness

기존 포스팅에서 vue.js 개발을 위해 필요한 개발환경 구성을 위한 "node.js 설치 / Visual Studio Code 설치 / Build 환경 구성 / 서버 기동" 등에 대해서 알아보았습니다. 그럼, 이번에는 실제 vue.js 프로그램 개발을 위해 수정해야 하는 메인 파일인 App.vue 파일의 내용을 수정하고 이를 build 해 정상적으로 개발한 내용이 적용되는지 확인해 볼게요. 지난 포스팅에서 생성한 C:\vue_test 프로젝트 폴더를 열어줍니다. 그러면 아래와 같이 팝업이 뜨는데요. 선택한 폴더의 파일과 제작자에 대해서 신뢰를 하는지 물어봅니다. 해당 경로에 있는 프로그램은 자동적으로 수행될 수 있으므로 신뢰여부를 물어보는데요. 당연히, "Yes, I trust the athors"를 ..

Vue.js를 통해 애플리케이션을 코딩해 프로그램을 만들기​ 위해서는 프로그래밍할 수 있는 코딩 개발툴을 설치해야 하는데요. 많이 사용되는 것이 바로 Microsoft 사의 Visual Studio Code 입니다. 비주얼 스튜디오 코드는 가벼워 쾌적한 개발환경을 제공하고 다양한 프로그래밍 언어를 사용할 수 있어 많은 사람들이 사용하고 있습니다. 그럼 실제 설치해보면서 과정을 남겨볼게요. 먼저 아래 사이트를 방문해 설치파일은 다운로드 받습니다. Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and ..

지난 포스팅 과정에서 node.js 설치와 Visual Studio Code를 설치해봤는데요. 이제 본격적으로 Vue.js 실습을 진행해 보려고 합니다. 1. 프로젝트 생성 먼저 샘플 코드 작성을 하기 위해서는, vue 프로젝트를 생성해야 합니다. 프로젝트를 생성하기 위해서는 프로젝트가 위치할 경로를 결정해야 하는데요. 이번에는 찾기 쉽게 C:\ 아래에 바로 프로젝트를 생성해보려고 합니다. 비주얼 스튜디오 코드에서 터미널 탭으로 이동하면 콘솔창에서 명령어를 수행 할 수 있는데요. 먼저 c:\ 이동하기 위해 아래 "cd c:\" 명령을 쳐줍니다. 그 다음 "npm create vue@latest" 를 쳐주면 아래와 같은 입력항목들이 나오는데요. 여기서 Project name은 "vue_test"로 작성하고..

최근 Vue.js를 통해 개발을 해보려고 공부를 하고 있습니다. 그러기 위해서는 환경을 구성해야 하는데요. 먼저 개발된 Vue.js 스크립트를 테스트하기 위한 서버와 빌드환경을 구성해야합니다. 그러기 위해서는 Node.js를 설치해야 합니다. Node.js 설치하기 아래 링크를 통해 Node.js를 다운로드 받아 설치를 진행해야 하는데요. Node.js — Download Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 본인 PC의 OS에 맞는 파일을 다운로드 해야하는데요. 현재 가장 최신의 LTS 버전은 20.11.1 입니다. 커다랗게 표시된 LTS란 Long Term Support 의 약어로 장기 지..