스프링 부트 + 리액트 프로젝트를 진행하면서 몰랐던 부분

Spring Security

의존성만 추가하면 기본적으로 /login 페이지가 적용된다. 
id는 user, 비밀번호는 Spring Security가 잘 적용되었다면 스프링 부트를 실행할 때 비밀번호를 준다. 그 번호를 입력하면 된다.

This generated password is for development use only. 
Your security configuration must be updated before running your application in production.

이런식으로 의존성을 추가하면 로그인 페이지를 기본 제공하는데 추후에 커스텀이 가능하고, 각 페이지마다 ROLE_USER 또는 ROLE_ADMIN의 권한을 주어 로그인이 필요한 페이지를 스프링에게  알려주면, 사용자의 권한에 따라 알맞는 페이지만 접속할 수 있도록 제어해준다. 

React Form Control

익숙하지 않지만 같은 단어이기 때문에 헷갈렸다. 자바스크립트의 <form>과 리액트의 <Form>은 엄연히 다르다. 
전자는 그저 우리에게 익숙한 HTML 태그가 맞지만 후자는 JSX 문법으로 작성된 컴포넌트이다.

필자는 돈을 주고 구매한 리액트 템플릿을 적용하려고 하는데, 각 컴포넌트가 TypeScript로 인터페이스화 되어 있었다.
처음엔 뭔가 싶었는데 보다 보니, 지정할 수 있는 type 혹은 기본 속성이 명시되어 있었다.
왜 버튼을 눌러도 form submit이 발생하지 않는가 싶었더니 default type이 button이었다. 
type을 submit으로 변경해주니 정상적으로 작동한다.

Redirect (스프링 - > 리액트)

리액트에서 서버를 호출하는 경우에는 프록시 설정이 되어있기 때문에 상관없지만, 서버에서는 회원가입 또는 로그인 같은 작업을 처리 후 다시 어떻게 리액트를 호출하는지 몰랐는데, 그냥 단순하게 기본 문법에 redirect할 페이지의 url을 적어주면 된다. 
단, 주의할 점은 url의 가장 앞에 /를 사용하면 현재 url에 달라붙기 때문에 주의하자.

return "redirect:/http://localhost:8890/extra-pages/login"; (X)
return "redirect:http://localhost:8890/extra-pages/login";  (O)