💻 풀스택 미니 프로젝트
✏ 프로젝트 기간: 2022.01.10 ~ 2022.01.13
✏ 팀원: 4명
✏ 프로젝트 명: mong
✏ 프로젝트 소개: 감성 태그에 맞춰 공유해주는 음악 리스트 및 댓글 공유하는 플랫폼!백지 상태인 코린이가 첫 프로젝트를 진행하면서 험난한 개발 세계에서 살아남고자 아등바등 쫓아가는 대서사를 기록하기 위한 글.
📌 JWT란
JWT에 대해 말하기 전에 먼저, 로그인기능과 HTTP에 대해 알아보자.
HTTP(Hyper Text Transfer Protocol)란 서버와 클라이언트 간의 프로토콜(통신 방법)이다. 로그인 기능을 이용하기 위해서는 서버와 클라이언트가 데이터를 주고받는 통신 방법이 필요한데 이것을 바로 HTTP라고 한다.
그래서 이게 왜?
앞서 HTTP에 대해 언급한 이유는 바로 HTTP의 특성 때문이다.
로그인에 걸림돌이 되는 HTTP의 두 가지 특징이 있는데 이는 바로
- 특징1)
HTTP는 연결을 유지하지 않는다
- 특징2)
HTTP는 상태를 유지하지 않는다
연결을 유지하지 않기 때문에 서버와 클라이언트가 한 번 통신한 후 연결이 끊어진다. 또한 상태를 유지하지 않기 때문에 서버, 클라이언트는 다음 통신 때 이전 통신에 대한 정보를 가지고 있지 않다.
따라서, 서버에 요청을 보낼 때 마다 매 번 자신이 누구인지 인증을 해주어야만 한다.
ex) 네이버 메일 확인할 때 로그인, 스팸 삭제할 때 로그인, 메일 보낼 때 또 로그인!
이런 번거로운 작업을 하지 않을 수 있게 해주는 것이 바로 JWT(Json Web Token)이다.
별도의 저장소의 관리가 필요한 세션/쿠키와 달리 JWT는 발급한 후 검증만 하면 되기 때문에 추가 저장소가 필요 없어 간편하다는 장점이 있다. (Stateless한 서버를 만드는 입장에서의 큰 강점)
📌 API는 레스토랑의 점원이다
레스토랑에서 손님에게 주문 가능한(선택 가능한) 메뉴를 보여주고 손님이 고른 음식을 주방에 전달 후, 음식이 나오면 고객에게 전달하는 점원이 API인 거다.
📌 서버 사이드 렌더링 써보니까 좋은 점은
크게
검색 엔진 최적화
빠른 페이지 렌더링
검색 엔진 최적화란 구글, 네이버와 같은 검색 사이트에서 검색했을 때 결과가 사용자에게 많이 노출될 수 있도록 최적화 하는 기법이다. 특히, SNS에서 링크를 공유했을 때 해당 웹 사이트의 정보를 이미지와 설명으로 표시해주는 OG Tag를 페이지 별로 적용할 때 효율적. 또한, 서버 사이드 렌더링은 빈 HTML 페이지를 받아 브라우저에서 그리는 클라이언트 사이드 렌더링과 다르게 서버에서 미리 그려서 브라우저로 보내주기 때문에 페이지를 그리는 시간을 단축할 수 있다. 사용자 입장에서는 화면에 유의미한 정보가 표시되는 시간이 빨라진다.
두 가지 키워드로 명료하게 말할 수 있다.
우당탕탕 그리고 얼렁뚱땅늘 혼자 작업하는 게 익숙했던 나에게 좋은 경험이었다고 감히 말해 본다. 항해에 입성한 사람이라면 매한가지이겠지만 치열하게 습득하고, 허우적 시행착오를 겪어보고, 새로운 깨달음을 얻게 되는. 그로 인해 결과적으로 굳건한 다짐을 다시 한 번 되새겼다
나 진짜 진짜 잘하고 싶다.덕택에 느슨해진 마음가짐을 확 조일 수 있는 발판이 되었다. 아직 초반이라서 더욱더 열의를 가지는 거겠지만 앞으로의 방향성을 정한 만큼 흔들리지 않고, 내 페이스대로 줏대있게 뻗어나갈 예정이다. 수료를 마치고 다시 되돌아보면 어떤 지도가 펼쳐져 있을까 기대 만발.