login.jsp 복사해서 main.jsp 만들기
<body>
<%
//세션의 userID가 있으면 가져온다.
String userID = null; //유저ID가 null이 아니면 가져오기
if (session.getAttribute("userID") != null) {
userID = (String) session.getAttribute("userID");
}
%>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="login.jsp">JSP 게시판</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-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 active"><a class="nav-link" href="main.jsp">메인</a>
</li>
<li class="nav-item"><a class="nav-link" href="#">게시판</a></li>
</ul>
<!-- 오른쪽 메뉴 리스트 -->
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<span class="nav-link">안녕하세요${userID}님</span>
</li>
<li class="nav-item dropdown"><a
class="nav-link dropdown-toggle" href="#" id="Dropdown"
role="button" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false"> 접속하기 </a>
<div class="dropdown-menu" aria-labelledby="Dropdown">
<%
//userID가 없는 사람은 로그인과 가입하기만 보여주고 ID가 있는 사람은 로그아웃만
if (userID == null) {
%>
<a class="dropdown-item active" href="login.jsp">로그인</a>
<a class="dropdown-item" href="join.jsp">가입하기</a>
<%
} else if(userID != null){
%>
<a class="dropdown-item" href="logoutAction.jsp">로그아웃</a>
<%
}
%>
</div></li>
</ul>
</div>
</nav>nav에 만약 userID를 불러오고 만약 NULL이면 가입하기, 로그인만 보여주고, 아니면 로그아웃 보여주기
1. 로그인 전
2. 로그인 후
<!-- 오른쪽 메뉴 리스트 -->
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<span class="nav-link">안녕하세요${userID}님</span>
</li>
캐로셀
<style>
.c-item {
height: 480px;
}
.c-img {
height: 100%;
object-fit: cover;
filter: brightness(0.6);
/* filter : 밝기 조절 1 기본밝기 작아질수록 어두워짐 */
}
</style> <!-- 캐로셀 -->
<div class="container">
<div id="myCaro" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#myCaro" data-slide-to="0" class="active"></li>
<li data-target="#myCaro" data-slide-to="1"></li>
<li data-target="#myCaro" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active c-item">
<img src="images/1.jpg" class="d-block w-100 c-img" alt="...">
</div>
<div class="carousel-item c-item">
<img src="images/2.jpg" class="d-block w-100 c-img" alt="...">
</div>
<div class="carousel-item c-item">
<img src="images/3.jpg" class="d-block w-100 c-img" alt="...">
</div>
</div>
<button class="carousel-control-prev" type="button"
data-target="#myCaro" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</button>
<button class="carousel-control-next" type="button"
data-target="#myCaro" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</button>
</div>
</div>
bbs.jsp 생성
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<style>
.c-item {
height: 480px;
}
.c-img {
height: 100%;
object-fit: cover;
filter: brightness(0.6);
/* filter : 밝기 조절 1 기본밝기 작아질수록 어두워짐 */
}
</style>
<title>로그인 페이지</title>
</head>
<body>
<%
//세션의 userID가 있으면 가져온다.
String userID = null; //유저ID가 null이 아니면 가져오기
if (session.getAttribute("userID") != null) {
userID = (String) session.getAttribute("userID");
}
%>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="main.jsp">JSP 게시판</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-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 active"><a class="nav-link" href="main.jsp">메인</a>
</li>
<li class="nav-item"><a class="nav-link" href="bbs.jsp">게시판</a></li>
</ul>
<!-- 오른쪽 메뉴 리스트 -->
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<span class="nav-link">안녕하세요${userID}님</span>
</li>
<li class="nav-item dropdown"><a
class="nav-link dropdown-toggle" href="#" id="Dropdown"
role="button" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false"> 접속하기 </a>
<div class="dropdown-menu" aria-labelledby="Dropdown">
<%
//userID가 없는 사람은 로그인과 가입하기만 보여주고 ID가 있는 사람은 로그아웃만
if (userID == null) {
%>
<a class="dropdown-item active" href="login.jsp">로그인</a>
<a class="dropdown-item" href="join.jsp">가입하기</a>
<%
} else if(userID != null){
%>
<a class="dropdown-item" href="logoutAction.jsp">로그아웃</a>
<%
}
%>
</div></li>
</ul>
</div>
</nav>
<!--게시판 화면-->
<div class="container">
<div class="container mt-3">
<div class="row">
<table class="table table-striped">
<thead>
<tr>
<th>번호</th>
<th>제목</th>
<th>작성자</th>
<th>작성일</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>안녕하세요.</td>
<td>홍길동</td>
<td>2021-1-10</td>
</tr>
</tbody>
</table>
</div>
<div class="row justify-content-end">
<a href="#" class="btn btn-primary">글쓰기</a>
</div>
</div>
</div>
<!-- 부트스트랩 제이쿼리,번들 -->
<script src="js/jquery-3.7.1.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>
Java Resources에서 bbs패키지 생성 후 Bbs.java 생성
package bbs;
public class Bbs {
private int bbsID; //게시글ID
private String bbsTitle; //제목
private String userID; //글쓴이ID
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;
}
}
위 내용과 같이 데이터 테이블 생성(bbs)
UserDAO.java 복사해서 BbsDAO.java생성
package bbs;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
public class BbsDAO {
// DB연결 객체들 선언
private Connection conn;
private PreparedStatement pstmt;
private ResultSet rs;
public BbsDAO() {
try {
String dbURL = "jdbc:mysql://localhost:3306/BBS?useSSL=false";
String dbID = "root";
String dbPassword = "1234";
Class.forName("com.mysql.jdbc.Driver");
conn = DriverManager.getConnection(dbURL, dbID, dbPassword);
//System.out.println("db연결완료");
} catch (Exception e) {
e.printStackTrace();
}
}
//closeAll 메소드(사용한 DB객체들을 닫아줌 )
private void closeAll() {
try {
if (rs != null)
rs.close();
if (pstmt != null)
pstmt.close();
if (conn != null)
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
//현재 날짜를 DB에서 검색해 리턴
public String getDate() {
String SQL = "select now()";
try {
PreparedStatement pstmt = conn.prepareStatement(SQL);
rs = pstmt.executeQuery();
if (rs.next()) {
return rs.getString(1);
}
} catch (Exception e) {
e.printStackTrace();
}
return ""; //데이터베이스 오류
}
// 새 게시판 글을 DB에 입력
public int write(String bbsTitle, String userID, String bbsContent) {
String SQL = "INSERT INTO bbs(bbsTitle,userID,bbsContent,bbsAvailable)"+"values(?,?,?,?)";
try {
pstmt = conn.prepareStatement(SQL);
pstmt.setString(1, bbsTitle);
pstmt.setString(2, userID);
pstmt.setString(3, bbsContent);
pstmt.setInt(4, 1); //사용가능한글
return pstmt.executeUpdate();
} catch (Exception e) {
e.printStackTrace();
} finally {
closeAll();
}
return -1; //데이터베이스 오류
}
}
데이터베이스 bbsID는 AI를 이용해서 자동증가로 해줌 (1부터 자동증가)
bbsDate는 defult값을 now()로 설정해서 현재 날짜가 입력되게끔 한다.
bbsAvailable 로 처음 만들 때 1로 입력이 되도록 함
test하기
실행
bbs.jsp 의 글쓰기 버튼을 누르면 write.jsp 로 이동하도록 수정한다.
<div class="row justify-content-end">
<a href="write.jsp" class="btn btn-primary">글쓰기</a>
</div>
bbs.jsp 복사해서 write.jsp 생성하고 container 부분
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<title>글쓰기 페이지</title>
</head>
<body>
<%
//세션의 userID가 있으면 가져온다.
String userID = null; //유저ID가 null이 아니면 가져오기
if (session.getAttribute("userID") != null) {
userID = (String) session.getAttribute("userID");
}
%>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="main.jsp">JSP 게시판</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-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 active"><a class="nav-link" href="main.jsp">메인</a>
</li>
<li class="nav-item"><a class="nav-link" href="bbs.jsp">게시판</a></li>
</ul>
<!-- 오른쪽 메뉴 리스트 -->
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<span class="nav-link">안녕하세요${userID}님</span>
</li>
<li class="nav-item dropdown"><a
class="nav-link dropdown-toggle" href="#" id="Dropdown"
role="button" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false"> 접속하기 </a>
<div class="dropdown-menu" aria-labelledby="Dropdown">
<%
//userID가 없는 사람은 로그인과 가입하기만 보여주고 ID가 있는 사람은 로그아웃만
if (userID == null) {
%>
<a class="dropdown-item active" href="login.jsp">로그인</a>
<a class="dropdown-item" href="join.jsp">가입하기</a>
<%
} else if(userID != null){
%>
<a class="dropdown-item" href="logoutAction.jsp">로그아웃</a>
<%
}
%>
</div></li>
</ul>
</div>
</nav>
<!--글쓰기 화면-->
<div class="container">
<div class="container">
<div class="row">
<form method="post" action="writeAction.jsp" class="col-12">
<table class="table table-striped" style="text-align: center; border: 1px solid #dddddd">
<thead>
<tr>
<th colspan="2" style="background-color: #eeeeee; text-align: center;">게시판 글쓰기 양식</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" class="form-control" placeholder="글 제목" name="bbsTitle" maxlength="50"></td>
</tr>
<tr>
<td><textarea class="form-control" placeholder="글 내용" name="bbsContent" maxlength="2048" style="height: 350px;"></textarea></td>
</tr>
</tbody>
</table>
<input type="submit" class="btn btn-primary pull-right" value="글쓰기">
</form>
</div>
</div>
</div>
<!-- 부트스트랩 제이쿼리,번들 -->
<script src="js/jquery-3.7.1.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>
wirte.jsp의 글쓰기 버튼 위에
<!-- 유저 아이디 히든으로 숨기고 submit누르면 유저아이디 넘어감 -->
<input type="hidden" name="userID" value="${userID}">
추가 세션에 ID있어서 굳이 추가 안해도 되긴함.
loginAction.jsp 복사해서 writeAction.jsp 생성
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="bbs.BbsDAO"%>
<!-- form으로 부터 전달된 값을 bbs객체의 프로퍼티(필드변수)에 설정
input 태그의 name과 자바빈의 프로퍼티명과 동일한 것에 대응-->
<%
request.setCharacterEncoding("UTF-8");
%>
<jsp:useBean id="bbs" class="bbs.Bbs" scope="page" />
<jsp:setProperty name="bbs" property="*" />
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP 게시판 웹 사이트</title>
</head>
<body>
<%
//이미 세션에 로그인 정보가 있으면 다시 로그인 할 필요가 없음
String userID = null;
if (session.getAttribute("userID") != null) {
userID = (String) session.getAttribute("userID");
}
if (userID == null) {
out.println("<script>");
out.println("alert('로그인을 하세요.')");
out.println("location.href = 'main.jsp'");
out.println("</script>");
}
//제목 또는 내용을 안적었을 경우 글쓰기 페이지로 돌아간다.
if(bbs.getBbsTitle()==null|| bbs.getBbsContent()==null){
out.println("<script>");
out.println("alert('입력되지 않은 내용이 있습니다.')");
out.println("history.back()");//되돌아가기
out.println("</script>");
}
BbsDAO bbsDAO = new BbsDAO();
int result = bbsDAO.write(bbs.getBbsTitle(),bbs.getUserID(),bbs.getBbsContent());
if (result == 1) {
session.setAttribute("userID", bbs.getUserID());//세션에 추가
out.println("<script>");
out.println("location.href = 'bbs.jsp'");
out.println("</script>");
} else {
out.println("<script>");
out.println("alert('글쓰기에 실패했습니다.')");
out.println("history.back()");
out.println("</script>");
}
%>
</body>
</html>
test
만약 공백으로 게시글을 작성하려고 한다면?
작성한 게시글을
게시판에 출력하기
BbsDAO 에 getlistAll메소드 추가
// 페이지 숫자에 맞게 게시글들을 전체 리턴한다.
public ArrayList<Bbs> getListAll() {
String SQL = "SELECT * from bbs";
ArrayList<Bbs> list = new ArrayList<Bbs>();
try {
PreparedStatement pstmt = conn.prepareStatement(SQL);
rs = pstmt.executeQuery();
while (rs.next()) {
Bbs bbs = new Bbs();
bbs.setBbsID(rs.getInt(1));
bbs.setBbsTitle(rs.getString(2));
bbs.setUserID(rs.getString(3));
bbs.setBbsDate(rs.getString(4));
bbs.setBbsContent(rs.getString(5));
bbs.setBbsAvailable(rs.getInt(6));
list.add(bbs);
}
} catch (Exception e) {
e.printStackTrace();
} // 페이지 숫자에 맞게 게시글들을 최대10개 리턴한다.
public ArrayList<Bbs> getList() {
String SQL = "SELECT * from bbs";
ArrayList<Bbs> list = new ArrayList<Bbs>();
try {
PreparedStatement pstmt = conn.prepareStatement(SQL);
rs = pstmt.executeQuery();
while (rs.next()) {
Bbs bbs = new Bbs();
bbs.setBbsID(rs.getInt(1));
bbs.setBbsTitle(rs.getString(2));
bbs.setUserID(rs.getString(3));
bbs.setBbsDate(rs.getString(4));
bbs.setBbsContent(rs.getString(5));
bbs.setBbsAvailable(rs.getInt(6));
list.add(bbs);
}
} catch (Exception e) {
e.printStackTrace();
} finally {
closeAll();
}
return list; //데이터베이스 오류
}
bbs.jsp
tbody 태그 수정
list만큼 반복문으로 해당 리스트의 내용들 불러오기
<tbody>
<%
BbsDAO bbsDAO = new BbsDAO();
ArrayList<Bbs> list = bbsDAO.getListAll();
for (int i = 0; i < list.size(); i++) {
%>
<tr>
<td><%=list.get(i).getBbsID()%></td>
<td><%=list.get(i).getBbsTitle()%></td>
<td><%=list.get(i).getUserID()%></td>
<td><%=list.get(i).getBbsDate().substring(0, 19)%></td>
</tr>
<%
}
%>
</tbody>
test
'BACKEND > Jsp' 카테고리의 다른 글
| 게시판 만들기 5 -수정하기 /삭제하기 (0) | 2023.10.13 |
|---|---|
| 게시판 만들기 4 -페이징, 게시글 상세보기 (0) | 2023.10.12 |
| 게시판 만들기 2 - 회원가입 , 로그아웃 (0) | 2023.10.10 |
| 게시판 만들기-1( db연결확인 ~ 로그인 ) (0) | 2023.10.10 |
| 북마켓 프로젝트 10 (0) | 2023.09.27 |