KR20020089067A - 웹기반 아이티시스템 구축시 화면설계명세서 및 소스코드자동생성 방법 - Google Patents

Abstract

본 발명은 IT시스템 구축시 설계구조를 자동분석하여 화면설계명세서와 프로토타입 소스코드들을 자동생성하는 방법에 관한 것으로, 화면설계명세서와 프로토타입소스코드들이 설계구조와 연동되어 생성됨으로써, 설계구조변경시에 이들도 이를 반영하여 자동변경됨을 특징으로 한다.

4종류의 설계구조입력기으로 부터 입력된 설계구조를 XML형태로 변환하여 저장하고, 화면설계명세생성기가 이를 분석하여 화면설계명세서를 생성하게 된다. 저장된 XML설계구조를 프로토타입생성기와 프로그램생성기가 분석하여 각각 HTML소스코드와 스크립트소스코드를 생성하게 된다.

본 발명은 화면설계명세서와 소스코드들을 자동생성, 변경 해 줌으로써 수동작업에 의한 프로그램 오류나 작업누락문제를 줄이고, 작업시간, 작업비용들도 최소화시켜준다.

Description

웹기반 아이티시스템 구축시 화면설계명세서 및 소스코드 자동생성 방법{Automatic generation method of Page source code and screenpage design description based on IT system}

본 발명은 웹(Web)에 기반한 IT시스템구축시 설계단계에서 생성되어야하는 화면설계명세서와 각 화면을 구성할 기본 소스코드들을 자동으로 생성하고, 설계구조변경시에도 이와 관련하여 화면설계명세서와 소스코드를 자동수정하는 방법 관한 것이다.

일반적으로 웹기반 IT시스템을 구축함에 있어 각각의 화면에 대하여 화면설계명세서를 작성하게 되며, 이 명세서에는 시스템 설계구조에 기초한 화면구성요소(버튼, 링크, 입력, 출력내용 등)가 서술된다. 이러한 화면설계명세서는 대부분의 경우 MS Word나 HWP같은 문서작성기를 통해 수동으로 만들어지기 때문에 설계구조가 변경되었을 경우 변경내용과 관련된 모든 명세서를 수작업으로 변경해야한다. 또한, 이 과정에서 많은 명세서를 수정해야할 경우 미처 수정하지 못한 명세서들이 발생할 문제도 안고 있다.

웹기반 IT시스템의 각 화면은 구현 후 HTML(Hyper Text Markup Language)로 구성된 페이지로 존재하며, 이 페이지내 HTML들 중 일부는 JSP(Java Script Page)나 ASP(Active Script Page)같은 스크립트언어프로그램으로부터 생성된다. 이 스크립트언어로 구성된 프로그램은 DB(Database)와 연동되는 경우가 대부분이다. 따라서, DB구조가 바뀌거나 데이타처리방식이 바꾸거나 하는 등 설계구조가 바뀌게 되면 스크립트프로그램도 변경되어야한다. 일반적으로 DB와 스크립트프로그램사이에는 논리적으로만 관계할뿐 물리적인 연결이 없다. 즉, DB설계를 근거로 프로그램이 작성되지만 이 과정에서 DB와 직접 연결되서 프로그램소스가 만들어지는 것이 아니고 프로그래머의 수작업에 의해서 연결관계가 생긴다. 따라서, 화면설계명세서와 마찬가지로 설계구조변경시 관련 프로그램들은 모두 프로그래머의 수작업에 의해 수정되어야하며, 미처 수정못한 프로그램들이 발생할 우려도 있다.

상기와 같은 문제점들을 해결하고자 본 발명에서는 화면명세서와 기본 HTML, 스크립트 소스코드를 설계구조와 연동하여 자동생성하는 방법을 제안하고자 한다

본발명의 목적은 IT시스템구축시 화면설계명세서와 화면별로 기본이 되는 프로토타입(Prototype) HTML/스크립트 소스코드를 설계구조와 연동되게 하여 자동생성 및 자동수정되도록 함에 있다.

