테스터도 알아야 할 웹 개발(테스트 교육 3장 1절 부분발췌)

테스트 엔지니어 교육- 테스트 기본교육

- 테스트

학습목표

3장 과정 목표

- 테스터는 개발 아키텍처, 기술을 이해하여 개발팀과 쉽게 의사소통할 수 있다

- 애자일이 생긴 배경과 지향하는 바를 이해하고 스크럼 팀이 어떤 식으로 일하

는지 이해할 수 있다

- 사례 등을 통해서 애자일 스크럼 팀내에서 테스트 역할자로 일 할 수 있다

- 빈발결함, 개발표준 사례 등을 통해 품질 관점에서 개발팀을 리딩할 수 있다

- 사용자 스토리를 대상으로 테스트 설계(케이스 작성)를 할 수 있다

테스트

1. 테스터도 알아야 할 웹 개발 기본

ContentsContentsContentsContents

※ 빌드 실습 - 스프링 프레임워크 어플리케이션

2. 애자일과 애자일 테스트

3. 사용자 스토리 기반의 테스트 설계 가이드

4. 개발 표준의 필요성 및 빈발결함

5. 테스트 자동화 환경(Jenkins) 구축 실습

(별도) 엑셀 검사시트 사용법

테스트 교육

1. 테스터도 알아야 할 웹 개발

� 웹 어플리케이션의 구조, 동작원리(물리적)

- Web Servers

- Web Application Server

- Database Servers

- DB

1.1 웹 어플리케이션 구조

� 웹 서버란

- 주 기능은 웹 페이지를 클라이언트로 전달

- 공통 기능

1. HTTP

2. 통신 기록

- 실제로 수많은 웹 서버는 다음의 기능 또한 제공한다.

1.인증

2.정적 콘텐츠 관리

3.HTTPS 지원

4.콘텐츠 압축

5.가상 호스팅

6.대용량 파일 지원

7.대역폭 스로틀링

- 종류

Apache, IIS(Internet Information Server), webtob 등


� 웹 어플리케이션 서버란

- 웹 애플리케이션 서버(Web Application Server, 약자 WAS)

- 인터넷 상에서 HTTP를 통해 사용자 컴퓨터나 장치에 애플리케이션을 수행해 주는

미들웨어(소프트웨어 엔진)

- 동적 서버 콘텐츠를 수행하는 것으로 일반적인 웹 서버와 구별이 되며, 주로 데이터베이스 서버와 같

이 수행이 된다.

- 동적인 처리를 담당, 동적 페이지(JSP, ASP)

- 기본 기능은 3가지이다.

1) 프로그램 실행 환경과 데이터베이스 접속 기능을 제공한다.

2) 여러 개의 트랜잭션을 관리한다.

3) 업무를 처리하는 비즈니스 로직을 수행한다

- 종류

WEBLogic(BEA), WebSphere(IBM), JEUS(TMAX), Tomcat, Jboss(Redhat)


� 웹 어플리케이션의 구조, 동작원리(논리적)

- Presentation Layer

어플리케이션 중에서 화면을 담당하는 부분.

보통 GUI (Graphic User Interface) 라 칭합니다.

- Business Layer

사용자로부터의 입력을 기준으로 주어진 로직에 따라

각종 일 처리를 담당하는 부분

- Data Access Layer (Persistence Layer)

데이터를 영구적으로 저장하거나, 저장된 장소에서

데이터를 가져오는 역할을 담당하는 부분


� 웹 어플리케이션 구조 상에서 테스터가 알아야 할 내용


JSP

자바 스크립트

Ajax

태그 라이브러리

MVC 모델

소프트웨어 프레임워크Spring, Anyframe

소프트웨어 형상관리

빌드 프로세스

RIA

DA

공통

� MVC 모델의 이해

- 모델/ 뷰/ 컨트롤러(Model–View–Controller, MVC)

- 사용자 인터페이스로부터 비즈니스 로직을 분리하여 애플리케이션의 시각적 요소나 그

이면에서 실행되는 비즈니스 로직을 서로 영향 없이 쉽게 고칠 수 있는 애플리케이션을

만들 수 있다

- 모델은 애플리케이션의 정보(데이터)를 나타내며, 뷰는 텍스트, 체크박스 항목 등과 같

은 사용자 인터페이스 요소를 나타내고, 컨트롤러는 데이터와 비즈니스 로직 사이의 상

