정보처리기사 실기
🪑5. main.jsp 작성하기 본문
독서실 자리관리 프로그램 설명 화면 만들기
앞에서 index.jsp와 style.css를 작성하면서 웹사이트의 전체 틀과 디자인을 만들었습니다.
그리고 index.jsp에는 다음 코드가 있었습니다.
<iframe name="section_page" src="main.jsp"></iframe>
즉 현재 프로젝트는 처음 실행되면:
main.jsp
가 section 영역에 자동으로 출력되는 구조입니다.
따라서 이번 단계에서는 프로그램 실행 시 가장 먼저 보여줄 안내 화면을 만들어보겠습니다.
1. 왜 main.jsp가 필요한가?
현재 문제에서는 메뉴를 클릭하면 다음 화면으로 이동할 수 있습니다.
자리등록
자리현황
일별검색
학습자별이용료
하지만 프로그램을 처음 실행했을 때는 아직 아무 메뉴도 클릭하지 않은 상태입니다.
즉 처음 접속한 사용자에게:
이 프로그램이 어떤 프로그램인지
어떤 순서로 작업하는지
를 설명해주는 기본 화면이 필요합니다.
그 역할을 하는 파일이:
main.jsp
입니다.
2. 현재 프로젝트에서 main.jsp 역할
현재 프로젝트에서 main.jsp는:
프로그램 소개 화면
역할을 합니다.
즉 실제 DB 저장이나 조회 기능은 없고, 사용자에게 현재 프로그램 설명을 보여주는 페이지입니다.
3. main.jsp 전체 코드
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h4>독서실 자리관리 프로그램</h4>
<pre>
독서실 자리관리를 위한 데이터베이스를 구축하고 독서실 자리관리 프로그램을 작성하는 프로그램이다.
프로그램 작성순서
1. 독서실 테이블을 작성한다.
2. 학습자 테이블을 작성한다.
3. 독서실 및 학습자 테이블에서 제시된 문제지의 참조데이터를 추가 생성한다.
4. 홈페이지 프로그램을 작성한다.
5. 자리등록 프로그램을 조건에 맞게 작성한다.
6. 자리현황, 일별검색 프로그램을 작성한다.
</pre>
</body>
</html>
4. main.jsp가 출력되는 위치
앞에서 작성한 index.jsp에는 다음 코드가 있었습니다.
<iframe name="section_page" src="main.jsp"></iframe>
즉 index.jsp가 실행되면:
section 영역 안에
main.jsp가 자동 출력
됩니다.
현재 구조를 다시 보면:
header → 유지
nav → 유지
section → main.jsp 출력
footer → 유지
입니다.
즉 main.jsp는 section 안에 들어가는 첫 화면입니다.
5. h4 태그 사용하는 이유
<h4>독서실 자리관리 프로그램</h4>
현재 화면에서는 프로그램 제목을 보여줘야 합니다.
그래서 제목 태그인:
<h4>
를 사용합니다.
index.jsp의 header에는 큰 프로그램 제목이 이미 있기 때문에,
section 안에서는 너무 큰 제목보다는 h4 정도로 설명 제목을 넣어주는 것이 자연스럽습니다.
6. pre 태그를 사용하는 이유
이번 코드에서 중요한 부분은 다음 태그입니다.
<pre>
pre 태그는 작성한 모양 그대로 화면에 출력해주는 태그입니다.
7. 왜 pre 태그를 사용할까?
현재 화면에서는 다음처럼 순서를 줄바꿈해서 보여줘야 합니다.
1. 독서실 테이블을 작성한다.
2. 학습자 테이블을 작성한다.
3. 독서실 및 학습자 테이블에서 제시된 문제지의 참조데이터를 추가 생성한다.
하지만 일반 HTML에서는 Enter를 쳐도 화면에서 줄바꿈이 그대로 유지되지 않을 수 있습니다.
예를 들어 코드에:
안녕하세요
반갑습니다
라고 작성해도 실제 화면에서는:
안녕하세요 반갑습니다
처럼 한 줄로 붙어서 출력될 수 있습니다.
그래서 작성한 줄바꿈과 띄어쓰기를 그대로 보여주기 위해 pre 태그를 사용합니다.
8. pre 태그 역할
<pre>
는 다음 역할을 합니다.
줄바꿈 유지
띄어쓰기 유지
작성 형태 유지
현재 문제처럼:
프로그램 설명
작업 순서
안내 문장
을 출력할 때 사용하면 편리합니다.
9. 현재 main.jsp가 하는 역할
현재 화면에서는 사용자가 처음 프로그램을 실행했을 때:
이 프로그램이 무엇인지
어떤 순서로 작업되는지
를 안내합니다.
즉 main.jsp는:
프로그램 설명서 화면
이라고 생각하면 됩니다.
10. 실제 실행 흐름
현재 프로젝트는 다음 순서로 동작합니다.
index.jsp 실행
↓
iframe 안에 main.jsp 출력
↓
사용자가 메뉴 클릭
↓
reg.jsp / list.jsp / search.jsp / list_jg.jsp 출력
즉 main.jsp는 프로그램 시작 시 가장 먼저 보여주는 기본 안내 화면입니다.
11. 현재까지 완성된 구조
현재까지 만든 파일은 다음과 같습니다.
db.sql
→ 데이터베이스 생성
index.jsp
→ 전체 화면 구조 생성
style.css
→ 화면 디자인 적용
main.jsp
→ 프로그램 설명 화면 출력
이제 다음 단계에서는:
reg.jsp
를 작성해서 실제로 독서실 자리를 등록하는 입력 화면을 만들어보겠습니다.
'🪑 독서실 자리관리 프로그램' 카테고리의 다른 글
| 🪑7. action.jsp 작성하기 (0) | 2026.06.02 |
|---|---|
| 🪑6. reg.jsp 작성하기 (0) | 2026.06.02 |
| 🪑4. style.css 작성하기 (0) | 2026.06.02 |
| 🪑3. index.jsp 작성하기 (0) | 2026.06.02 |
| 🪑2. DB 생성 흐름 (0) | 2026.06.02 |