이와 같은 목적의 본 발명은 설계구조로부터 화면설계명세서를 자동으로 생성하는 기술, 설계구조로부터 프로토타입 소스코드들을 자동생성하는 기술, 변경된 설계내용을 소스코드에 자동으로 반영되도록 하는 기술, 같은 DB구조를 가진 다양한 형식의 페이지들을 지정된 특정문서만을 다시 정의하여 줌으로써 각 페이지에 맞는 프로토타입 소스코드들을 생성할 수 있는 기술 등을 제공한다.

도1은 본 발명에 따른 프로토타입 소스코드 생성 전체 흐름도

도2는 본 발명에 따른 프로토타입생성기에 의한 소스코드생성 흐름도

도3은 본 발명에 따른 화면설계명세서 자동생성 흐름도

도4는 본 발명에 따른 설계구조 입력기의 구성

<도면의 주요부분에 대한 간단한 설명>

10 : 설계구조입력기101 : 액티비티다이어그램입력기

102: 클래스다이어그램입력기103 : 유즈케이스다이어그램입력기

104: 엔티티관계다이어그램입력기

11 : 데이타연동저장구조

12 : XML설계구조13 : 프로토타입생성기

131 : 프로토타입출력서식14 : 프로토타입 HTML소스코드

15 : 프로그램생성기16 : 프로토타입 스크립트소스코드

20 : 클래스201 : 속성

21 : 화면밴드211 : 화면요소

22 : 뷰셋221 : 형상

23 : 프로토타입 HTML소스코드

231 : HTML요소30 : 화면설계명세생성기

301 : 화면설계명세출력서식31 : 화면설계명세서

본 발명은 웹(Web)에 기반한 IT시스템구축시 설계단계에서 생성되어야하는 화면설계명세서와 구현단계에서 생성될 HTML/스크립트 소스코드들의 프로토타입 소스코드들을 자동생성하는 방법에 대한 것으로, 이하 도면을 참조하여 본발명에 대해 상세히 설명하기로 한다.

먼저 프로토타입 소스코드를 자동생성방법에 대해 설명하고자 한다.

도1은 본발명에 의한 설계구조작성부터 프로토타입 소스코드생성까지의 과정을 나타낸 것이다. 먼저 설계구조입력기(10)를 통해 수동으로 설계구조가 입력된다. 입력된 설계구조는 데이터연동저장구조(11)에 의해 XML(eXtended Markup Language)형태(12)로 변환되어 저장된다. 설계구조(12)가 저장되면 프로토타입생성기(13)는 이를 분석한 후 출력서식(131)을 이용하여 프로토타입 HTML소스코드(14)를 생성하게 된다. 프로그램생성기(15)는 프로토타입생성기(14)에 의해 생성된 HTML소스코드(14)와 이미 저장되어 있는 설계구조(12)를 분석하여 프로토타입 스크립트소스코드(16)를 생성한 후 이를 HTML소스코드와 합해서 최종 프로토타입 소스코드(16)를 만들어내게 된다.

이하에서 다시 프로토타입생성기와 프로그램생성기에 의해 소스코드들이 생성되는 방식에 대해 분류하여 상세히 설명하기로 한다.

(1) 프로토타입생성기에 의한 HTML소스코드 생성 방식

도2는 프로토타입생성기에 의해 프로토타입생성기에 의해 HTML소스코드가 생성되는 과정을 보여주는 도면이다.

IT시스템에서 다루어질 객체들을 클래스라 하면 각 클래스들은 속성을 가지게 된다. 예를 들어, 경매사이트라 하면 회원, 경매물품 등이 클래스가 되며, 회원이라는 클래스는 관련정보인 이름, 주소, 전화번호, e-mail 등등을 속성으로 가지게 된다. 이러한 클래스들과 이에 속하는 속성들은 설계구조입력기에 의해 수동입력되어 설계구조상에 이미 이미 저장되어 있게 된다.

프로토타입생성기는 바로 이 속성들과 관련하여 소스코드를 생성하게된다. 즉, 소스코드를 생성해야할 페이지의 설계구조에 속한 클래스들(20)과 그 속성들(201)로부터 HTML소스코드를 생성하게 되는 것이다.

