개발 언어/NodeJS (4) 썸네일형 리스트형 Vuex 란 무엇인가 Vuex 란 Vue.js 애플리케이션에 대한 상태 관리 패턴 + 라이브러리 입니다. 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 합니다. State Vuex 는 단일 상태 트리를 사용합니다. 즉, 이 객체는 모든 애플리케이션 수준의 상태를 포함하여 '원본 소스' 역할을 합니다. 이는 각 애플리케이션마다 하나의 저장소만 갖게 된다는 것을 의미합니다. Getters 둘 이상의 컴포넌트가 이를 사용해야하는 경우 함수를 복제하거나 공유된 헬퍼를 추출하여 여러 위치에서 가져와야 합니다. const store = new Vuex.Store({ state: { todos: [ { id: 1, text: '...', done: true }, { id: 2, text: '...', done: false.. [Vue2x] Progress Bar 적용 저는 Vue 2x 사용할 때 Light Vue API 의 Progress Bar 를 적용했습니다. https://lightvue.org/ LightVue | The Emerging UI Component library for Vue The Emerging UI Component library for Vue 2.x & Vue 3.x lightvue.org LightVue 설치 // For Vue 2.x npm install lightvue --save // For Vue 3.x npm install lightvue@next --save 적용 예시 위와 같이 적용해주면 된다. 자세한 설명은 LightVue 의 Document 를 참고하시면 됩니다. ㅎㅎ 해당 설정을 Nuxt.JS 에서 사용 시 Chrome .. [NuxtJS] 명령어 정리 Nuxt.JS 에서 사용하는 명령어 명령어 설명 nuxt 개발 서버를 핫 리로딩 상태로 localhost:3000 에 시작 nuxt build Webpack 을 통해 애플리케이션을 빌드하여, CSS 와 JS 를 최소화하는 작업을 진행 nuxt start 프로덕션 모드로 서버 시작 (nuxt build 를 실행한 후에 명령어 입력하기) nuxt genrate 애플리케이션을 빌드하고 모든 라우터를 html 파일로 생성 (정적 호스팅에 사용하기) 이 명령문은 package.json 에 작성되어야 합니다. "scripts": { "dev": "nuxt", "build": "nuxt build", "start": "nuxt start", "generate": "nuxt generate" } 해당 명영어 사용은 다.. Nuxt.JS 알아보기 Nuxt.JS 정의 및 특징 Nuxt.JS 정의 Nuxt.JS는 Vue.js 애플리케이션 개발을 보다 강력하고 사용하기 쉽게 만들어주기 위한 프레임 워크입니다. Nuxt.JS 특징 Vue 파일 사용 코드 분할 자동화 SSR 통한 SEO 비동기 데이터 기반의 강력한 라우팅 시스템 정적 파일 전송 ES2015+ 지원 JS & CSS 코드 번들링 및 압축 요소 관리 전 처리기 지원 Nuxt.JS 디렉토리 asserts CSS, Image 등등 Front 관련 리소스를 포함한 디렉토리 components 애플리케이션에서 사용될 컴포넌트들을 포함하여 해당 경로에 위치된 컴포넌트들은 Nuxt.JS의 비동기 데이터 함수인 asyncData 또는 fetch 함수를 쓸수 없다. layouts 애플리케이션 전체에 대한 레.. 이전 1 다음