호동작을 관리


� Web Application Framework

- 동적인 웹 페이지나, 웹 애플리케이션, 웹 서비스 개발 보조용으로 만들어지는

애플리케이션 프레임워크의 일종

- 웹 페이지를 개발하는 과정에서 겪는 어려움을 줄이는 것이 주 목적

- 통상 데이터베이스 연동, 템플릿 형태의 표준, 세션 관리, 코드 재사용 등 포함

- Struts, Spring MVC 등

1.2 웹 어플리케이션 프레임워크

� Spring MVC

- Spring에서 제공하는 웹 프레임워크

- MVC(Model, View, Controller) 패턴 기반의 Model2 아키텍처

- 구성요소 : Controller, Handler mappings, ModelAndView, view resolver, view 등

- Front Controller : DispatchServlet을 사용(기본 핸들러는 Controller Interface)

- Struts에서는 ActionForm과 같은 클래스를 이용해

입력 폼 데이터를 전달 하지만 Spring MVC는

이러한 입력 폼 데이터를 transfer object로 바로 바인딩

- Spring MVC는 Spirng 프레임워크의 한 모듈로써

Spring IoC 컨테이너와 완벽하게 통합이 되어

Spring의 또 다른 기능과의 연계가 용이


� Spring MVC의 특징

- 역할 분리가 명확하다

controller, validator, command 객체, 폼 객체, model 객체, DispatcherServlet, handler mapping, view

resolver 등 특화된 객체에 의해 역할을 수행할 수 있다

- 다양한 컨트롤러 인터페이스를 제공하기 때문에 시나리오에 맞는 컨트롤러를 선택하여 사용할 수 있

다

- business 객체를 command 또는 폼 객체로 재사용할 수 있다

- application 레벨에서 데이터를 바인딩 하고 validation 에러를 체크할 수 있다

- 간단한 URL 기반 설정으로 다양한 handler mapping과 view resolution이 가능하다

- 모델이 맵으로 구성되기 때문에 여러 view 기술과의 연계가 쉽다

- 데이터 바인딩이나 테마 사용을 위한 spring 태그를 제공한다

- JSP의 입력 폼을 보다 쉽게 만들 수 있는 form 태그를 제공한다


� iBatis

- 더 빠른 JDBC 코딩을 위한 일반화된 프레임워크

- SQL 매퍼 + DAO 프레임워크

- 간결함과 쉬운 접근성

- 생산성의 향상

- 성능

- SQL 문장과 프로그래밍 코드의 분리

- 이식성

- 데이터베이스 접근 클래스와 비즈니스 로직을 담은 클래스의 분리

http://blog.naver.com/poloecko?Redirect=Log&logNo=70094791801

1.3 Data Access Framework

� QueryService

- 애니프레임 자체 DataAccess Framework

- 쿼리문이나 객체의 입력만으로 데이터베이스 내에 저장된 데이터 조작을 가능하게 하

는 서비스

- Query 서비스는 JDBC(Java Database Connectivity)를 이용한 데이터 액세스 수행 부분

을 추상화함으로써 간편한 데이터 액세스 방법을 제공하고, JDBC 사용시 발생할 수 있

는 공통 에러를 줄여준다.

- iBatis와 유사


� Hibernate

- 객체를 RDB에 매핑해서 저장하는 ORM(Object-Relational Mapping) 툴

- 임의의 객체 검색을 위해서는 SQL과 유사한 Hibernate Query Language(HQL)을 사용

※ ORM (Object Relational Mapping) 이란?

- 데이터 베이스를 객체 지향 프로그래밍 개념과 연결 시켜주는 프로그래밍 테크닉

- 장점

1) 생산성이 향상,

2) 유지보수 용이,

3) 특정 DBMS에 종속적이지 않다.

4) POJO 사용가능, Set, Map, List 등

자바 컬렉션 API를 지원


- 단점1) DAO 패턴에 익숙한 개발자에게는 초반접근이 어렵다

2) 잘못 사용할 경우 성능을저하시킬 수 있다

3) 객체 지향적 프로그래밍이 아니라면별다른 효과를 볼 수 없다

� Spring 프레임워크란

- 오픈소스 자바 어플리케이션 프레임워크

- 엔터프라이즈 어플리케이션에서 필요로 하는 기능을 제공

※ 주요기능

- 경량 컨테이너

- DI (Dependency Injection) 패턴을 지원