프로토타입생성기는 먼저 클래스(20)의 각 속성(201)에 대해 1:1로 대응되는 화면요소(211)를 생성시킨다. 화면요소(211)는 속성(201)들을 형상(221)들과 연결시켜주는 역할을 한다. 즉, 속성1이 형상A, 형상B등을 가진다고 했을 때, 화면요소는 속성1은 형상A,B와 연결된다는 정보를 가지는 것이다. 이 때, 속성1이 형상A와 B를 가짐은 출력서식에서 미리 속성별 관련형상들을 지정해 놓은 것으로부터 가져온다. 화면요소라는 것을 생성하는 이유는 특정속성에 연결된 형상을 찾을 경우 형상들을 모두 검색하지 않고 속성에 연결된 화면요소를 통해 빠르게 찾아 처리하기 위함이다. 생성된 모든 화면요소(211)들의 집합을 화면밴드(21)라 정의한다. 형상(221)은 HTML요소(231)와 1:1로 대응되며, 대응된 HTML요소(231)의 색, 크기, 위치 등의 HTML속성정보를 가지고 있다. 이때, 대응되는 형상과 HTML요소는 다른형상이나 HTML들과 구별되는 고유한 ID를 공유하게 되는데, 이는 HTML요소값이 변경되면 형상에 이를 자동반영하고, 반대로 형상에 변경값이 있으면 이를 HTML요소에 자동반영하기 위한 것이다. 생성된 형상(221)들의 전체집합을 뷰셋(Viewset)(22)이라 정의한다. 최종적으로 한 속성은 화면요소와 형상을 통해 HTML요소들을 가지게 되며 해당 페이지에서 다뤄질 속성들의 HTML요소들을 합하면 그 페이지의 HTML소스코드가 생성되는 것이다.

상기 프로토타입생성기에 의한 HTML소스코드생성과정을 회원이라는 클래스에 이름이라는 속성에 대한 실시예를 들어 다시 설명하면 다음과 같다.

먼저, 프로토타입생성기는 이름이라는 속성에 대응하는 화면요소를 화면밴드에 추가한다. 화면요소는 출력서식으로부터 이름이라는 속성은 해당페이지에서 텍스트와 입력상자를 형상으로 가져야된다는 정보를 가져온 후 텍스트 HTML요소를 정의할 형상1과 입력상자HTML요소를 정의한 형상2를 뷰셋에 추가한다. 이 때, 형상1에는 A라는 ID를, 형상2에는 B라는 ID를 부여한다. 형상1이 지정한 글자크기, 글자색, 위치 등에 맞게 HTML소스코드가 생성되고, 이 소스코드는 A라는 ID를 가지며, 형상2가 지정한 입력내용크기, 상자크기, name, type 등에 맞게 HTML소스코드가 생성되며 이 소스코드는 B라는 ID를 가진다.

회원이란 클래스에 속한 모든 속성들에 대해 상기방식으로 소스코드들을 생성하고, 만일 해당 페이지에 회원이란 클래스 외에 다른 클래스가 있다면 이 클래스에 대해서도 소스코드들을 생성한 후 이를 합하면 프로토타입 HTML소스코드가 생성되게 되는 것이다.

(2) 프로그램생성기에 의한 스크립트소스코드 생성 방식

IT시스템의 클래스들은 설계구조상에서 기능(function)이란 하부요소를 가지게 된다. 기능은 클래스가 처리되는 방식으로, 특정한 클래스를 제외하고는 일반적으로 목록조회, 등록, 열람, 수정, 삭제 중 전체 또는 일부를 기능으로 가지게 된다. 예를 들어 회원이라는 클래스의 경우 사이트내에서 회원목록을 조회하거나 신규회원등록, 회원등록정보열람, 회원등록정보수정, 회원삭제 등의 처리방식을 가진다. 즉, 회원이라는 클래스는 목록조회, 등록, 열람, 수정, 삭제를 기능으로 가지는 것이다.

