🥐5. main.jsp 작성하기

2026. 6. 1. 14:422🥐 제과점 프로그램

04. 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 / list_j.jsp / list_jg.jsp 출력

즉 main.jsp는 프로그램 시작 시 가장 먼저 보여주는 기본 안내 화면입니다.


11. 현재까지 완성된 구조

현재까지 만든 파일은 다음과 같습니다.

db.sql
→ 데이터베이스 생성

Util.java
→ Oracle DB 연결

index.jsp
→ 전체 화면 구조 생성

style.css
→ 화면 디자인 적용

main.jsp
→ 프로그램 설명 화면 출력

이제 다음 단계에서는:

reg.jsp

를 작성해서 실제로 판매정보를 입력하는 판매등록 화면을 만들어보겠습니다.

'2🥐 제과점 프로그램' 카테고리의 다른 글

🥐7. action.jsp 작성하기  (0) 2026.06.01
🥐6. reg.jsp 작성하기  (0) 2026.06.01
🥐4. style.css 작성하기  (0) 2026.06.01
🥐3. index.jsp 작성하기  (0) 2026.06.01
🥐2. DB 생성 흐름  (0) 2026.06.01