[섹션 5. 회원 관리 예제 - 웹 MVC 개발] 회원 웹 기능 - 홈 화면 추가 & 회원 웹 기능 - 등록 / 인프런 김영한 스프링 입문

이번 시간에는 회원 관리 예제를 웹 MVC로 개발을 했다~~

이전 시간에 의존관계를 설정했고, 멤버 컨트롤러를 통해서 회원을 등록하고 조회하는 로직을 만들 예정.

 

홈화면을 연결해주는 컨트롤러를 생성해준다.

GetMapping("/")을 하게 되면 localhost:8080으로 접속하면 보이는 첫 페이지를 매핑을 했으니

해당 메소드가 호출되면서 home.html을 리턴해준다.

 

서버를 실행하면 구현된 화면이 보인다.

 

 

 

 

- 스프링이 html 파일 실행할 때 우선순위

하지만 의문점이 드는게 이전에 static폴더에

아무것도 없을 때, 웰컴 페이지로 열리는 index.html 파일을 만들었는데 왜 실행이 안됐을까?

 

스프링이 html 파일을 열 때, 우선순위가 있다~~

웹 브라우저에서 요청이 오면 스프링이 스프링 컨테이너에 컨트롤러를 먼저 찾는다.

없으면, static 파일을 실행해서 웹 브라우저에 리턴한다.

 

그러니까 컨트롤러에 매핑된 페이지가 있기 때문에 index.html은 무시된다~~!

 

- 회원 등록 기능 구현

홈 화면을 추가하고 회원 가입 기능을 구현했다.

컨트롤러에서 Mapping을 구현해주었다.

이름을 입력하면 name이라는 key값과 입력한 "spring"이라는 value값이 서버로 전송된다~~

아직은 미구현 상태ㅋㅋㅋ

 

 

 

 

이렇게 controller 폴더에 클래스를 만들어주면 name 인스턴스와~~

회원생성 html에 있는 name이라는 name값이 매칭이 되면서 값이 들어온다.

그 다음에 컨트롤러로 넘어오게 된다.

반응형

동작 방식을 설명하자면,

회원 가입을 클릭하면

 

컨트롤러에서 get 방식을 통해서 URL의 /members/new 매핑을 받아와서

/members/createMemberForm을 리턴한다.

 

리턴하면 templates 폴더에서 찾고, 뷰 리졸버를 통해서 /members/createMemberForm.html 파일이 선택되고,

타임리프 템플릿 엔진이 이 파일을 렌더링해준다.

 

아래에 <form> 태그는 쉽게 설명하면, 값을 입력할수 있는 html 태그이다

그렇게 등록 버튼을 누르면 action URL(/members/new)으로 post 방식으로 넘어오게 된다.

 

컨트롤러에서 @PostMapping으로 어노테이션 된 메소드로 매핑이 된다.

 

Post방식은 회원 등록과 같이 데이터를 form에 넣어서 전달할 때 주로 쓰이고,

Get은 URL을 통해 데이터를 조회할 때 주로 쓰인다.

 

컨트롤러에서 다른 메소드도 매핑된 URL값이 같지만 Get 혹은 Post 방식에 따라서 다르게 매핑이 가능하다.

 

 

 

 

흐름을 이어 가면, 그렇게 PostMapping의 create 메소드가 호출되고 값이 들어오는데,

 

create 메소드의 파라미터인 MemberForm에서

name 인스턴스에 setName 메소드를 통해서 아까 html 페이지에서 입력한 "spring"이라는 값이 들어온다.

(name 인스턴스는 private이기 때문에 setter를 통해서 값을 넣어줌.)

그 다음에 getName으로 name값을 꺼내고 memberService의 join메소드를 호출해서 member 객체를 회원 가입~~

 

테스트를 위해 soutv만 치고 입력하면

위의 사진에 드래그한 30번째 줄 자동 입력!

그리고 member 객체에서 name을 받아올것이기 때문에 .getName까지 추가로 입력~~

콘솔에 입력한 name이 정상적으로 출력되는것을 확인할 수 있다!ㅋㅋㅋㅋ

 

그리고 이번 시간에 진행한 전체 컨트롤러 코드~~!