안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 - vue-router: 4.1.3 VUE에서는 아래와 같은 라이프사이클 훅이 존재합니다. 상황에 맞춰서 사용한다면 좋은 퍼포먼스를 낼 수 있습니다. 크게 beforeCreate, beforeMount, mounted, beforeUpdate, update, beforeUnmount, unmounted가 있습니다. 1. beforeCreate 사용하기 (setup) # VUE3에서는 setup 프로퍼티가 create를 담당하고 있음 # 0..

안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 vue는 javascript언어로 javascript는 비동기입니다. 1. 비동기 확인하기 # 1~3 console.log 추가, 기대값 1. 유저 데이터 ==> {} 2. 유저 데이터 ==> db.json 3. 유저 데이터 ==> db.json log가 순서대로 출력되지 않음을 확인할 수 있습니다. 2. async / await를 사용하기 # async로 function 선언, 기다려야하는 작업에 await async setup() { ..

안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 서버와 통신해야 할 때 많이 사용하는 함수는 axios입니다. 1. axios 설치하기 npm i axios --save 2. db.json에 값 비워놓기 (json-server 설치가 되어있지 않으면 링크를 통해 진행하기) users라는 데이터만 만들어 놓고 안에 값은 비어놓은 상태입니다. 3. axios를 사용해서 db.json에 값 추가하기 # axios import import axios from 'axios'; # axios는 g..