- AOP (Aspect Oriented Programming) 를 지원

- POJO (Plain Old Java Object)를 지원

- 트랜잭션 처리를 위한 일관된 방법을 제공

- 영속성과 관련된 다양한 API를 지원

- 다양한 API에 대한 연동을 지원

http://blog.naver.com/chocolleto?Redirect=Log&logNo=30085630030

written by Rod Johnson, in October 2002

1.4 Spring 프레임워크

� Spring 프레임워크의 특성

1) AOP (기능별 모듈화, 진정한 OOP 제공)

컨테이너는 일관성을 유지시켜 주고 투명한 환경 내에서 느슨한 컴포넌트(POJO)의 집합에서 복잡

한 시스템을 조립할 수 있는 능력을 제공하며 조직을 해치지 않음

2) IOC (제어 역행)

애플리케이션 객체를 연결해 주고 자동화된 설정 및 집중화된 설정을 제공하는 가장 완전한 경량

컨테이너

3) Test Unit (편리한 테스트) 제공

컨테이너는 민첩함을 제공하고 지렛대 역할을 하며 소프트웨어 컴포넌트를 먼저 개발하고 고립시

켜 테스트할 수 있게 함으로써 테스트와 확장성을 향상시킨다

4) 트랜잭션

트랜잭션 관리를 위한 공통의 추상화된 레이어, 트랜잭션 관리자를 플러그인할 수 있어서 저 수준

트랜잭션을 문제없이 처리한다


5) JDBC 추상화 레이어

중요한 예외 계층을 제공하며 예외처리를 단순화시켜 코드의 양을 덜어준다.

6) ORM 프레임워크 연동 제공

Hibernate, iBatis, JDO 등과 같은 ORM 프레임워크와 통합되어 있다.

7) 좀더 쉬운 J2EE 개발 지향(저비용 유연한 코드 유지)

8) 다양한 프리젠테이션 계층 제공(jsp, velocity, excel, pdf ...)

9) 좋은 설계(아키텍처) 제공

10) 분산(원격) 서비스

11) 보안


� Spring 프레임워크의 구조 (2pages)

1) 코어 컨테이너(core container)

- Spring 프레임워크의 핵심 기능 제공

2) Spring 컨텍스트(Spring context)

- 국제화된 메시지, 애플리케이션 생명주기 이벤트, 유효성 검증 등을 지원

- 이메일, JNDI 접근, EJB 연계, 리모팅, 스케쥴링 등과 같은 엔터프라이즈 서비스 제공


3) Spring AOP 모듈(Spring AOP)

- aspect 지향 프로그래밍 기능을 Spring 프레임워크와 직접 통합

4) Spring DAO

- Spring JDBC DAO 추상 레이어는 다른 데이터베이스 벤더들의 예외 핸들링과

오류 메시지를 관리하는 중요한 예외 계층을 제공

5) Spring ORM

- 여러 ORM 프레임워크에 플러그인 되어, Object Relational 툴을 제공

6) Spring Web module

- 웹 컨텍스트 모듈은 애플리케이션 컨텍스트 모듈의 상단에 구현되어,

웹 기반 애플리케이션에 컨텍스트를 제공

7) Spring MVC framework

- MVC 프레임워크는 완전한 기능을 갖춘 MVC 구현이다


� JSP (JavaServer Pages)

- html과 달리 동적인 웹 컨텐츠를 생성하는 자바 플랫폼 기술

- HTML내에 자바 코드를 삽입하여 웹 서버에서 동적으로 웹 페이지를 생성

- 실행 시에는 자바 서블릿으로 변환된 후 실행

- 비슷한 구조인 것 PHP, ASP, ASP.NET 등

- 아파치 스트럿츠나 자카르타 프로젝트의 JSTL 등의 JSP 태그 라이브러리를 사용하는 경

우에는 자바 코딩없이 태그만으로 간략히 기술이 가능하므로 생산성을 높일 수 있다

1.6 JSP, 자바 스크립트, 태그 라이브러리

� 자바 스크립트

- JavaScript는 HTML 문서에 상호작용(Interactive)하는 요소와 동적(Dynamic) 요소를 추

가하기 위해 만드는 언어

- 컴파일을 하지 않아도 실행이 가능한 Interpret 언어

(사람이 해독할 수 있는 script를 직접 해석해서 실행 언어로 JavaScript 해석기

(Interpreter)는 주요 브라우저에 내장되어 있음)

