이 글은 김영한 님의 Infrean 강의를 학습한 내용을 정리하여 작성합니다.
- 회원 웹 기능 - 홈 화면 추가
- 회원 웹 기능 - 등록
- 회원 웹 기능 - 조회
회원 웹 기능 - 홈 화면 추가
홈 컨트롤러 추가
회원 관리용 홈
실행 결과
참고: 컨트롤러가 정적 파일보다 우선순위가 높다.
현재 이전에 생성한 index.html 정적 파일을 이미 존재하는 상태다.
그럼에도 불구하고 방금 생성한 home.html 결과 페이지가 출력되었다.
이러한 이유는 간단하다.
우리가 입력한 url을 내장 톰켓 서버가 확인한다.
그러면 톰켓 서버는 우선 스프링 컨테이너 내에 해당 url과 관련된 컨트롤러를 탐색한다.
만약 관련 컨트롤러가 존재하지 않는다면 resources/static 폴더 아래에 정적 파일을 탐색해준다.
회원 웹 기능 - 등록
회원 등록 폼 개발
회원 등록 폼 컨트롤러
회원 등록 폼 HTML
<form> 태그의 action 속성은 폼 데이터(form data)를 서버로 보낼 때 해당 데이터가 도착할 URL을 명시한다.
실행 결과
회원 등록 컨트롤러
웹 등록 화면에서 데이터를 전달받을 폼 객체
회원 컨트롤러에서 회원을 실제 등록하는 기능
return "home" VS. "redirect:/"
return "home"을 하게 되면 resources/templates/home.html 파일이 랜더링되어 url은 "/members/new"이지만 home html 화면이 보인다.
return "redirect:/"를 수행하면 "/members/new" url에서 "/" url로 이동한다.
실행 결과
동작 방식
- 홈 화면에서 "회원 가입" anchor를 클릭하면 members/new로 이동하게 된다.(HTTP GET 방식)
- 톰켓 서버는 컨트롤러에서 members/new를 찾아 매핑한다.
- 회원 가입 폼에서 이름을 입력하고 등록하면 POST 방식으로 정보가 전달된다.
- @PostMapping이 가리키는 메소드가 호출된다.
input 입력창에 "spring"을 입력하고 등록 버튼을 클릭하면 create 메서드가 호출된다.
이때 create 메서드의 매개변수 form의 name으로 "spring"값이 들어온다.
이러한 동작이 가능한 이유는 다음과 같다.
input 요소의 name 특성의 값이 "name"을 보고 spring이 setName 메서드 호출을 통해 name에 해당 값을 대입해준다.
동일한 members/new 페이지인데도 불구하고 접속하는 방식(GET, POST)에 따라 어노테이션(@GetMapping, @PostMapping)을 달리하여 메서드가 동작한다.
회원 웹 기능 - 조회
회원 컨트롤러에서 조회 기능
회원 리스트 HTML
실행 결과
실행 결과를 확인해보면 tymeleaf 템플릿 엔진 기능을 살펴볼 수 있다.
model.addAttribute를 통해 List<Member>가 html의 ${members}값이 된다.
th:each는 tymeleaf 문법으로 루프를 돈다. (자바의 for each 문법과 비슷하다.)
문제점
현재 우리가 저장한 정보는 메모리에 존재하므로 서버를 종료하면 모든 정보가 지워진다.
그래서 우리는 이러한 정보들을 파일이나 데이터베이스에 저장을 해야 한다.
'스프링 > 스프링 입문' 카테고리의 다른 글
스프링 DB 접근 기술 #2 (0) | 2022.03.06 |
---|---|
스프링 DB 접근 기술 #1 (0) | 2022.03.02 |
스프링 빈과 의존관계 (0) | 2022.03.01 |
회원 관리 예제 - 백엔드 개발 (0) | 2022.02.28 |
스프링 웹 개발 기초 (0) | 2022.02.27 |