[항해99] 미니프로젝트(Day3)

2021.04.14(수)
: 로그인과 회원가입API연결하기

1. JWT토큰 방식으로 로그인 구현하기
   : id와 pw를 입력하고, 로그인하기 버튼을 클릭하면 api를 요청하여 서버에서 JWT 토큰값을 받아온다.

2. React-Spring 간 axios를 이용하여 API 통신을 진행
   : POST방식으로 회원가입/로그인에 필요한 정보를 서버로 보내면,
   서버는 회원가입시에는 이메일/닉네임 중복여부를, 로그인시에는 정보 일치 여부를 확인하여 사용자 정보(JWT토큰)를 클라이언트에 전달

• 클라이언트는 전달받은 사용자 정보를 Redux에 저장하여 회원 서비스 이용가능하도록 처리

3. 로그인 상태유지

• 로그인체크하는 액션을 생성하고, App.js에서 제일 처음 렌더링 될 때 localStorage에 저장한 token이 있으면 true를 아니면 false를
• token이 있으면, loginCheck함수를 실행시켜라
  -로그인하면, Header가 변경되니까
  //스토어의 user모듈의 state중에 is_login
  //is_login이 true일때 Header와 false일때 Header 다르게 return 되도록
  const is_login = useSelector((state) => state.user.is_login);

🚀로그인 버튼을 눌러서 id,pw를 api로 보내서 백에서 확인하고 응답받고 싶어!!
1. 어떤 값을 변경시키고 싶은데? id, pw
const [id, setId] = useState('');
const [pw, setPw] = useState('');

2. 스토어 데이터를 가져와야하는데?!
   //스토어의 user모듈의 state중에 is_login
   const is_login = useSelector((state) => state.user.is_login);