- 오픈소스(무료)


� 자바 스크립트 예

- 프로젝트에서 사용할 때는 공통 자바스크립트 함수를 별도의 xxx.js파일로 저장하고 필요

한 jsp에서 호출해서 사용


( main.html )

<html><head>

<title> </title>

<script language='JavaScript' src='./common.js'></script><script>function check(form){

if(isNull(form.name, '입력하세요')){

return false;}return true;

}</script>

</head><body>

<form method='post' action='' onSubmit='return check(this);'><input type='text' name='name'><input type='submit' value='전송'>

</form></body>

</html>

( common.js )

function isNull(obj, msg){

if(obj.value==''){

alert(msg);obj.focus();return true;

}return false;

}

� 자바 스크립트 예


� 사용자 정의 태그라이브러리 (Custom Tag Library)

- JSP 페이지에서 프로그램 로직을 분리하기 위해 고안된 사용자 정의 태그 집합

� JSP Standard Tag Library (JSTL)

- 자주 쓰이는 커스텀태그들을 표준으로 정해서 모아놓은 것

- 스크립틀릿, 표현식을 사용하는 것보다 훨씬 간결한 문법 구조를 지원

- JSTL은 5가지의 태그를 지원


라이브러리라이브러리라이브러리라이브러리 기능기능기능기능 접두어접두어접두어접두어 관련관련관련관련 URLURLURLURL

Core 변수지원, 흐름 제어, URL 처리 cccc http://java.sun.com/jsp/jstl/core

XML XML 코어, 흐름 제어, XML 변환 x http://java.sun.com/jsp/jstl/xml

국제화 지역, 메시지 형식, 숫자 및 날짜 형식 fmt http://java.sun.com/jsp/jstl/fmt

데이터베이스 SQL sql http://java.sun.com/jsp/jstl/sql

함수 콜렉션 처리, String 처리 fn http://java.sun.com/jsp/jstl/functions

� JSTL 사용 예

- ArrayList 컬렉션 객체 배열을 JSTL을 사용하여 표현하기


※ CSS (Cascading Style Sheets) – 디자인

웹 문서의 전반적인 스타일을 미리 저장해 둔 스타일시트이다. 문서 전체의 일관성을 유지할 수 있고,

세세한 스타일 지정의 필요를 줄여 준다


� X-Internet

- executable & extended Internet을 줄인 표현

- XML을 기반으로 Web 아키텍처와 Client/Server 아키텍처의 한계성을 극복하고 장점만을 수용하기

위한 새로운 인터넷 아키텍처를 의미

- 2000년 10월에 포레스터 리서치의 CEO인 George F. Colony가 자사의 웹 페이지에 기고한 "MY

VIEW: X INTERNET"이라는 글이 그 기원

- X-인터넷이 인터넷 어플리케이션을 다루는

소프트웨어 패러다임이라고 할 수 있다면,

RIA는 매크로미디어(현재의 어도비)의 플래시(Flash)

기술에서 유래된 용어로 특정 벤더에 의해 만들어진 개념

태생적 관점에서 볼때 RIA 보다는 X-인터넷이 보다 크고

포괄적인 개념이라고 생각되지만 최근에는 RIA로 통일되는 경향

1.7 RIA, X-Internet, Ajax

Web 2.0

RIA, Ajax X-Internet

RIA

� RIA

- Rich Internet Application의 약자

- 웹 2.0이 대두되면서 등장

- 보다 역동적인 인터페이스를 통해 보다 저렴한 비용으로 "하나의 인터페이스 안에서 모

든 프로세스를 처리할 수 있는" 해결책으로 등장한 기술

- 미국 어도비 의 에어, MS의 실버라이트, Sun의 JavaFX 등이 있다


� MiPlatform, X-Platform

- 국내 Tobesoft사에서 만든 X-Internet 솔루션

- 별도 엔진 위에서 구동

- write once, use anywhere 를 목표로 한번 개발한 어플리케이션은 웹, C/S, 모바일 환경 및 다양한

OS에 동시 서비스 가능

- 브라우저 아닌 곳에서도 실행 가능

- 다양한 출력 포맷 및 미려한 리포트 디자인을 지원하는 리포팅 툴을 기본 내장

- UI 개발을 지원해 주는 디자인 툴 지원


� 플렉스(Flex)

- RIA 개념을 구현한 오픈 소스 프레임워크