프로그램생성기는 바로 이 함수들과 관련되어 소스코드를 생성하게된다. 즉, 소스코드를 생성해야할 페이지의 설계구조에 속한 클래스들과 그 함수들로 부터 스크립트소스코드를 생성하게 되는 것이다.

프로그램생성기는 먼저 설계구조로부터 DB정보를 수집한 후 속성요소의 중복을 제거하고, 다시 각 클래스의 DB정보를 정리한 뒤, 이를 스크립트소스코드에서 사용할 수 있도록 클래스별로 Inc파일을 만든다.

Inc파일 생성이후부터 스크립트소스코드를 생성하는 방법을 아래에서 목록조회, 등록, 열람, 수정, 삭제로 분류하여 상세히 설명하겠다.

① 클래스목록을 조회하기 위한 스크립트소스 생성 방법

클래스등록을 위한 스크립트소스는 Include부, Select query부, 데이터유무처리부, 목록출력부의 순서로 구성된다.

맨 첫부분인 Include부에는 현재 클래스의 DB정보에 해당되는 Inc파일을 Include하는 소스를 생성한다. Select query부에는 해당 페이지와 관련된 클래스속성들로부터 사용할 테이블명을 추출하고, 테이블에 속하는 속성들의 물리적이름을 가져와 Select할 필드를 만든후, 테이블명과 필드로부터 Select query소스코드를 생성하여 삽입한다. 단, 테이블이 2개 이상일 경우 Join해서 Select하도록 소스를 만든다.

목록출력부에는 Select query를이용해 레코드셋을 만들고, 속성들의 제목에 맞춰 query한 결과를 출력하는 소스코드를 생성한다.

데이터유무출력부에는 출력할 데이터가 없는 경우 해당 메시지를 출력하고, 있는 경우 상기의 목록출력부로 연결하는 소스코드를 삽입한다.

② 클래스를 등록시키기위한 스크립트소스 생성 방법

클래스등록을 위한 스크립트소스는 등록정보를 입력받아 DB에 추가하는 페이지와 등록성공시 출력하는 페이지, 등록실패시 출력되는 페이지로 구성된다.

등록정보를 입력받아 DB에 추가하는 페이지는 다시, Include부, 입력부, 등록부의 순서로 구성된다.

맨 앞부분인 Include부에는 현재 클래스의 DB정보에 해당되는 Inc파일을 Include하는 소스를 생성한다. 입력부는 사용자가 클래스를 신규등록시키기위해 정보를 입력하는 화면을 출력하는 것으로, 프로토타입생성부에서 생성된 HTML소스코드를 삽입한다. 등록부에는 입력부를 통해 입력된 내용들의 name속성과 type속성들을 이용해 request 변수를 만들고, 이 변수와 Inculde를 이용해서 포함시킨 클래스의 테이블이름을 이용하여 각 타입에 맞게 Update query소스코드를 생성시키고, Query 등록성공시 연결할 페이지와 실패시는 연결할 페이지로 하이퍼링크해 주는 소스를 추가한다.

등록성공페이지와 등록실패페이지에는 해당 텍스트메시지를 출력하는 부분과 출력후 연결될 페이지로 하이퍼링크를 걸어주는 소스들을 생성시킨다.

③ 클래스를 열람하기 위한 스크립트소스 생성 방법

클래스열람을 위한 스크립트소스는 Include부, Select query부, 목록출력부, hidden 파라미터생성부의 순서로 구성된다.

맨 첫부분인 Include부에는 현재 클래스의 DB정보에 해당되는 Inc파일을 Include하는 소스를 생성한다. Select query부에는 해당 페이지와 관련된 클래스속성들로부터 사용할 테이블명을 추출하고, 테이블에 속하는 속성들의 물리적이름을 가져와 Select할 필드를 만들고, 속성들중 기본키(primary key) 속성을 가진 것을 찾은 후, 이를 이용해 Select query소스코드를 생성하여 삽입한다. 단, 테이블이 2개 이상일 경우 Join해서 Select하도록 소스를 만든다. Select query결과를 변수에 저장하는 소스를 추가한다.

