반응형 vuejs8 스텝5) vue.js 개념 정리 후 진행해보자~ 아직 머릿속에 vuejs의 개념이 잘 잡히지 않은것 같다. 그런 상태에서 nuxt3를 하자니 복잡하게만 느껴진다. 더욱이 naver map예제는 jquery를 사용하고 있다. 차라리 이게 더 친숙하군..ㅋㅋ 우선 여태 vuejs를 작성한 포스팅을 보자!! 문제를 파악해보고 조금 더 나아가보자구~:) 2018.09.10 - [Front/Vue.js] - Vue.js 맛보기 2019.05.31 - [Front/Vue.js] - [acet-#1] Vue.js 무작정 해보기(기본-Vue.js? 좋은거? 먹는거?) 2019.06.04 - [Front/Vue.js] - [acet-#2] Vue.js 무작정 해보기(용어 등 훝어보기!) 2019.06.12 - [Front/Vue.js] - const definitio.. 2023. 8. 17. 스텝2) setup web application for naver maps web application은 여러가지가 있는데 현재 셀에서 최근에 작업했던 nuxt3으로 진행하려고 합니다. 참고 : https://nuxt.com/docs/getting-started/installation 1) 설치 npx nuxi@latest init cd jejuMap npm install npm run dev result) InteliJ를 사용한다면 아래와 같이 run 스크립트로 실행하게끔 해놓는다. nuxt 파일 중에 nuxt.config.ts 라는게 있는데 이 파일은 스크립트 추가, 모듈 등록 또는 렌더링 모드 변경등에 사용 됩니다. import없이 globally하고 사용할 수 있다! runtimeConfig export default defineNuxtConfig({ runtimeCon.. 2023. 8. 1. vue.js 실습) 프로젝트 생성 및 분석 주저리 앞서 지난 시간에 vue.js 많은 이론들에 대해서 살펴보다가 말았다ㅋㅋ 이제는 Back-End 개발자들을 위해 하나의 프로젝트를 생성해보면서 vuejs 아키텍처 가이드를 만들어보자! :) 바로 실습 들어가자! 위의 스크린캡쳐는 여러가지 정보를 담고 있다. 모르는 부분이 있다면 한번씩 검색해서 찾아보도록 하자. 1. npm node package manager의 약자로 node.js의 모듈 관리를 하기 위해 사용 - install : package를 설치할 때 사용 예) npm install 패키지명 package.json에 포함된 의존성 패키지들이 일괄적으로 설치 됩니다. - init : 프로젝트를 초기화 해주는 명령어로 package.json file을 만들어줍니다. npm init --hel.. 2022. 11. 16. Vue.js : SyntaxError: Cannot use import statement outside a module 간만에 앞단을 해보는데 오류가 발생! 오류내용 /usr/local/bin/npm run serve > kong-ui@0.0.0 serve /Users/terrypark/Project/kong-ui > vite preview /Users/terrypark/Project/kong-ui/node_modules/vite/bin/vite.js:2 import { performance } from 'node:perf_hooks' ^^^^^^ SyntaxError: Cannot use import statement outside a module at Module._compile (internal/modules/cjs/loader.js:892:18) at Object.Module._extensions..js (inte.. 2022. 10. 18. 제 4장 Vue.js 기초 이론 2021.08.17 - [Front/Vue.js] - 제 3장 Vue.js 둘러보며 친해지기! 저번 시간에 이래저래 필요한 것들에 대해서 알아보았다. 이제는 조금 더 파고 들어서 관련 내용들을 이해할 수 있도록 공부해보자. Vue.js는 SPA(Single Page Application) Framework Vue Instance는 MVVM패턴의 View Model에 해당 var vm = new Vue({ /* options */ }) 형태 참고 형태(View, Model) View는 vm.$el // The View 형태 vm.$data // The Model 형태 View(DOM)와 MOdel(Javascript Object) 사이의 통신을 가능하게 해주는 역할. binder를 가지고 있어 View와 .. 2021. 9. 7. 제 2장 Vue.js 프로젝트를 github과 연동 2021.08.14 - [Front/Vue.js] - 제1장 - Vue.JS 환경설정과 프로젝트 생성 제1장 - Vue.JS 환경설정과 프로젝트 생성 Vue.js 이녀석...찍먹만 하고 제대로 안했더니 이도저도 아닌게 되버렸다. 아래는 ace-t의 찍먹 현장 입니다 ㅋㅋ 2018.09.10 - [Front/Vue.js] - Vue.js 맛보기 2019.05.31 - [Front/Vue.js] - [acet-#1] Vue.js.. acet.pe.kr 저번 스터디에서는 로컬 개발환경 셋팅 및 프로젝트를 생성해보았습니다. 오늘은 만들었던 프로젝트를 github에 연동하는 것을 해보도록 하겠습니다. 다들 아시겠지만..! github은 소스를 관리해주는 녀석 입니다. 아~주 오래전 호랑이 담배피던 시절 githu.. 2021. 8. 14. 제1장 - Vue.JS 환경설정과 프로젝트 생성 Vue.js 이녀석...찍먹만 하고 제대로 안했더니 이도저도 아닌게 되버렸다. 아래는 ace-t의 찍먹 현장 입니다 ㅋㅋ 2018.09.10 - [Front/Vue.js] - Vue.js 맛보기 2019.05.31 - [Front/Vue.js] - [acet-#1] Vue.js 무작정 해보기(기본-Vue.js? 좋은거? 먹는거?) 2019.06.04 - [Front/Vue.js] - [acet-#2] Vue.js 무작정 해보기(용어 등 훝어보기!) 2019.06.12 - [Front/Vue.js] - const definitions are not supported by current javascript version 2019.06.18 - [OpenSource/Spring Boot] - VueJS를 연동.. 2021. 8. 14. Vue.js 맛보기 vue-cli 설치terrypark@localhost ~ sudo npm install vue-cli -gPassword:npm WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)⸨░░░░░░░░░░░░░░░░░░⸩ ⠴ fetchMetadata: WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)/usr/local/bin/vue -> /usr/local/lib/node_modules/vue-cli/bin/vue/usr/local/bin/vue-list -.. 2018. 9. 10. 이전 1 다음 반응형
