Today, I will

1. jwt란? Json Web Token의 약자로, 전자 서명이 된 토큰 . 을 기준으로 헤더, 페이로드, signature 로 나뉘어져 있다. // header.payload.signature header 헤더에는 일반적으로 typ라고 해서 해당 토큰의 타입이 들어있다. 또한 alg라고 해서 토큰을 서명하기 위해 사용된 해시 알고리즘이 들어있다. payload는 해당 토큰의 주인, iat 즉 토큰이 발행된 시간, exp 토큰이 만료되는 시간이 들어있다.(기본 형태가 그렇다는 뜻) jwt 홈페이지를 보면 jwt 토큰은 Encoded 안에 있는 형식의 토큰을 만들어주고, DATA payload를 보면 들어갈 데이터도 넣을 수 있다. 또한 토큰의 만료 기한 같은 것들을 설정할 수 있다. 토큰이 만료되면, ..

1. 리액트의 문제해결 (1) 렌더링 기준 : 컴포넌트의 상태(State) 리액트는 컴포넌트 단위로 관리한다. 일반 html은 한 페이지 단위로 새로고침이 발생한다. 즉, 한페이지 단위로 렌더링하는 것이다. 유튜브 같은 경우 영상을 날라 용량이 크고 지속적으로 페이지 자체의 로딩이 느리다. 그런데 어떠한 상태 하나만 바뀌었다고(좋아요만 클릭함) 페이지 자체가 다시 렌더링되는 것은 로드 시간 낭비일 뿐더러 영상이 다시 처음부터 시작하게 된다. 반면, 좋아요만 클릭해서 좋아요 상태만 바뀔 수 있다면, 영상이 끊기지 않고 계속 이어질 것이다. 리액트에서는 이러한 '상태'를 관리하게 될 것이다. state와 이를 상속받은 props 같은 아이들이 이에 해당한다. (2) props 예시 가령 제일 최상단 배너 컴..

DTO, Controller, 순으로 작성하도록 한다. 1. 회원가입 요구사항 확인 2. 회원가입 api 작성 (DTO) 회원가입이란, 데이터베이스에 사용자를 등록하는 행위이다. 이제 회원가입에 대한 api를 작성해보도록 한다. http POST 메소드를 사용해서 통신을 할 것이다. POST 메소드는 데이터를 리퀘스트 바디에 담아서 전달해준다. 즉, 데이터를 숨겨서 보내기 때문에 GET보다 보안에 조금 더 유리한 부분이 있다. 회원가입을 할 때에는 사용자가 이메일 주소와 비밀번호, 비밀번호 확인, 닉네임, 핸드폰번호, 주소, 상세 주소를 입력해서 회원가입을 진행한다. (1) 3000번 포트 POST 리퀘스트 매핑은 /api/auth/signUp (2) 리퀘스트 바디에 데이터를 담기 ( userEmail,..