목록출력부에는 속성들의 제목에 맞춰 query한 결과를 출력하는 소스코드를 생성한다.

hidden 파라미터출력부에는 기본키(primary)속성을 가진 클래스속성을 찾아 이를 이용해, 수정/삭제페이지에서 사용될 파라미터를 hidden으로 생성하는 소스코드를 삽입한다.

④ 클래스를 수정하기 위한 스크립트소스 생성 방법

클래스등록을 위한 스크립트소스는 수정정보를 입력받는 페이지와 입력받은 내용을 DB에 update하는 페이지와 update성공시 출력하는 페이지, 실패시 출력되는 페이지로 구성된다.

수정정보를 입력받는 페이지는 Include부, 기존데이타출력부, 수정부의 순서로 구성된다.

맨 앞부분인 Include부에는 현재 클래스의 DB정보에 해당되는 Inc파일을 Include하는 소스를 생성한다. 기존데이타출력부에는 상기 열람페이지에서 넘어온 primary 속성을 가지고 Select query소스를 생성시키고, query결과를 변수에 저장하는 소스를 생성시킨다. 해당되는 컨트롤의 위치를 찾아 데이터출력 스크립트소스를 삽입하고, primary 속성을 가지고 hidden컨트롤를 생성하는 소스를 추가한다.

DB업데이트페이지는 Include부, Update query부, 링크부의 순서로 구성된다.

Include부에는 현재 클래스의 DB정보에 해당되는 Inc파일을 Include하는 소스를 생성한다. Update부는 열람페이지에서 넘어온 클래스속성들이 name과 type속성을 이용해 request변수를 만들과 이 변수와 테이블이름을 이용해 각 type에 맞게 Update query소스를 생성하여 삽입한다.

링크부에서는 Query Update성공시 연결할 페이지와 실패시 연결할 페이지로 하이퍼링크해주는 소스를 추가한다.

Update성공페이지와 실패페이지에는 해당 텍스트메시지를 출력하는 부분과 출력후 연결될 페이지로 하이퍼링크를 걸어주는 소스들을 생성시킨다.

⑤ 클래스를 삭제하기 위한 스크립트소스 생성 방법

클래스삭제를 위한 스크립트소스는 Include부, Delete query부, 링크부로 구성된다.

맨 첫부분인 Include부에는 현재 클래스의 DB정보에 해당되는 Inc파일을 Include하는 소스를 생성한다. Delete query부에는 상기 열람페이지에서 넘어온 Primary key 속성을 가진 클래스속성을과 속성들의 타입을 가지고 Delete query소스를 생성하여 삽입한다. 링크부에서는 삭제성공시 연결할 페이지와 실패시 연결할 페이지로 하이퍼링크해주는 소스를 추가한다.

상기 본발명에 의한 프로토타입 HTML과 스크립트소스 생성과정을 보면 모든과정이 설계구조와 연동되어 자동으로 소스코드가 생성됨을 알 수 있다. 따라서, 설계구조에 변동이 생기면 동일한 과정을 거쳐 자동으로 화면밴드, 뷰셋, 소스코드의 순서로 변동사항이 자동으로 반영되게 된다. 즉 본 발명에 의해 프로토타입의 소스코드들을 생성할 경우 수작업없이도 설계구조의 변동사항을 소스코드에 자동반영시키게 되는 것이다.

다음으로 화면설계명세서를 자동생성하는 방법을 설명하고자 한다.

화면설계명세서는 상기의 HTML요소들의 동작, 관련 클래스, 화면요소과 관련된 속성 등을 기술하여 작업자에게 화면이 어떻게 보여지고, 동작하도록 구성해야하는지 지시를 내리는 지시서이자 설계서이다. 명세서의 각 요소에 대한 설명은 수작업으로 입력하게 되지만 본 발명에서는 명세서의 중요한 요수중 하나인 각각 화면요소들과 속성간의 연결, 입출력 클래스정보 등은 설계구조를 이용하여 자동생성하여 주게 된다.

도3은 설계구조작성부터 화면설계명세서생성까지의 과정을 나타낸 것이다.

