728x90
📍 70일 차 1.29. 토. 프로젝트 5일 차 TL;DR
firebase로 간단하게 작은 사이즈의 프로토타입을 만들 때 빠르고 쉽게 사용할 수 있는 좋은 스택이지만, 현업에서는MERN스택도 사용하는 곳이 많다. 공부하는 입장에서MERN스택을 사용한다면 백과 프론트의 전반적인 흐름도 알 수 있고,web framework를 사용하게 될 상황도 많고, 확장성측에서도MERN사용하는 것을 추천한다.- 회원 인증, 권한 구현 할 때
cookie를 사용하면 미들웨어에 무조건cookie-parser를 설치하자.. 이것때문에 2시간 고생함.. - 프런트에서
API를 가져다 사용할 경우. 만약에API가 에러가 나서 정상적인data를 가져오지 못할 때는 어떻게 처리할 것인가? 404페이지로 이동시킬 수도 있지만 백에 미리 저장되어있는db에서 값을 내려줘도 된다. Backend에서API를 가공한 다음에 처리하자. 화면에서 가공해야 하는 데이터들이 사용하는API들만으로 가능하지 않은 경우가 있을 수 있어서 필요한API내용들을 받아주고, 가공해서Frontend로 내려주는 것이 좋을 것 같다.- API처리 로직: 클라이언트 -> 서버(커밋 수 요청) -> 서버에서 API요청 -> 받아온 정보로 DB 갱신 -> 클라이언트에게 응답
- 인증 / 권한 페이지 로직
1. 권한: `client`에 `JWT` 토큰 값을 `cookie`에 담아 `server`로 보냄. -> 토큰이 만료되었거나 일치하지 않으면 `status(401)`리턴
2. 인증: `GitHub OAuth` -> `db`에서 해당 `id`와 일치하는 `id`를 찾고 없으면 새로 만들어서 저장 -> `cookie`로 `JWT`토큰 값 `browser`로 전송
- 서버는 프론트에서 요청한 결과가 올바른지 아닌지를 결괏값으로만 내려준다. 그리고 프런트에서 결괏값을 토대로 다음 로직을 구성한다.
- 프론트에
json형태로 값을 내려줄 거면res.send대신res.status(200).json({ isOk: true, postId });와 같은 형태로 내려주자.res.status(200).json은json형태로 내려준다는 의미가 포함되어있으나,res.send는 의미가 불명확하다. 또한,res.send로 전송하게 되면 불필요한 함수를 한번 더 호출하게 된다. 참고(harguri.github.io)
반응형
'Frontend > 엘리스 SW 엔지니어 트랙' 카테고리의 다른 글
| [ 엘리스 SW 엔지니어 트랙 ] 71일차 TL;DR (0) | 2022.02.08 |
|---|---|
| [ 엘리스 SW 엔지니어 트랙 ] 방학, 백엔드 folder structure (0) | 2022.02.03 |
| [ 엘리스 SW 엔지니어 트랙 ] 69일차 TL;DR (0) | 2022.01.28 |
| [ 엘리스 SW 엔지니어 트랙 ] 68일차 TL;DR (0) | 2022.01.27 |
| [ 엘리스 SW 엔지니어 트랙 ] 67일차 TL;DR (0) | 2022.01.26 |
댓글