Presentation is loading. Please wait.

Presentation is loading. Please wait.

3 MVC모델을 이용한 웹 애플리케이션 작성.

Similar presentations


Presentation on theme: "3 MVC모델을 이용한 웹 애플리케이션 작성."— Presentation transcript:

1 3 MVC모델을 이용한 웹 애플리케이션 작성

2 학습 목표 내 용 MVC모델을 이용한 웹 애플리케이션 작성에 관한 간단한 튜토리얼 수행
간단한 웹 애플리케이션 작성을 통해 웹 애플리케이션의 전체 개발 과정 을 이해 MVC 개발 모델을 이해 내 용 웹 애플리케이션 개발 과정 화면 설계 애플리케이션 아키텍처 설계 개발 환경 및 배포 환경 구축 프로그램 개발 및 테스트 - 반복적인 개발과 테스트 기법

3 1. 웹 애플리케이션 개발 과정 (1) 1. 사용자 화면 설계 2. 애플리케이션 아키텍처 설계
브라우저 화면에 보여줄 내용 설계 가장 상위 수준에서의 설계 2. 애플리케이션 아키텍처 설계 모듈 구성 설계 모듈간의 인터페이스 설계 MVC 모델 적용

4 1. 웹 애플리케이션 개발 과정 (2) 3. 개발 환경 및 배포 환경 구축 4. 반복적인 개발 및 테스트 개발 환경 구축
반복적인 개발 – Unified Process 테스트 주도 개발 - TDD

5 2. 간단 MVC 튜토리얼 개요 웹 애플리케이션 이름 : BeerAdvisor 주요 서비스 내용
사용자의 취향(색깔 등)을 입력받아 적절한 맥주를 추천 각종 맥주에 대한 유용한 정보를 제공

6 3. 웹 애플리케이션 사용자 화면 설계 사용자 인터페이스 화면 설계
간단 실습을 위해 사용자 입력 화면 및 결과 출력 화면 2개만 지원

7 4. 웹 애플리케이션 아키텍처 설계 (1) 웹 애플리케이션 아키텍처 설계 프로그램 모듈 구성 및 모듈 간의 인터페이스 설계
MVC(Model-View-Control) 모델을 적용 BeerAdvisor 웹 애플리케이션 모듈 구성: Model 사용자 입력에 적절한 맥주 목록 생성 일반 자바 클래스로 구현 – BeerExpert 클래스 View 추천 맥주 목록을 출력하는 결과 화면을 생성 JSP로 구현 – result.jsp Control 사용자의 요청에 의해 실행, 요청 내용에 맞추어 모델에서 적절히 데이터 처리하도록 하며, 처리 결과를 뷰에 넘겨 요청 요건에 맞는 출력 화면을 생성하도록 함. Servlet으로 구현 – BeerSelect.java

8 4. 웹 애플리케이션 아키텍처 설계 (1) 웹 애플리케이션 아키텍처 설계 : MVC 모델 “스펙은 항상 변한다”
비즈니스 로직과 프리젠테이션 로직의 분리 “스펙은 항상 변한다”

9 4. 웹 애플리케이션 아키텍처 설계 (2) 웹 애플리케이션 실행 과정 HTML(정적 컨텐츠) 요청/응답 과정

10 4. 웹 애플리케이션 아키텍처 설계 (3) 웹 애플리케이션 실행 과정 서블릿(동적 컨텐츠) 요청/응답 과정

11 5. 개발 환경 구성 개발 디렉토리 구성 사용하는 웹 컨테이너에 맞게 개발 디렉토리를 구성

12 6. 배포 환경 구성 웹 컨테이너의 배포 디렉토리 구성

