CSS

루트 폴더에 data.js 파일을 아래와 같이 만들어줍니다. 그리고 pages 디렉토리를 만든 후 안에 index.vue 파일을 만들어줍니다. 참고로 vuetify에선 class에 ma-3과 같은 이름을 추가함으로써 마진과 패딩을 줄 수 있습니다. 참고: https://vuetifyjs.com/en/styles/spacing/ CSS Spacing helpers Spacing helper classes allow you to apply margin or padding to any element in increments from 1 to 5. vuetifyjs.com 홈페이지와 투두 페이지를 나눠주기 위해서 NuxtLink를 사용해 라우팅을 해줍니다. 넉스트에서는 자체적으로 vue-router를 사용해서 ..

완전히 새로운 스택들로 새 프로젝트를 시작할 일이 생겨서 배웠던 내용을 정리하기 위해 todolist강의를 제작하게 되었습니다. 사전 학습 목록 vue3.js javascript typescript 사전 설치 목록 node.js yarn node.js는 최신 lts 버전을 설치해주세요. Nuxt3 설치 npx nuxi init nuxt3-vuetify3-pinia cd nuxt3-vuetify3-pinia yarn install 위 코드를 실행하면 기본 라이브러리가 모두 설치됩니다. pinia와 vuetify3 설치 yarn add vuetify@3.0.0-alpha.12 sass pinia 설치가 완료되고 나면 아래와 같이 plugins 폴더 아래에 파일을 생성해주세요. 두 파일을 생성했으면 각 내용을..

내용 지속적으로 추가 예정입니다! 자바스크립트 버전 2009: ES5 2015: ES6 2016: ES7 2015년부터 2015 → ES6과 같은 방식으로 1씩 올라가는 네이밍을 하기 시작했다. Console.log() 자바스크립트에는 console이라는 콘솔 출력을 위한 객체가 있다. 나중에 다루겠지만 변수를 디버그 하는데 있어서 가장 기본적인 요소이므로 시작에서 다루고 넘어간다. console.log(0) // console창에 0 출력 Strict 모드 사용 변수 선언자 없이 변수 선언을 하면 에러를 발생하게 해준다. // 맨 위에 'use strict'; 명시 'use strict'; var a = 1 // ok a = 1 // error 1. 기본문법 1.1 변수 특성/변수명 CONST VAR ..

각 마우스 포인터의 액션에 따른 태그의 형태를 지정할 수 있습니다. 1. a:link{ a 태그의 기본 속성을 지정할 때 사용합니다. } 2. a:hover{ a 태그에 마우스 오버시 속성을 지정할 때 사용합니다. } 3. a:visited{ 방문한 경우의 속성을 지정합니다. } 4. a:active{ 누르는 순간을 지정합니다. } 5. a: focus{ 포커싱 되는 경우의 속성을 지정합니다. } 5번의 경우에는 input태그 등이 다음 입력으로 인한 focus를 얻을 시 하이라이트를 주는 등의 액션에 이용될 수 있습니다.(예: 설문지, 이용약관 등) 방문함 방문안함 출처: https://rongscodinghistory.tistory.com/18 [악덕고용주의 개발 일기]