1. ๊ฒ์ํ ๋ฉ์ธ ํ์ด์ง `bbs.jsp`๋ง๋ค๊ธฐ
๋จผ์ `main.jsp` ํ์ด์ง์์ ๊ฒ์ํ ๋ถ๋ถ href ์์ฑ์ "bbs.jsp" ๋ฅผ ์ฐ๊ฒฐํด์ค๋ค.
`main.jsp` ํ์ด์ง๋ฅผ ๋ณต์ฌํด์ webapp ์๋ค ๋ถ์ฌ๋ฃ๊ธฐ ํ๊ณ ์ด๋ฆ๋ง `bbs.jsp`๋ก ๋ฐ๊พธ์.
์ฌ๊ธฐ์ ์ฝ๋์ ์์ ์ข ๋ณผ ๊ฒ์ด๋ค.
๋ง๋ค์์ผ๋ฉด `Home`์ ์๋ active ํด๋์ค๋ฅผ `๊ฒ์ํ`์ผ๋ก ์ฎ๊ฒจ ์ค์ ํ์ฌ ์ ํํ ํ์ด์ง์์ ๊ฐ์์ ์ผ๋ก ๋ณด์ฌ ์ค๋ค.
๊ทธ ๋ค์ ๋ค๋น๊ฒ์ด์ ๋ฐ ์๋์ ๊ฒ์ํ ํ์์ ํ ์ด๋ธ์ ์ฝ์ ํด ์ค๋ค.
ํ ์ด๋ธ์ ๋ง๋ค๊ธฐ ์ ์ `<div>` ํ๊ทธ๋ก container์ row ์์ญ์ ์ก์ ์ฃผ๊ณ ํ ์ด๋ธ์ ๋ง๋ค์ด์ฃผ์.
<div class="container">
<div class="row">
<table class="table table-striped" style="text-align: center; border: 1px solid #dddddd;">
<thead>
<tr>
<th style="background-color: #eeeeee; text-align: center;">๋ฒํธ</th>
<th style="background-color: #eeeeee; text-align: center;">์ ๋ชฉ</th>
<th style="background-color: #eeeeee; text-align: center;">์์ฑ์</th>
<th style="background-color: #eeeeee; text-align: center;">์์ฑ์ผ</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>์๋
ํ์ธ์</td>
<td>์ต๋ค์ธ</td>
<td>2025-12-08</td>
</tr>
</tbody>
</table>
<a href="write.jsp" class="btn btn-primary ms-auto" style="width: auto;">๊ธ์ฐ๊ธฐ</a>
</div>
</div>
`<thead>`์๋ ๊ฒ์ํ ์์๋ค์ ์ ๋ชฉ์ ๋ฃ์ด์ค๋ค. ํ์๋ `๋ฒํธ`, `์ ๋ชฉ`, `์์ฑ์`, `์์ฑ์ผ` ๋ค ๊ฐ์ง ํญ๋ชฉ๋ง ๋ฃ์ด์ฃผ์๊ณ `<tbody>`์์ญ์๋ ์ค์ ๋ก ๋ฐ์ดํฐ๋ค์ด ํ์๊ฐ ๋ ๊ฑด๋ฐ ์ง๊ธ์ ๋ ์ด์์๋ง ๊ฐ๋จํ ํ์ธํด๋ณด๋ ค๊ณ ๊ทธ๋ฅ ์์์ ๋ฐ์ดํฐ ํ ์ค๋ง ๋ฃ์ด์ฃผ์๋ค.
๊ทธ๋ฆฌ๊ณ `<a>`ํ๊ทธ๋ก ๊ธ์ฐ๊ธฐ ๋ฒํผ๊น์ง ํ๋ ์์ฑํด์ฃผ๊ณ ํ๋ก์ ํธ๋ฅผ ์คํํด๋ณด์.
์คํํ๋ฉด์์ ๋ก๊ทธ์ธํด์ฃผ๊ณ ๊ฒ์ํ ๋ฒํผ ๋๋ฌ๋ณด์. `bbs.jsp`ํ์ด์ง๋ก ์ ์ด๋ํ๊ณ ๊ฒ์ํ ํ์์ด ์ ๋์จ๋ค. ํ ์ด๋ธ ๊ฐ์ด๋ฐ ์ ๋ ฌ๊ณผ ๊ธ์ฐ๊ธฐ ๋ฒํผ `ms-auto`์์ฑ์ผ๋ก ์ค๋ฅธ์ชฝ ์ ๋ ฌ๋ ์ ๋์ด ์๊ณ , ๊ธ์ฐ๊ธฐ ๋ฒํผ ํด๋ฆญํ์ ๋ `write.jsp` ํ์ด์ง๋ก ๋์ด๊ฐ๋ฉด ์ฑ๊ณต!
`write.jsp` ํ์ด์ง๋ ์์ง ์ ๋ง๋ค์๊ธฐ ๋๋ฌธ์ HTTP ์ํ ์ฝ๋ 404 ๋์ค๋ฉด ์ฑ๊ณต์ด๋ค ใ ใ
`bbs.jsp` ์ ์ฒด์์ค
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.io.PrintWriter" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.css">
<title>JSP ๊ฒ์ํ ์น ์ฌ์ดํธ</title>
</head>
<body>
<%
String userID = null;
if (session.getAttribute("userID") != null) {
userID = (String) session.getAttribute("userID");
}
%>
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="#">JSP ์น์ฌ์ดํธ</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link" aria-current="page" href="main.jsp">Home</a></li>
<li class="nav-item"><a class="nav-link active" href="bbs.jsp">๊ฒ์ํ</a></li>
</ul>
<%
if(userID == null) { // ๋ก๊ทธ์ธ ํ์ง ์์ ์ฌ์ฉ์์๊ฒ ๋ณด์ฌ์ค ํ๋ฉด
%>
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
์ ์ํ๊ธฐ<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="login.jsp">๋ก๊ทธ์ธ</a></li>
<li><a class="dropdown-item" href="join.jsp">ํ์๊ฐ์
</a></li>
</ul>
</li>
</ul>
<%
} else { // ๋ก๊ทธ์ธ ํ ์ฌ์ฉ์์๊ฒ ๋ณด์ฌ์ค ํ๋ฉด
%>
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
ํ์๊ด๋ฆฌ<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="logoutAction.jsp">๋ก๊ทธ์์</a></li>
</ul>
</li>
</ul>
<%
}
%>
</div>
</div>
</nav>
<div style="height: 40px"></div>
<div class="container">
<div class="row">
<table class="table table-striped" style="text-align: center; border: 1px solid #dddddd;">
<thead>
<tr>
<th style="background-color: #eeeeee; text-align: center;">๋ฒํธ</th>
<th style="background-color: #eeeeee; text-align: center;">์ ๋ชฉ</th>
<th style="background-color: #eeeeee; text-align: center;">์์ฑ์</th>
<th style="background-color: #eeeeee; text-align: center;">์์ฑ์ผ</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>์๋
ํ์ธ์</td>
<td>์ต๋ค์ธ</td>
<td>2025-12-08</td>
</tr>
</tbody>
</table>
<a href="write.jsp" class="btn btn-primary ms-auto" style="width: auto;">๊ธ์ฐ๊ธฐ</a>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>2. DB์์ ๊ฒ์ํ ๊ด๋ฆฌํ๋ BBS ํ ์ด๋ธ ๋ง๋ค๊ธฐ
์ฌ๊ธฐ๊น์ง ๋ง๋ฌด๋ฆฌํ์ผ๋ฉด MySQL์์ ๊ฒ์ํ์ ๊ด๋ฆฌํด์ค BBS ํ ์ด๋ธ์ ๋ง๋ค๋ฌ ๊ฐ์
MySQL Command Line ์คํ
๋ฃจํธ๊ณ์ ๋น๋ฐ๋ฒํธ ์
๋ ฅํ๊ณ , `use BBS;` ๋ช
๋ น์ด๋ก BBS ๋ฐ์ดํฐ ๋ฒ ์ด์ค ์ ์
๊ฒ์ํ์ ๊ด๋ฆฌํ๋ bbs ํ ์ด๋ธ ๋ง๋ค๊ณ ์ปฌ๋ผ 6๊ฐ ๋ง๋ค์ด ์ค ํ, `bbsID`๋ฅผ PK๋ก ์ง์
`bbsID`๋ ๊ธ๋ฒํธ, `bbsTitle`์ ๊ธ์ ๋ชฉ, `userID`๋ ์์ฑ์ ์์ด๋ `bbsDate`๋ ์์ฑ์ผ, `bbsContent`๋ ๊ธ๋ด์ฉ์ธ๋ฐ 2048๊ธ์๋ก ํฌ๊ธฐ๋ฅผ ์ค์ ํด์ฃผ์๋ค. ์ผ๋ฐ์ ์ผ๋ก ๊ฒ์๊ธ์ 500~1000์ ์ ๋์ด๊ธฐ ๋๋ฌธ์, 2048์๋ ์ถฉ๋ถํ ํฌ๊ธฐ์ด๋ค.
๋จ์ํ ๊ฒ์ํ์ด๋ ์ผ๋ฐ์ ์ธ ์ปค๋ฎค๋ํฐ์์๋ 2048์(2KB ์ ๋)๋ฉด ์ถฉ๋ถํ์ง๋ง ๋ง์ฝ์ ๊ธด ๊ฒ์๊ธ์ด๋ ๊ธฐ์ฌ ํ์์ ๊ธ์ ๋ค๋ฃจ๊ฑฐ๋, ๋ฉํฐ๋ฏธ๋์ด ํฌํจ์ ๊ณ ๋ คํ๋ ๊ฒฝ์ฐ TEXT๋ MEDIUMTEXT๋ก ์ค์ ํ๋ ๊ฒ์ด ์ข๋ค.
`bbsAvailable`์ ๊ฒ์๊ธ์ ์ญ์ ์ฌ๋ถ๋ฅผ ๋ํ๋ด๋ ์ปฌ๋ผ์ด๋ค.
`bbsAvailable = 1 (๋๋ TRUE)` ๊ฒ์๊ธ์ด ์ญ์ ๋์ง ์์ ์ํ๋ก, ์ฌ์ฉ์๋ค์ด ๊ฒ์๊ธ์ ๋ณผ ์ ์๊ณ , ์ ์์ ์ผ๋ก ๊ฒ์๊ธ์ด ํ์ฑํ๋ ์ํ
`bbsAvailable = 0 (๋๋ FALSE)` ๊ฒ์๊ธ์ด ์ญ์ ๋ ์ํ๋ก, ๊ฒ์๊ธ์ด ์ญ์ ๋ ๊ฒ์ฒ๋ผ ์ทจ๊ธ๋์ด ์ฌ์ฉ์์๊ฒ ๋ณด์ด์ง ์๊ฑฐ๋, ๋ ์ด์ ์ ๊ทผํ ์ ์๋ ์ํ
์ด๋ฌํ ๋ฐฉ์์ผ๋ก ์ฌ์ฉํ๋ฉด, ์ค์ ๋ก ๊ฒ์๊ธ์ ๋ฌผ๋ฆฌ์ ์ผ๋ก ์์ ํ ์ญ์ ํ์ง ์๊ณ , ๋จ์ํ ๋นํ์ฑํํ์ฌ ๋์ค์ ๋ณต๊ตฌํ ์ ์๋๋ก ํ ์ ์๋ค.
`show tables;` ๋ช ๋ น์ด์ `explain ํ ์ด๋ธ๋ช `์ผ๋ก ํ์ฌ ํ ์ด๋ธ ๋ณด๊ธฐ
ํ ์ด๋ธ์ ์์ฑํ์ผ๋ฉด ์ดํด๋ฆฝ์ค๋ก ๋์๊ฐ์ ํ๋ก์ ํธ์ ์๋ฐ ์์คํ์ผ(`src`) > `New` > `Package`
3. ๊ฒ์ํ(BBS)์ ๋ฐ์ดํฐ๋ฅผ ๋ํ๋ด๋ ์๋ฐ๋น ๋ง๋ค๊ธฐ
์์ฑ๋ ํจํค์ง ์์ ๊ฒ์ํ(BBS)์ ๋ฐ์ดํฐ๋ฅผ ๋ํ๋ด๋ Java ํด๋์ค `Bbs.java` (์๋ฐ ๋น์ฆ) ๋ง๋ค๊ธฐ
ํด๋์ค ์ด๋ฆ ๋งจ ์๊ธ์๋ ๋๋ฌธ์๋ก ํด ์ค.
์๋ฐ ๋น์ฆ๋ ํ๋์ ๊ฒ์๊ธ ์ ๋ณด๋ฅผ ๋ด์ ์ ์๋ ์ธ์คํด์ค๋ฅผ ๋ง๋ค๊ธฐ ์ํ ํ
์ฌ์ค์ ๋ฐ์ดํฐ๋ฒ ์ด์ค์ ํ ์ด๋ธ๊ณผ ํก์ฌํ ๊ตฌ์กฐ๋ฅผ ๊ฐ์ง์ผ๋ก์ ์ ๋ฐ์ ์ธ ๊ฒ์๊ธ ํ๋๋ฅผ ๊ด๋ฆฌํด์ฃผ๋ ์๋ฐ์ ํ๋ก๊ทธ๋จ
์์์ DB์ ์์ฑํ BBS ํ ์ด๋ธ๊ณผ ์ปฌ๋ผ๋ช ์ผ์นํ๋๋ก ๋ง๋ ๋ค.
๊ฒ์ํ ์์คํ ์์ ๊ฒ์๊ธ ์ ๋ณด๋ฅผ ์ ์ฅํ๊ณ ๊ด๋ฆฌํ๋ ์ฉ๋๋ก ์ฌ์ฉ๋๊ณ ๊ฐ ๋ณ์๋ ๊ฒ์๊ธ์ ๋ํ ์์ฑ์ ์ ์ํ ๊ฒ์ด๋ค.
์ฆ, ์์์ ๋งํ ๊ฒ์ฒ๋ผ ์๋ฐ๋น์ ๊ฒ์๊ธ์ ํ๋์ ๊ฐ์ฒด๋ก ๋ค๋ฃฐ ์ ์๋๋ก ๋ง๋ ๋ฐ์ดํฐ ๊ตฌ์กฐ์ด๊ณ ๊ฒ์ํ ์์คํ ์์ ๊ฒ์๊ธ CRUD (์์ฑ, ์กฐํ, ์์ , ์ญ์ ) ์์ ์ ํ ๋ ์ฌ์ฉ๋๋ค.
์๋ ๋น ๊ณต๊ฐ์ ๋ง์ฐ์ค ์ฐํด๋ฆญ > Source > Generate Getters and Setters > Select All > Generate
`Bbs.java` ์ ์ฒด ์์ค
package bbs;
public class Bbs {
private int bbsID;
private String bbsTitle;
private String userID;
private String bbsDate;
private String bbsContent;
private int bbsAvailable;
public int getBbsID() {
return bbsID;
}
public void setBbsID(int bbsID) {
this.bbsID = bbsID;
}
public String getBbsTitle() {
return bbsTitle;
}
public void setBbsTitle(String bbsTitle) {
this.bbsTitle = bbsTitle;
}
public String getUserID() {
return userID;
}
public void setUserID(String userID) {
this.userID = userID;
}
public String getBbsDate() {
return bbsDate;
}
public void setBbsDate(String bbsDate) {
this.bbsDate = bbsDate;
}
public String getBbsContent() {
return bbsContent;
}
public void setBbsContent(String bbsContent) {
this.bbsContent = bbsContent;
}
public int getBbsAvailable() {
return bbsAvailable;
}
public void setBbsAvailable(int bbsAvailable) {
this.bbsAvailable = bbsAvailable;
}
}