Front

public 폴더의 index.html이 애플리케이션의 가장 첫번째 진입점이다. - 여기에 폰트, 아이콘 추가 하는것 Token - 사용자가 인증 되었을때만 발급되는것 로그인한 사용자의 토큰을 넣어서 API에 넘길거다. 토큰값을 어딘가에 저장하고 API 호출할때마다 사용할것 1. axios.create에 headers 추가하기 - Authorization 속성에 test1234 라고 쓴 후 API 요청을 실행했을때 네트워크 패널에서 Authorization에 test1234가 있는걸 확인 할 수 있다. import axios from 'axios'; // axios.create 할때 주입한 속성은 인스턴스로 데이터 요청 할때마다 무조건 이 속성들이 정의된 상태로 수행된다. const instance = ..

1. vuex | mutations에 clearUsernmae 함수 추가 import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); export default new Vuex.Store({ // store에서 state 는 여러 컴포넌트 간에 공유되는 데이터를 뜻한다. state: { username: '', }, // state의 값이 변경됬을때 특정 상태를 개선할수 있게 사용가능 // getters의 첫번쨰 인자는 state // getters는 기본적으로 return값을 가지고 있음 getters: { // username이 빈 문자열이면 로그인 안된상태 // 로그인 되면(빈문자열이 아니면) getters가 true로 바뀜 isLogin(stat..

loginForm 의 결과를 AppHeader로 올려줘야 하는 상황 - 이벤트를 2번 올리고 App에서 받아서 AppHeader로 props해주거나 - 이벤트버스를 활용해서 loginForm에서 바로 AppHeader로 이벤트를 보내주거나 - store (vuex - 상태 관리 패턴) 를 활용하여 User정보를 저장하고 저장한 정보를 AppHeader에서 쓰거나 - store는 하나의 통에 담아놓고 꺼내서 쓰는 구조. 이게 가장 접근하기 쉽고 관리하기 편하다. 1. vuex 설치하기 npm i vuex@3.6.2 2. vuex 설치 확인하기 - 설치되면 package.json 파일 dependencies 칸에 들어가게 된다. - dependencies는 npm run build 명령어를 실행해서 최종 자..