상기에서 설명한 바와 같이 먼저 설계구조입력기(10)를 통해 수동으로 설계구조가 입력되고, 입력된 설계구조는 데이터연동저장구조(11)에 의해 XML(eXtended Markup Language)형태(12)로 변환되어 저장되어진다. 설계구조(12)가 저장되면 화면설계명세생성기(30)는 이를 분석한 후 출력서식(301)을 이용하여 화면설계명세서(31)를 생성하게 된다.

상기와 같이 본 발명에 의한 화면설계명세서의 중요내용이 설계구조와 연동되어 자동생성됨으로, 설계구조에 변동이 생기면 동일한 과정을 거쳐 자동으로 화면설계명세서에도 이 변동이 반영되어 수정되게 된다. 또한, 일반적으로는 모든 화면설계명세서가 설계구조를 작성하고 나서 작업을 할당하기 위해 각 화면별로 수작업으로 작성되어, 프로그래머들에게 나누어지게 되는데 이 수작업의 상당부분을 자동화 시킴으로써 명세서제작작업을 크게 줄일 수 있게 되었다.

상술한 바와 같이 본 발명에 의하면 설계구조로부터 화면설계명세서와 프로토타입의 소스코드들이 자동생성됨을 알 수 있다. 따라서, 프로그램구축시간을 단축시켜주는 효과가 있다. 또한, 이 방식은 화면설계서와 프로토타입 소스코드들이 설계구조와 유기적으로 결합되어 있어, 설계구조의 변동시 화면설계서와 소스코드들도 자동변경되게 되어 프로그래머들의 수작업을 줄여주고, 수정못한 화면설계서나 소스코드가 발생할 수도 있는 수작업의 문제점을 해결하여 업무효율을 높여준다.

Claims (5)

1. 웹기반 IT시스템 구축시 설계구조에 근거하여 화면설계명세서와 소스코드를 자동생성함에 있어서,

   설계구조를 수동으로 입력받아 이를 XML형태로 변환하여 저장하고, 이를 이용하여 프로토타입생성기와 프로그램생성기에 의해 각각 프로토타입 HTML소스코드와 스크립트소스코드를 생성함을 특징으로 하는 IT시스템 화면설계서 및 소스코드 자동생성 방법.
2. 웹기반 IT시스템 구축시 설계구조에 근거하여 화면설계명세서와 소스코드를 자동생성함에 있어서,

   설계구조를 수동으로 입력받아 이를 XML형태로 변환하여 저장하고, 이를 이용하여 화면설계명세생성기에 의해 화면설계명세서를 자동생성함을 특징으로 하는 IT시스템 화면설계서 및 소스코드 자동생성 방법.
3. 상기 제1항에 있어서,

   프로토타입생성기는 IT시스템에서 처리될 객체인 클래스의 각 속성을 화면요소를 생성하고 1:1 대응시키고, 화면요소는 HTML요소들의 속성을 정의하는 형상들을 대응된 속성에 맞게 생성하여 연결시켜주며, 형상은 다시 HTML요소를 생성하여 1:1로 대응함으로써 HTML소스코드들을 생성함을 특징으로하는 IT시스템 화면설계서 및 소스코드 자동생성 방법.
4. 상기 제3항에 있어서,

   형상과 HTML은 다른 형상이나 HTML들과 구별되는 고유한 ID를 공유하게 하여, HTML요소값이 변경되면 형상에 이를 자동반영하고, 반대로 형상에 변경값이 있으면 이를 HTML요소에 자동반영되도록 함을 특징으로 하는 IT시스템 화면설계서 및 소스코드 자동생성 방법.
5. 상기 제1항에 있어서,

   프로그램생성기는 객체가 처리되는 일반적인 방식인 목록조회, 등록, 열람, 수정, 삭제에 대한 스크립트소스코드생성방식을 각각 미리 정의해놓고 클래스의 속성에 따라 해당 소스코드부분들만 변경하여 스크립트소스코드를 생성함을 특징으로 하는 IT시스템 화면설계서 및 소스코드 자동생성 방법.