본문 바로가기

전체 글81

[vue] TransitionGroup * TransitionGroup - tag 속성에 애니메이션이 들어갈 HTML 태그 이름(p,ul,section..)을 지정한다 - name 속성은 이후에 추가할 css 클래스와 연관 - 태그에 :key 추가한다. 목록에 애니메이션을 적용하려면 안의 대상 태크에 :key 속성을 꼭 지정해야한다. {{ item }} --css 2023. 5. 2.
[vue] TODO App 만들기_1 * 핵심 - 데이터 전달 상위->하위 props 로 데이터 전달 - 하위->상위 이벤트 실행 this.$emit('addTodo', value); 참조) * todoapp 동작 https://vuejstodo-aa185.firebaseapp.com/ * do it todoapp 소스 https://github.com/joshua1988/doit-vuejs GitHub - joshua1988/doit-vuejs: 'Do it! Vue.js 입문' 책 예제 코드 저장소 'Do it! Vue.js 입문' 책 예제 코드 저장소. Contribute to joshua1988/doit-vuejs development by creating an account on GitHub. github.com 2023. 5. 1.
[vue] fontawesome 사용(아이콘) * vue3버전 기준으로 cli로 설치하기 1. Add SVG Core npm i --save @fortawesome/fontawesome-svg-core 2. Add Icon Packages # Free icons styles npm i --save @fortawesome/free-solid-svg-icons npm i --save @fortawesome/free-regular-svg-icons npm i --save @fortawesome/free-brands-svg-icons # Pro icons styles npm i --save @fortawesome/pro-solid-svg-icons npm i --save @fortawesome/pro-regular-svg-icons npm i --save .. 2023. 5. 1.
[vue] 뷰 CLI / 뷰 로더 웹팩(Webpack) * 뷰 CLI - 뷰 코어에서 제공하는 CLI 도구 - 커맨드 창에서 명령어로 특정 동작을 수행할 수 있는 도구 - Node.js 필요 - package.json vue init 명령어로 프로젝트 생성시 package.json 파일도 생성 package.json파일은 프로젝트 정보를 담고 있는 설정파일이며 npm 명령어 및 뷰로 애플리케이션을 제작시 필요한 라이브러리 정보포함 - node_modules 웹팩을 빌드하기 위한 바벨(Babel) 및 여러가지 로더 웨백데브서버등 라이브러리 등이 설치된다 - 뷰 CLI 프로젝트 구성 1) 뷰 CLI 설치 npm install -g @vue/cli 2) 프로젝트생성 vue create 프로젝트명 3) 관련 라이브러리 설치 npm install 4) 프로젝트 구동 .. 2023. 4. 30.