[원티드] 로그인 기능 구현, 하나부터 열까지!

이 글은 네이버 블로그에 2024년 8월 18일에 올렸던 것을 그대로 옮겨온 것입니다.

웹 서비스에 사용되는 로그인의 개념과, 로그인을 적용하기 위한 프론트엔드 어플리케이션 구조에 대해 알아봅니다.
로그인, 인증, 레이아웃 컴포넌트, 재사용성
서비스 레벨에서의 로그인 알아보기
로그인을 위한 UI 만들어 보기
간단한 Mock API 구성 및 토큰기반 로그인 로직 만들어 보기
레이아웃 컴포넌트의 개념 학습
로직 재사용에 대해 생각해 보기
배포된 서버의 JWT 로그인 기능을 이용해 실제 로그인 기능을 구현해 보고, 프론트엔드 어플리케이션의 구조와 기능 관점에서 학습합니다.
JWT, 보안, API 호출, cURL, 로그인, 로그아웃
로그인을 구현하는 일반적인 기술 1: 토큰 기반 로그인 동작 살펴보기
JWT의 정의 알아보기
JWT를 이용한 로그인 구현해 보기
JWT, 어디에 보관할 것인가
발생할 수 있는 보안상 문제들과 예방법
HTTP Request와 cURL
로컬 서버에 세션 기반 로그인 서버를 실행해 로그인 기능을 구현해 보고, 인프라스트럭쳐 관점에서 관련된 내용을 알아봅니다.
세션, 로컬호스트, 인프라, 백엔드
세션과 쿠키의 정의 알아보기
로그인을 구현하는 일반적인 기술 2: 세션 기반 로그인 동작 살펴보기
로컬 서버에 세션 기반 로그인 서버 실행하기
세션을 이용한 로그인 구현해 보기
로그인 상태를 이용해 페이지 제어해보기
세션 로그인을 위해 백엔드에서 수행하는 일들
인프라 관점에서 본 프론트/백 어플리케이션의 통신과 로그아웃
실무에서 자주 등장하는 로그인과 관련된 개념들을 조금 더 자세히 알아보고, 답변하지 못했던 질문들에 대해서 답변하는 시간을 가집니다.
OAuth, 권한 관리, Refresh Token, Access Token, 싱글톤 패턴
롤 베이스 유저별 권한 관리
Refresh token과 Access token
OAuth 간단히 알아보기
프론트엔드와 싱글톤 패턴