- flash 기반의 컴포넌트 프로그래밍 (Adobe 사)

- 모든 주요 브라우저, 데스크탑 및 운영 체제에 일관되게 배포 가능

- 개발 툴 : Adobe Flex Builder

- 소스파일은 mxml로 되어 있으며 이를 컴파일 하면 swf 파일이 생성된다

- AS(ActionScript) 프로그램이 Flash 런타입에서 실행되기 전에, AS3.0코드는 플래시 런타임이 이해할

수 있는 액션스크립트바이트 코드로 변환된다. 하지만 바이트 코드는 플래시 런타임에서 혼자 실행

할 수 없고, 그것은 반드시 swf 파일로 감싸져야 한다.


� Ajax (에이잭스)

- 비동기 자바스크립트와 XML (Asynchronous Javascript and XML) 를 의미

- 기술이라기 보다 좀더 쉽게 접근할 수 있도록 인터페이스를 만든 방법론

- 가장 큰 사용 이유는 액티브X, 플래시 또는 자바 애플릿 등에 의존했던 사용성, 접근성, 응답성의 향

상. 새로운 컨텐츠를 보여주기 위해서 웹 페이지 전체가 매번 리로딩되는 것은 사용성, 응답성의 한

계로 이어질 수밖에는 없다

- 액티브X, 자바 애플릿, 플래시 등의 기술들 대신에 AJAX가 가질 수 있는 경쟁력은 플러그인을 사용하

지 않고 브라우저만으로 바로 이용할 수 있다는 것과 새로운 것을 배우지 않고 DHTML, 자바스크립

트, CSS등의 기존 웹 기술들을 그대로 이용할 수 있다는 것이다


� Front-end 단의 뜨거운 트랜드

(1) Single-Page-Application (SPA)

&

(2) 웹앱 어플리케이션


https://msdn.microsoft.com/en-us/magazine/cc507641.aspx

1) 기존방식 : 페이지 단위 인터랙션

2) Ajax : 페이지 조각 단위 인터랙션

3) SPA : 한 페이지에서 모든 인터랙션을 처리

� Jquery

- 브라우저 호환성이 있는 HTML 내부 자바스크립트 라이브러리이며 클라이언트 사이드 스크립트 언

어를 단순화 할 수 있도록 설계되었다

- 가장 인기있는 자바스크립트 라이브러리

- DOM 형식의 JavaScript 코드는 복잡하고 긴 편인데 반해 JQuery는 좀더 직관적으로 보이게 하도록

짧고 단순하게 구성

- 크로스 브라우징을 지원


[ 사용자가 Input Box에 글을 입력하면 동적으로 하단에 입력한 값이 출력되는 간단한 예제 ]

� AngularJS

- 자바스크립트로 만든 client 측 MVC/MVVM 프레임워크

- 오픈소스, 구글 스폰서

- Single-Page-Application을 지원하며,

웹앱 (한번 UI를 구성하면 웹과 모바일 앱에서도 공통으로 사용) 지원


http://soomong.net/blog/2014/01/20/translation-ultimate-guide-to-learning-angularjs-in-one-day/


[ 비교 : Jquery ] [ AngularJS ]

input box에 값을 넣으면 바로 페이지에 문자를 표시하는 간단한 샘플

