Spring boot와 React를 사용한 방명록

1. 개요 5
2. 개발 환경 7
3. 프로젝트 생성 8
3.1.1. 이클립스에서 프로젝트 생성하기 8
3.1.2. vscode 사용 시 프로젝트 생성 10
4. 파일 구조와 파일 생성 11
4.1. 방명록 관련 자바 클래스 11
4.2. mybatis 관련 클래스 11
4.3. css 관련 파일 12
4.4. react 관련 js 파일(컴포넌트) 12
5. spring boot 환경 설정 12
5.1. dependency 추가 13
5.2. lombok 설정 17
6. 테이블 생성 19
6.1. 사용자 테이블 및 샘플 데이터 입력 19
6.2. 방명록 테이블 20
6.3. 방명록 요구 사항 20
7. 주요 화면 21
8. React 컴포넌트 만들기 22
8.1. 홈 화면 컴포넌트 22
8.2. 꼬리말 컴포넌트 23
8.3. 방명록 목록 컴포넌트 24
8.4. 방명록 작성 컴포넌트 36
9. 메인 페이지 기본 구조 44
9.1. index.html 44
9.2. CSS 57
10. BACK-END 60
10.1. GuestBookVo 60
10.2. Page 61
10.3. GuestBookDao 63
10.4. GuestBookController 70
10.5. mybatis 75
10.5.1. MybaFactory 75
10.5.2. config 77
10.5.3. mapper 78
11. 후기 81

로그인/로그아웃 기능을 숙지할 수 있습니다.

대부분의 앱이든, 웹이든 아니면 모바일이든 로그인/로그아웃 처리는 기본 기능이라 볼 수 있습니다. 하지만 한번도 로그인/로그아웃 기능을 만들어 보지 않았다면 생각보다 복잡하다는 것을 알 수 있을 것입니다. 물론 보안과 관련된 것이라면 암호화를 어떻게 해야 하는지, 세션의 유지 시간은 어느 정도 하는 것이 가장 안전한지 등등의 내용이 더 필요하겠지만, 본 지면에서는 단순하게 로그인/로그아웃에 대한 기능 구현만 하도록 하겠습니다.

React를 통한 SPA(Sinple Page Application)를 개발할 수 있다.

React와 Spring boot이 어떤 식으로 연결되어 SPA가 구현되는지에 대한 기본 개념을 얻을 수 있습니다. 많고 다양한 기술들을 도입한다면 보다 고급진 기능들을 구현할 수는 있겠지만 그 만큼 진입 장벽이 높아집니다. 본 프로젝트에서는 최대한 진입 작업을 낮추어 초보자라면 2~3일 정도의 시간 투자 만으로 방명록과 그와 유사한 프로세스를 개발 할 수 있도록 제작하였습니다.

기본적인 Spring boot 프로세스를 이해하고 제작할 수 있다.

웹 프로그램의 대표적인 백엔드 프레임워크인 Spring boot가 사용자의 요청 처리를 어떤 식으로 받아서 실제로 요청 내용을 처리해 주는 서비스 프로그램에게 전달하고 서비스 프로그램에서 처리한 결과를 다시 사용자에게 되돌려 주는지에 대한 내용을 처리해 볼 수 있습니다.