13 7. 개발 & 테스트 (1) 웹 애플리케이션 개발 및 테스트 수행 단계
사용자가 제일 먼저 볼 HTML 폼을 생성하여 테스트한다 컨트롤러 서블릿 버전 1을 만든다. 버전 1에서는 HTML 폼이 서블릿을 호출할 때 넘겨준 파라미터 값을 출력하도록 작성하여 테스트한다. BeerExpert 모델 클래스를 위한 테스트 클래스를 만들고 테스트한다(실제 모델 클 래스는 복잡한 처리과정이 요구됨으로 간단한 테스트 클래스로 대신한다) 서블릿 버전 2를 만든다. 버전 2에서는 BeerExpert 모델에게 맥주에 대한 조언을 구하는 기능을 추가하고 테스트한다. 뷰 jsp를 만들고 서블릿 버전 3을 만든다. 버전 3에서는 뷰 JSP로 요청을 전달하는 기능을 추가한다. 이 작업이 완료되면 전체 애플리케이션을 테스트한다.

14 7. 개발 & 테스트 (2) 첫 화면 HTML 페이지 코드 작성 사용자 입력 화면으로 정적 웹페이지로 작성
파일명: form.html

15 7. 개발 & 테스트 (3) 첫 화면 HTML 페이지 코드 배포 및 테스트
$(TOMCAT_HOME)/webapps/Beer-v1/WEB-INF/ 에 복사 톰캣 실행 & 페이지 테스트 URL:

16 7. 개발 & 테스트 (4) 서블릿 버전 1 작성 : BeerSelect.java
HTML 폼에서 넘겨준 파라미터 값을 출력하여 테스트

17 7. 개발 & 테스트 (5) 서블릿 버전 1 작성 : BeerSelect.java 주요 클래스 APIs

18 7. 개발 & 테스트 (6) 서블릿 버전 1 배포 (1) 배포 서술자 파일(DD: Deployment Descriptor) 수정 : web.xml

19 7. 개발 & 테스트 (7) [ 참고 ] URL의 서블릿 클래스 파일로의 맵핑 (1)

20 7. 개발 & 테스트 (8) [ 참고 ] URL의 서블릿 클래스 파일로의 맵핑 (2)

21 7. 개발 & 테스트 (9) [ 참고 ] URL의 서블릿 클래스 파일로의 맵핑 (3)

22 7. 개발 & 테스트 (10) [ 참고 ] URL의 서블릿 클래스 파일로의 맵핑 (4)

23 7. 개발 & 테스트 (11) 서블릿 버전 1 배포 (2) 서블릿 클래스 컴파일 및 복사

24 7. 개발 & 테스트 (12) 서블릿 버전 1 테스트

25 7. 개발 & 테스트 (13) 모델 클래스 작성 & 컴파일 일반 자바 클래스로 구현 : BeerExpert 클래스
모델 클래스는 서블릿에 호출된다는 것을 알 필요가 없다

26 7. 개발 & 테스트 (14) 서블릿 버전 2 작성 (1) 모델 클래스 BeerExport를 사용하도록 수정
모델 클래스의 인스턴스를 생성하고 메소드를 호출

27 7. 개발 & 테스트 (15) 서블릿 버전 2 작성 (2)

28 7. 개발 & 테스트 (16) 서블릿 버전 2 컴파일, 배포, 테스트

29 7. 개발 & 테스트 (17) 뷰 JSP 작성 (1) 출력 화면을 동적으로 생성 파일명: result.jsp

30 7. 개발 & 테스트 (18) 뷰 JSP 작성 (2)

31 7. 개발 & 테스트 (19) 뷰 JSP 배포

32 7. 개발 & 테스트 (20) 서블릿 버전 3 작성 (1) 동적 출력 화면 생성을 위해 뷰 JSP로 요청을 전달(forwarding)

33 7. 개발 & 테스트 (21) 서블릿 버전 3 작성 (2)

34 7. 개발 & 테스트 (22) 서블릿 버전 3 작성 (3)

35 7. 개발 & 테스트 (23) 서블릿 버전 3 컴파일, 배포, 테스트


Download ppt "3 MVC모델을 이용한 웹 애플리케이션 작성."

Similar presentations


Ads by Google