제 2 장 : 기본적인 웹 페이지 만들기 > db

이전의 강좌에서는 기본적인 기능만을 이용하여 웹 페이지를 만들어 보았습니다. 여기에 템플릿을 이용하면 다음 [그림 1]과 같이 깔끔한 웹 페이지를 얻을 수 있습니다. 이번 강좌에서는 이에 대하여 살펴보도록 하겠습니다.

[그림 1]

1. 템플릿 파일 만들기

우선 다음과같은 내용의 템플릿 파일을 만들어야 합니다. 메모장과 같은 일반적인 에디터로 편집하셔도 됩니다. 아래 내용 중 나머지는 일반적인 HTML 태그입니다. 단지 빨간색 부분만 주의깊게 살펴보시기 바랍니다.

o <%begindetail%> 는 레코드가 웹 페이지에 보일 때 반복되어질 구간의 시작을 지정하는 것입니다.
o <%enddetail%> 는 레코드가 웹 페이지에 보일 때 반복되어질 구간의 끝을 지정하는 것입니다.
o <%insert_data_here%> 는 레코드가 웹 페이지에 보일 때 검색된 컬럼들이 표시될 위치를 지정합니다.
o 위에서 <%insert_data_here%> 다섯개를 쓴 것은 검색될 행이 5개가 될 것이기 때문입니다.

사실 위와 같은 템플릿을 일일이 입력하기는 쉽지가 않습니다. 그래서 많이 사용하는 방법이 HTML 에디터로 원하는 웹 페이지를 디자인 한 후 위의 빨간 색 부분만 각각의 위치에 입력하는 것입니다.

이 템플릿 파일을 E:DataTOP20.TPL 이라는 이름으로 저장을 합니다. 나머지 과정은 이전 강좌에서 했던 내용과 동일합니다. 단지 중간 과정에서 템플릿 파일을 지정하는 과정이 추가되며 이로 인해 나머지 HTML 문서 형식 지정하는 과정이 생략되게 됩니다.

2. 웹 길잡이 마법사 사용하기

이전의 강좌에서 설명된 내용이므로 각 화면에 대한 설명은 생략하도록 하겠습니다.

[그림 2]

1) 데이터베이스 선택

[그림 3]

2) 새 웹 길잡이 작업 시작 선택

주의 : 이전 강좌에서 만든 것과 충돌을 피하기 위해 이름을 "판매 현황 #2" 로 하시기 바랍니다.

[그림 4]

3) Transact-SQL 쿼리 쓰기

주의 : 이전 강좌에서는 TOP 10으로 했으나 이번 강좌에서는 TOP 20 으로 해서 더 많은 행을 검색하고록 하시기 바합니다.

[그림 5]

쿼리문의 내용은 다음과 같습니다.

4) 웹 길잡이 작업 예약

[그림 6]

5) 테이블 및 열 모니터링

[그림 7]

6) 웹 페이지 게시

주의 : 이전 강좌에서 만든 것과 충돌을 피하기 위해 이름을 "판매현황2.htm" 으로 하시기 바랍니다.

[그림 8]

7) 웹 페이지 서식 지정

처음에 만든 템플릿 파일을 다음 [그림 9]와 같이 지정합니다. 그리고 사용할 문자 집합은 "한국어"로 지정합니다.

[그림 9]

8) 행수 제한

[그림 10]

9) 웹 길잡이 마법사 완료

[그림 11]

12) 결과 확인

위 과정으로 새로 만든 E:Data판매현황2.htm 문서를 오픈하면 다음 [그림 12] 과 같은 결과를 얻게 됩니다. 이 웹 페이지의 내용은 Sales 테이블이 변경이 되면 내부적으로 설정된 트리거(Trigger)에 의해 자동으로 변경되어집니다.

[그림 12]

3. 정리

이상으로 테이블의 데이터를 웹 페이지로 표시하는 방법을 살펴 보았습니다. 이전의 강좌 내용과 비교해 가면서 실습을 하시면 별 문제 없이 진행 할 수 있습니다. HTML 편집기를 이용해서 멋진 웹페이지를 만든 후 이를 이용하여 템플릿 파일을 만든다면 아주 멋진 웹 페이지를 만들 수 있습니다.