웹 계층 개발(회원)

홈 화면과 레이아웃

홈 화면은 회원 기능, 상품 기능, 주문 기능을 선택할 수 있게 해주는 곳이다.

 

• 홈 컨트롤러

@Controller
@Slf4j
public class HomeController {
    @RequestMapping("/")
    public String home(){
        log.info("home controller");
        return "home";
    }
}

홈 컨트롤러는 springBoot에서 늘 사용하던 컨트롤러이다. 제일 처음 home이기 때문에 RequestMapping이 /임을 알 수 있다. return은 home.html을 나타낸다. @Slf4j는 log를 사용할 수 있게 해준다.

 

강의에서 주는 html 파일을 templates 패키지에 추가하면 화면이 나온다.

 

예제에서는 뷰 템플릿을 최대한 간단하게 설명하려고, header , footer 같은 템플릿 파일을 반복해서 포함한다. 하지만 이 반복적인 부분을 제거하는 부분도 존재한다고 한다.

 

 

 

디자인을 추가하기 위해 부트스트랩을 사용하였다. 부트스트랩을 다운받아 static패키지에 모두 복사 붙여넣기 한뒤 강의에서 주는 jumbotron-narrow.css 파일을 추가해 주면 성공적으로 왼쪽의 화면이 나오게 된다.

 

 

 

 

 

 

 

 

 

회원 등록

• 회원 등록 폼 객체

@Getter @Setter
public class MemberForm {

    @NotEmpty(message = "회원 이름은 필수 입니다")
    private String name;

    private String city;
    private String street;
    private String zipcode;
}

@NotEmpty는 validation에 존재한다. NotEmpty를 쓸 때는 validation의 의존성을 추가해줘야 한다. 회원 등록 폼을 만든 이유는 회원 정보와 회원 등록할 때 필요한 정보가 다를 수 있기 때문이다. 

 

• 회원 등록 컨트롤러

@Controller
@RequiredArgsConstructor
public class MemberController {

    private final MemberService memberService;

    @GetMapping("/members/new")
    public String createForm(Model model){
        model.addAttribute("memberForm", new MemberForm());
        return "members/createMemberForm";
    }

    @PostMapping(value = "/members/new")  //오류가 담겨서 아래의 코드가 실행
    public String create(@Valid MemberForm form, BindingResult result){
        if(result.hasErrors()){
            return "members/createMemberForm";
        }
        Address address = new Address(form.getCity(), form.getStreet(), form.getZipcode());
        Member member = new Member();
        member.setName(form.getName());
        member.setAddress(address);

        memberService.join(member);
        return "redirect:/";
    }

}

GetMapping하는 부분은 get 메소드를 실행하는 곳으로 그냥 createMemberForm.html로 이동할려고 만들어 논 것이다.

PostMapping은 이제 입력을 하게되면 그것을 DB에 옮길려고 사용한 것이다.

@Valid는 아까 name에 NotEmpty 조건을 걸어놔서 해논 것이다. 스프링 부트는 BindingResult라는 것을 지원해준다. 이것은 만약 에러가 발생해도 아래의 코드를 멈추지 않고 실행하게 해주는 것이다. name을 입력하지 않고 회원 등록을 하면 에러가 발생하고 result.hasErrors가 에러를 잡아 아래있는 코드를 실행하게 해준다. createMemberForm에는 에러가 발생했을 때 띄어야하는 것이 저장 되어있다.

 

 

 

 

그 아래는 입력한 정보를 입력 받아 DB에 저장해주는 것이다.

return "redirect:/"는 다시 home화면으로 돌아가게 된다.

 

 

 

 

 

 

 

 

 

성공적으로 실행 된 모습이다.

 

 

 

회원 목록

@GetMapping("/members")
public String list(Model model){
    List<Member> members = memberService.findMembers();
    model.addAttribute("members",members);
    return "members/memberList";
}

폼 객체 vs 엔티티 직접 사용

이 예제 같이 요구사항이 단순한 경우는 폼 객체 없이 엔티티를 직접 등록과 수정에 사용해도 된다. 하지만 화면 요구사항이 복잡해지면 엔티티가 점점 커지고 화면에 종속적으로 변하게 된다. 이렇게 되면 엔티티의 유지보수가 힘들어진다.

그러므로 엔티티는 핵심 비즈니스 로직만 가지고 있고, 화면을 위한 로직은 존재하면 안된다. 화면이나 API에 맞는 폼 객체나 DTO를 사용해야 한다.  절대로 API가 엔티티를 반환하게 만들지 말자!!

 

강의 출저

https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81%EB%B6%80%ED%8A%B8-JPA-%ED%99%9C%EC%9A%A9-1

실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발 - 인프런 | 강의