� Node.JS? (조대협의 블로그 : http://bcho.tistory.com/881)

- node.js는 single thread 기반으로 동작하는 고성능의 비동기 IO (Async / Non-blocking IO)를 지원

하는 네트워크 서버이다

- 2009년 Ryan Dahl에 의해서 개발이 시작되어 있으며, 현재 수많은 지원 모듈과, 레퍼런스, 에코 시스

템을 가지고 있는 오픈 소스 프로젝트 중에 하나이다

- Google Chrome V8 엔진으로 개발되어 있고, 프로그래밍 언어로는 Java script를 사용하며, Event 기

반의 프로그래밍 모델을 사용한다

- 근래에 들어서 많은 인터넷 기업들이 node.js를 도입하고 있다. Linked in이나 Paypal 그리고 얼마전

에는 그루폰까지 상당 부분의 내부 시스템을 node.js로 전환하였다

- Javascript 기반이고, 개발 구조가 매우 단순화 되어 있어서 빠르게 개발이 가능하다.

- CPU 작업이 많은 애플리케이션에는 적당하지 않다. Node.js는 single thread 구조여서 하나의

request를 처리할 때 CPU를 많이 사용하면 다른 요청 처리가 지연되게 되고, 전체적인 응답시간 저

하로 연결된다

1.8 NodeJS

� 형상관리

- 소프트웨어의 개발 및 유지보수 과정에서 발생하는 각종 결과물(문서, 프로그램, 하드

웨어)들에 대한 계획, 개발, 운용 등을 종합하여 시스템의 형상(모습)을 만들고, 이에 대

한 변경을 체계적으로 관리, 제어하기 위한 활동

� 목적

- 문서와 프로그램에 대한 변경을 통제하는 절차가 체계적으로 이루어지지 않는 경우,

예상치 않은 위험이 발생할 수 있음

1.A 형상관리 및 소스 빌드

� 형상관리 툴의 종류- Subversion

오픈소스 툴, 속도 및 이클립스 플러그인 제공으로 자바 소스코드의 형상관리에 많이 활용됨

- git

- Dimension

상용 툴, Subversion이 문서의 형상관리에 취약한 부분이 있어서 SDS프로젝트에 많이 사용됨. 속도나 복잡한 메뉴 구조 등의 문제점이 있음

- CVS

Subversion이전에 소스코드 형상관리에 많이 사용된 오픈소스 툴

- IBM ClearCase

상용 툴, 삼성전자 쪽에서 사용되는 소스코드 형상관리 툴

- 그 외 SourceSafe, Perforce 등


테스트 교육

1.A 형상관리와 빌드

� 빌드 프로세스의 이해


개발 프로세스

*CTIP

?

개발자 PC개발자 PC

빌드 서버빌드 서버

개발서버개발서버

형상관리형상관리 빌드 관리

테스트 코드 생성/ 테스트

테스트 성공시소스 배포

패키징

배포

테스트

컴파일

개발자WAS

Eclipse테스트 성공시

소스 + 테스트 코드 형상 관리

•CTIP: 빌드/테스트 자동화 툴(Continuous Test and Integration Platform)

WAS

테스트 결과리포트 제공

샘플파일

� 빌드 프로세스의 이해

- 프로젝트 빌드파일 샘플을 통한 이해


Clean

Compile

Packaging

( Tar압축 )

Deploy

WAS재기동

build-dist.xml

소스 최신화

형상서버 빌드서버

개발서버 테스트, 운영서버

deploydeploy

� 빌드 스크립트- Apache Ant

Java기반의 자동화 빌드 툴, make같은 것 과 비슷하지만, 자바 기반으로 쓰여졌고, make는 내부적으로 shell기반 명령어

를 쓰는 반면 ant는 xml 파일로 빌드 스크립트를 작성했다

- Apache Maven

Project Object Model(pom.xml)을 기반으로 하여 프로젝트의 빌드, 리포팅, 도큐멘테이션 등 프로젝트의 라이프 사이클

전체를 관리할 수 있는 프로젝트 관리툴

기존의 Ant가 빌드와 관련된 툴이었다면, Maven은 POM에 프로젝트에 관련된 여러가지 정보를

집약하여 그 정보를 기초로 프로젝트 전체를 관리, Ant 대비 자율성이 떨어진다는 의견도 있다

- Gradle

Maven, ant의 장점을 결합한 빌드도구로 소프트웨어를 제품 관점에서 컴파일, 테스트, 배포, 문서화 등의 절차를 지원 함

Xml 대신 groovy 언어로 작성된 DSL을 통해 프로젝트 정의


� 샘플 어플리케이션을 통한 실습

- 샘플 웹 어플리케이션

- 관리자 포털로 다음의 공통 기능을 제공

(사용자 관리, 메뉴 관리, 역할 관리, 업무 그룹 관리, 공통코드 관리,접속(로그인) 이력 관리)

- 아키텍처(프레임워크) : MyBatis + SpringMVC Framework + JQWidget

- 예제 DB로 H2(메모리 DB)가 연동되며, Oracle, MySQL 등 다양한 DB 지원

- 개발 소스는 Maven의 프로젝트 구조를 따르며 pom.xml로 프로젝트 관리

1.B 실습

� 아키텍처

- Spring Framework 기반의 관리자 포털 어플리케이션

- 서버단의 기능을 RESTful OpenAPI로 제공

1.B 실습

RDMBS

DAO implementations

DAO interfaces

Service implementations

Service interfaces

Other remote interfaces

Data AccessLayer

ServiceLayer

PresentationLayer

개별 화면에 대한 매뉴얼 / 자동화 테스트

Controller에 대한 테스트

Service에 대한 테스트

DAO 에 대한 테스트

Controller

REST API

RESTful API 테스트UI

√

11

22

33

44

55 √

� Maven 기반 프로젝트 폴더 구조

- Maven은 정형화된 프로젝트 구조(폴더)를 통해 별도의 복잡한 설정없이 일반적인 빌드 프로세스를

적용할 수 있다

1.B 실습

src/main/java 개발 소스(java파일)가 위치한다

src/main/resources 개발관련 리소스(일반 파일)이 위치한다

src/main/filters Resource filter files

src/main/assembly Assembly descriptors

src/main/config Configuration files

src/main/scripts Application/Library scripts(자바스크립트 파일)

src/main/webapp웹 어플리케이션의 소스(js p 파일 같은)Web application sources

src/test/java 테스트 코드(junit)가 위치한다

src/test/resources테스트 수행시 참조되는 리소스(일반파일)이위치한다

src/test/filters Test resource filter files

src/site Site

LICENSE.txt Project's license

NOTICE.txtNotices and attributions required by libraries that the project depends on

README.txt Project's readme

1. Maven 프로젝트 구조(폴더) 설명 - 개발환경

WEB-INF/web.xml

WEB-INF/index.xxx

WEB-INF/lib

WEB-INF/classes

J S P 파일 폴더별 구성

웹 어플리케이션 폴더 구조

1.B 실습

2. Maven에 정의되어 있는 빌드 라이프 싸이클 3. 참조 라이브러리 관리

� 이클립스 Maven 플러그인을 이용한 로컬 빌드 수행

1.B 실습

1) Maven 기반 프로젝트를

