I T H

이번 챕터는 로그인 로직 2번째 - 백앤드로부터 받아온 토큰을 headers의 Authorization에 넣어 백앤드로 보내고 백앤드에서 지정해놓은 secret key를 이용해 유효한 토큰인지 확인한 후 데이터를 프론트로 전달하는 단계까지 하도록 하겠다. - 로그인 뿐만 아니라 인증이 필요한 경우가 많으므로, 로그인 후에 인증요청시 토큰을 보내서 백앤드에서 유효한 토큰인지 확인하는 과정이다. - Frontend [ App.tsx ] - redux store에 저장된 데이터를 가져오기 위해 useSelector를 사용한다. 타입을 미리 지정해놓았기 때문 useAddSelector를 통해 isAuth를 불러와서 사용하도록 하였다. - isAuth 부분이 true가 되었다면 로그인이 완료되었다는 뜻이므로, 로..

회원가입을 마치고, 이제 react with typescript + node.js(mongodb)환경에서의 로그인을 구현해보자! 로그인은 사용자로부터 id와 패스워드를 받아서 백앤드로 전달하고 백앤드에서 토큰을 만들어서 다시 프론트앤드로 보내주게 된다. 그리고 받은 토큰을 가지고 headers의 authorization에 토큰정보를 넣어서 백앤드로 보낸다. 백앤드에서 secret key를 이용해서 프론트에서 받은 토큰이 유효한 토큰인지 확인후 유효하다면 사용자 데이터를 보내게된다. 이번 챕터는 백앤드에서 토큰을 받아오는 부분까지, 다음챕터부터는 나머지부분을 다뤄보도록 하겠다. - Frontend [ pages / types / login.ts ] - 로그인페이지의 타입들을 모아놓은 파일 export in..