공부 썸네일형 리스트형 [Vue] 프로젝트 구조 Vue 프로젝트는 기본적으로 여러 폴더와 파일들로 구성됩니다. 가장 중요한 파일 중 하나는 App.vue 파일입니다.이 파일은 Vue 애플리케이션의 시작점을 담당합니다. 아래는 Vue 프로젝트의 기본 구조입니다.🚀 1. App.vue 💻App.vue는 Vue 애플리케이션의 최상위 컴포넌트입니다.이 파일에서 애플리케이션의 레이아웃과 스타일을 설정하고, 다른 컴포넌트를 불러옵니다.App.vue의 기본 구조 Hello, Vue 3! template: 이 부분은 Vue 컴포넌트의 HTML을 작성하는 곳입니다. Vue는 template 안에 작성된 HTML을 기반으로 UI를 구성합니다.script: 이곳은 Vue 컴포넌트의 로직을 작성하는 곳입니다. export default를 사용하여 컴포넌.. 더보기 [Vue] 개발환경 설정 / 프로젝트 생성 이 챕터에서는 Vue 3 개발을 위한 환경을 설정하는 방법을 단계별로 설명합니다.Vue를 설치하고, 필요한 도구들을 설정하여 Vue 프로젝트를 시작할 수 있는 준비를 마칩니다. 🚀 1. Node.js와 npm 설치 💻Vue.js는 Node.js와 npm을 기반으로 실행됩니다. 따라서 Vue 프로젝트를 시작하려면 먼저 Node.js와 npm을 설치해야 합니다.Node.js 설치 방법:Node.js 공식 웹사이트에 접속하여 LTS 버전을 다운로드합니다.설치가 완료되면, 명령어 프롬프트(또는 PowerShell)를 열고 다음 명령어로 설치가 제대로 되었는지 확인합니다: node -v npm -v설치된 Node.js와 npm 버전이 출력되면 정상적으로 설치된 것입니다. ✅설치 경로 확인:Node.js와 np.. 더보기 [Vue] Vue 3 Tutorial for Beginners 👉Chapter 1: 0:00 - 소개Vue.js의 기본 개념과 그 장점에 대해 소개합니다. 왜 Vue.js를 배워야 하는지, 다른 프레임워크와 비교했을 때 어떤 점이 유리한지 설명합니다.👉Chapter 2: 0:42 - 개발환경 설정Vue 개발을 위한 환경을 설정합니다. Node.js와 npm을 설치하고, Vue CLI를 설치하는 방법을 단계별로 안내합니다.개발 툴 추천 (VS Code, Vetur 확장 등)도 함께 소개합니다.👉Chapter 3: 4:14 - Vue 3 프로젝트 생성Vue CLI를 사용하여 Vue 3 프로젝트를 생성하는 방법을 설명합니다.프로젝트 구조와 주요 파일 설명을 통해 기본적인 이해를 돕습니다.👉Chapter 4: 6:57 - 문서에 데이터 표시하기Vue에서 데이터를 어.. 더보기 [디자인] 피그마 툴 구조 2-1 파일 브라우저 소개File browser (=Workspace)파일 브라우저는 파일을 생성 및 관리하고 커뮤니티로 이동할 수 있는 공간입니다.- Account 툴 바 내 계정 메뉴와 계정 전환을 통해 새로운 계정을 추가하고 계정을 전환할 수 있습니다.- Notifications권한, 코멘트, 커뮤니티 등의 활동에 대한 알림을 확인할 수 있습니다.- Recents최근에 보거나 편집한 파일 및 프로토타입을 확인할 수 있습니다.- DraftsDrafts는 팀과 프로젝트 내 소속되어있지 않은 파일들이 모여있는 개인 공간입니다.Drafts의 Deleted 메뉴를 통해 모든 아카이브 내 삭제 파일을 확인 할 수 있습니다.- Team공통으로 편집 가능한 영역으로, 플랜이 할당되는 단위입니다.-Workspace.. 더보기 [디자인] 피그마 소개 1-1 피그마 등장 배경1-2 회원가입1-3 데스크탑 앱과 웹 더보기 이전 1 다음
