LANGUAGE/JSP

MVC 패턴 #1

옐옐루 2022. 6. 16. 15:58

본격적으로 MVC 패턴을 활용하기에 앞서, 기본적인 개념을 익히고 기초적인 예제를 활용해 보는 것 



MVC 패턴에 앞서

MVC패턴은 무조건 Frontcontroller를 활용해야해 . DB를 가던 말던 상관없이 그걸 판단하는건 Frontcontroller 에서 함

이런 MVC 패턴을 활용할수밖에 만든게 스프링이고 이러한 스프링들을 활용해서 언어를 사용하게끔 만든 것이 장고 

MVC패턴을 활용한 전체적인 컴포넌트 설계

 

 

(1)    MVC Model, View, Controller를 뜻하는 용어로 개발 형태의 일종 입니다.

(2)    Model은 데이터베이스와의 관계를 담당합니다. 클라이언트의 요청에서 필요한 자료를 데이터베이스로부터 추출하거나, 수정하여 Controller로 전달 합니다.

(3)    View는 사용자한테 보여지는 UI 화면 입니다. 주로 .jsp파일로 작성 하며, Controller에서 어떤 View 컴폰넌트를 보여줄지 결정 합니다.

(4)    Controller는 클라이언트의 요청을 받고, 적절한 Model에 지시를 내리며, Model에서 전달된 데이터를 적절한  View에 전달 합니다.

 


 


기초예제

 

1단계 db, css, js 폴더 생성해놓고, style과 js 만들어 놓기  db도 생성해주기 

1)member.sql생성해주기 

생성한 테이블과 쿼리들

2단계 DTO 만들기

만들어준 테이블의 변수명과 동일한 dto 생성해주기

 

3단계 DAO 만들기

1) final 변수 만들어주고, 싱글톤 객체 만들어주고(싱글톤으로 굳이 안해줘도 됨), connection 풀 만들어주기

2) 회원가입, 회원리스트 뽑는 dao 함수 생성하기 

 

 

4단계 index.jsp 생성 후 .do 앵커 태그 생성해주기

.do의 형태로 생성해준 부분 누르면 넘어가게 됨

 

5단계 Service interface 생성해주기 

service 인터페이스 함수

void 의 형태로 execute 라는 이름을 가진 함수를 생성. 매개변수는 request와 response 

 

 

6단계부터는 서블릿 -> view단 ->서블릿 ->view단 왔다갔다 하면서 각각의 로직 하나하나 생성해줌 (이렇게 안해도 됨)

 

6단계 서블릿 생성해주기

1) actionDo 생성해주기

2) actionDo 안에 로직 넣어주기 - uri 와 conPath 작업 먼저 가지고 와주기 

uri 와 conPath 작업

3)viewPage와 Service 인터페이스 선언 해주기 ( sersvice는 나중에라도 인터페이스 만들어줘야함)

*Service 타입 : 모든 객체를 부품 갈아끼우듯 해주기 위해 interface로 감싼 service 라는 아이를 만들어 놓은것 

아래에서 쓸 애들이기 대문에 if문 들어가기 전에 진행

 

4) 서블릿에서 만들 로직을 실행할 class 만들어주러 가기 

  (1) MemberJoinservice(dao와 그 함수를 불러 오는 아이들)

  (2) view단에 뿌려야 하니 (memberList 형태로)setAtrribute 해주기 

  (3) view단에서 memberList 뽑아주면 됨 

 

 

5) command가 /memberList.do 일때, memberJoin_view.do 일때 memberJoin.do 일때 의 상황을 if,else 안에 넣어서 그 안에 각각의 로직을 넣어주기

6)  if 맨 끝단에다가 RequestDispatcher dispatcher 형성해서 forward 시켜주기 

 

7단계 view 단으로 넘어가서 출력해주기 

1) 테이블 안에 먼저 뿌려줄 title들 생성

2) <c:if>문을 활용하여 memberList 사이즈가 0이면 아무것도 뿌리지 않기

3) memberList 사이즈가 0이 아니면 for문 활용해서 뿌리기

4) 마지막에 view 단으로 넘어가는 회원가입 앵커태그 만들어주기 

8단계 memberJoin_view.do 서블릿에 내용 추가해주기 

얘는 form태그에 뿌리기만 하면 끝나기 때문에 request를 받는다거나, 로직을 수행하는 등의 과정이 필요가 없음 (데이터베이스 연동도 필요가 없음)

view단에 뿌릴 내용만 써주기

9단계 join.jsp 만든 뒤 <form>태그 생성하고 화면단에 뿌려주기 (뷰를 만들떈 js에 사용된 id나 class 명을 잘 확인하고 만들자)

* 자바스크립트 영역에 잘 들어맞게끔 유의해서 생성하기 

10단계 memberJoinService 처리 해주기 (class 생성하기)

1) join.jsp에 만들어 놓은 input name에 맞춰 getParameter 해오기 

2) getParameter할때 timestamp로 받아온 생년월일은 데이터베이스에서 not null 이 아니기 때문에 빈스트링이 넘어 올 수가 있음  따라서 빈스트링이 들어오지 않을경우(날짜가 정상적으로 넘어왔을 경우) birth 안에 timestamp의 형태를 valueof를 활용하여 만들어 주어야 한다

3) MemberDto 객체 생성해주기 

4) dao 받아 온 후 result 값에 joinMember 불러와주기 

5) 받아온 dao 속 dto 형태로 setAttribute 해주기 

 

 

11단계 memberJoin.do 처리 해주기 (서블릿 들어가서 로직 처리)

join 실행 후 list로 다시 돌아가기 

 

12단계 memberList.jsp로 돌아가서 맨 윗단에 회원가입 성공 유무에 대한 alert창 뿌리기 위한 작업 해주기

1) <c:set>을 활용하여 SUCCESS = 1, FAIL = 0 으로 세팅해주기

2) <c:if>문을 활용하여 조건써주고, alert ('회원가입 성공 유무 뿌려주기')

반응형