처음 받으면 프로젝트 선택 후 Maven 메뉴의

Update Project로 Maven 개발 환경을

활성화 시킬 수 있다

※ 참조 라이브러리(Dependency) 관리 등의

기능이 제공된다

2) 프로젝트 하위의 pom.xml 을 선택하고

Run As > Maven install 을 실행한다

실행하면

a) pom.xml의 레파지토리 URL로부터 로컬 라이브러리

저장소(사용자계정폴더>.m2 폴더 하위)로

관련 라이브러리(Dependency)를 내려받아 참조시킨다

b) 개발 소스를 컴파일한다

c) 테스트 코드를 컴파일한다

d) 테스트를 수행한다

e) 배포를 위해 패키징을 한다

…

테스트 교육

5. 테스트 자동화 환경(Jenkins) 구축

� CI와 자동화된 테스트

- 지속적인 통합 (CI : Continuous Integration )

- 정기적으로(매일) 형상 서버로부터 최신 소스를 내려 받아 빌드하고 테스트하는 작업을

지속적으로 수행하는 프랙티스

5.1 지속적인 통합이란

Development Team

Result Notification CI Server

Source Repository

1. Compile/Build Product

5. Report Results

4. Run Automated Test

3. Run Code Analysis

2. Build Install/Deploy소스 코드 체크인

소스 코드 내려 받기

� CI의 필요성

- 기계적이고 반복적으로 수행되는 빌드에 대한 자동화 요구

- S/W 품질 보장을 위하여 정기적인 자동 테스트 수행

- 통합테스트를 위한 테스트 베드에 대한 준비

� CI의 기대효과

- 통합의 위험 감소효과

- 수동으로 수행해야 하는 반복 작업 감소

- 언제, 어느 장소에서도 배포 가능한 소프트웨어 생성 가능

- 프로젝트에 대한 더 나은 가시성을 제공

- 개발팀에게 소프트웨어 제품에 대한 자신감 고취


� CI 지원 툴

(오픈소스)

- Jenkins(기존 Hudson)

. 자동배포 웹 어플리케이션

. 클릭 만으로 빌드, 배포가 가능하다

. 빌드 예약을 통해 밤사이 자동 빌드를 하고 다음 날 아침 결과를 확인할 수 있다

- Go.CD (Continuos Development)

. Thoughtworks사에서 만든 CI툴로 현재는 무료로 오픈

. 여러 제품 빌드를 파이프라인 형태로 관리하는 강점을 가짐

(상용)

- Atlassian Bamboo

. 여러 Atlassian 제품과의 연동에 강점을 가진 CI 툴 (로 보임)


� Jenkins item(빌드 잡) 생성,수정 (1/6)

