728x90 반응형 IT/VueJS12 vite 설치법 npm create vite@latest vite 는 vue 뿐만 아니라 react 등 다양한 프로젝트 생성이 가능하다.사용하는 언어는 javascript로 하자. https://vuejs.org/ Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org Composition API 작성 문법과 Options API 문법--> 원쌤의 Vue.js 퀵스타트 275 P 설명을 읽어볼것. ref : 상태 변수를 선언하는 함수 script setup> import HelloWorld from './components/HelloWorld.vue'import { ref } from 'vue'const msg = ref('Hello Vue 3 + Vite')scri.. 2025. 1. 28. 자식 컴포넌트로 데이터 보내기 ---------------------------------------------------------------------------------------------------------------- import MallHeader from "./components/MallHeader.vue"; import MallContent from "./components/MallContent.vue"; import MallFooter from "./components/MallFooter.vue"; export default { name: 'App', components: { MallHeader, MallContent, MallFooter }, data() { return { title: 'Vue 쇼핑몰', pr.. 2022. 8. 25. Component 로 만들어 사용하기 화면을 크게 1. Header 부분 2. Content 부분 3. Footer 부분 으로 나눠, 각 영역을 Component 로 만들어 조립하는 예제. 전체를 수용하는 App.vue 파일이 있고, 그안에 각 Component 를 끼어 넣는 구조임. 1. 프로젝트 생성 vue create vue-component 2. 실행 npm run serve 3. 실제 소스 3.1 App.vue ---------------------------------------------------------------------------------------------------------------- import MallHeader from "./components/MallHeader.vue"; import MallCont.. 2022. 8. 25. fake api server 사용 예제 서버를 개발하지 않고 테스트 할 수 있음. https://jsonplaceholder.typicode.com/ JSONPlaceholder - Free Fake REST API {JSON} Placeholder Free fake API for testing and prototyping. Powered by JSON Server + LowDB. Tested with XV. As of Oct 2021, serving ~1.7 billion requests each month. jsonplaceholder.typicode.com 하단의 Resources로 내려가서 클릭해보면...데이터를 볼 수 있다. 통신을 위해서 Http Client는 Axios 를 사용 https://github.com/axios/axio.. 2022. 8. 24. 이전 1 2 3 다음 728x90 반응형