mobssie

curl -X POST localhost:3000/login -d 'email=test@test.com&password=123123' curl -X POST localhost:3000/login -d 'email=test@test.com&password=123123' -vs | jq json형식으로 토큰값을 알아 낼 수 있음. API 에서 사용되는 토큰 정보는 클라이언트(브라우저)측에서 저장이 필요하다. 로그인 정보를 LocalStorage에서 저장하고, 로그아웃을하면 삭제하는 방식. 모든페이지에서 적용 할 수 없으니 라우터 로직을 사용하도록 네비게이션에 함수를 만든다. const requireAuth = (to, from, next) => { const isAuth = localStorage.getIt..

코드가 복잡해지고 많아지면, api요청이 많아지면 매 코드 마다 라이브라리에 의존하게 된다. 상황이 바껴서 라이브러리를 바꿀때에는 하드코딩된 부분을 바꿔야 하게 되기 때문에 의존적인 코드를 최소화하자. axios를 호출하는 코드를 별도로 만들어 주는 방법을 사용해 보자. import axios from 'axios'; const DOMAIN = 'http://localhost:3000'; const UNAUTHORIZED = 401; const onUnauthorized = () => { router.push('/login') } const request = (method, url, data) => { return axios({ method, url: DOMAIN + url, data }).then(re..

서버라우팅 : 매번 주소를 요청하면 화면이 바뀜. ex) 네이버나 구글 브라우저라우팅 : 매번 주소를 요청하더라도 화면이 바뀌지 않는다. 좀 더 효율적 화면을 갱신한다. 주소요청시 라우팅을 브라우져에서 처리하고 데이터는 백엔드 api를 통해서 서버로 부터 받아온 뒤에 마지막으로 데이터를 이용해 화면에 내려주는 것. = 싱글페이지라우팅(SPA) ex) 구글맵, 트렐로