- 신규 빌드 잡(item) 생성


Job 선택 후구성 클릭

Job 이름과 설명


- (선택) Jenkins 서버 상에 작업 경로 설정

- 미설정 시 서버 사용자 계정 하위 임의 경로(~/workspace/잡 이름)에 생성 됨


원하는 경로에서 작업하기 위해 사용자 빌드 경로 입력(기본 폴더가 됨)


- 소스를 형상 관리로부터 가져오기 (git인 경우)


소스 git 에서 가져오기 위한 설정 부분


- 빌드 수행 주기 설정


빌드(테스트) 수행 주기- 현재는 매일 새벽 3시 수행


- 실제 수행될 내용을 설정 (ant 인 경우)


테스트 수행을 위한 ant 수행 스크립트

PMD 수행을 위한 ant 수행 스크립트


- Maven인 경우, pom.xml 경로 설정

(커맨드 라인 지원)



- 빌드 수행 후 후속 작업 설정 (Junit, 테스트 커버리지, PMD 등 결과 xml파일을 연결 설정)

※ 유의사항 : Jenkins 자체가 리포트를 만들어 주는게 아니라 별도 스크립트에서 해당결과를 xml로 떨구면 Jenkins 에서 연결하는

형태임


테스트 하면서 생성된 커버리지 정보를레포트로 만들어 주는 작업 추가

테스트 결과 정보를 입력받아레포트로 만들어 주는 작업 추가

PMD 결과 정보를 입력받아레포트로 만들어 주는 작업 추가

� Ant 스크립트 파일 샘플 (1/3)

-


각종 폴더 경로 정보변수명=실제경로

사용할 때는 @{변수명}으로사용


-


환경 정보 파일 가져오기

각종 라이브러리 경로 정의


-


소스 컴파일, 테스트 컴파일, 커버리지 측정을 위한 사전 설정 작업

Junit 테스트 실행 부분

� Maven pom.xml 파일 샘플

-


개발 코드(Java, C, C++,…)

� SonarQube를 통한 품질 지표 가시화

- 프로젝트에 대한 (코드기반)품질 대시보드를 제공

5.2 SonarQube

SonarQubeSonarQubeSonarQubeSonarQube

테스트 코드

코드 분석(라인 수,

복잡도,응집도,결합도 등)코드 정적 검사

PluginsPluginsPluginsPlugins

테스트&커버리지

SourceSourceSourceSource

Scanner 별도 실행

5.2 SonarQube

현장에서현장에서현장에서현장에서 종종종종종종종종 만나는만나는만나는만나는 상황상황상황상황

SonarQubeSonarQubeSonarQubeSonarQube 설정하고설정하고설정하고설정하고 지표가지표가지표가지표가 보여지면보여지면보여지면보여지면품질품질품질품질 활동이활동이활동이활동이 끝나는끝나는끝나는끝나는 이상한이상한이상한이상한 현상현상현상현상그그그그 이후의이후의이후의이후의 책임은책임은책임은책임은 개발팀에개발팀에개발팀에개발팀에…????

No~!!!!No~!!!!No~!!!!No~!!!!

메소드가메소드가메소드가메소드가 너무너무너무너무 길거나길거나길거나길거나((((라인라인라인라인), ), ), ), 복잡도가복잡도가복잡도가복잡도가 높으면높으면높으면높으면 리팩토링리팩토링리팩토링리팩토링 가이드를가이드를가이드를가이드를,,,,코딩코딩코딩코딩 룰룰룰룰 위반이위반이위반이위반이 많으면많으면많으면많으면 코딩코딩코딩코딩 룰룰룰룰 설명과설명과설명과설명과 조치조치조치조치 가이드를가이드를가이드를가이드를,,,,테스트테스트테스트테스트 실패가실패가실패가실패가 많으면많으면많으면많으면 테스트테스트테스트테스트 결과결과결과결과 설명을설명을설명을설명을,,,,테스트테스트테스트테스트 커버리지가커버리지가커버리지가커버리지가 낮으면낮으면낮으면낮으면 테스트테스트테스트테스트 케이스케이스케이스케이스 분석을분석을분석을분석을,,,,

수행할수행할수행할수행할 수수수수 있는있는있는있는 시작점이시작점이시작점이시작점이 된다된다된다된다

테스터도 알아야 할 웹 개발(테스트 교육 3장 1절 부분발췌)

Software