반응형

2020.08.17

게시판 디자인을 위한 bbs.jsp입니다. 게시판이 메인화면이기에 게시판에 active 활성화를 넣어주고 테이블 형태의 디자인까지 구현한 상태입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
 
<%@ 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.min.css">
 
<title>프로젝트 JSP 게시판 웹사이트</title>
 
</head>
 
<body>
    <!-- 로그인 된 사람은 로그인 정보를 담을 수 있게 만들어줌 -->
    <%
        String userID = null; //그렇지 않으면 null값
    if (session.getAttribute("userID") != null) {
        userID = (String) session.getAttribute("userID");
    }
    %>
 
    <!-- 네비게이션  -->
 
    <nav class="navbar navbar-default">
 
        <div class="navbar-header">
 
            <button type="button" class="navbar-toggle collapsed"
                data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
                aria-expaned="false">
 
                <span class="icon-bar"></span> <span class="icon-bar"></span> <span
                    class="icon-bar"></span>
 
            </button>
 
            <a class="navbar-brand" href="main.jsp">kobalja의 게시판</a>
 
        </div>
 
        <div class="collapse navbar-collapse"
            id="#bs-example-navbar-collapse-1">
 
            <ul class="nav navbar-nav">
 
                <li class="active"><a href="main.jsp">메인</a></li>
                <!-- <--- 현재 접속 페이지가 메인이란 걸 알려줌 -->
 
                <li class="active"><a href="bbs.jsp">게시판</a></li>
 
            </ul>
            <%
                if (userID == null) {
            %>
            <ul class="nav navbar-nav navbar-right">
 
                <li class="dropdown"><a href="#" class="dropdown-toggle"
                    data-toggle="dropdown" role="button" aria-haspopup="true"
                    aria-expanded="false">접속하기<span class="caret"></span></a>
 
                    <ul class="dropdown-menu">
 
                        <li><a href="login.jsp">로그인</a></li>
                        <li><a href="join.jsp">회원가입</a></li>
 
                    </ul></li>
            </ul>
            <%
                } else {
            %>
            <ul class="nav navbar-nav navbar-right">
 
                <li class="dropdown"><a href="#" class="dropdown-toggle"
                    data-toggle="dropdown" role="button" aria-haspopup="true"
                    aria-expanded="false">회원관리<span class="caret"></span></a>
 
                    <ul class="dropdown-menu">
                        <li><a href="logoutAction.jsp">로그아웃</a></li>
                    </ul></li>
            </ul>
            <%
                }
            %>
        </div>
 
    </nav>
    <!-- 게시판 화면 -->
    <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-allign: center;">번호</th>
                        <th style="background-color: #eeeeee; text-allign: center;">제목</th>
                        <th style="background-color: #eeeeee; text-allign: center;">작성자</th>
                        <th style="background-color: #eeeeee; text-allign: center;">작성일</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>1</td>
                        <td>안녕하세요</td>
                        <td>고한솔</td>
                        <td>2020-08-17</td>
                    </tr>
                </tbody>
            </table>
            <a href="write.jsp" class="btn btn-primary pull-right">글쓰기</a>
        </div>
    </div>
 
 
    <!-- 애니매이션 담당 JQUERY -->
 
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
 
    <!-- 부트스트랩 JS  -->
 
    <script src="js/bootstrap.js"></script>
 
 
 
</body>
 
</html>
 
cs

2020.08.27 완성

로그인을 해야 글쓰기 화면으로 넘어갈 수 있게 추가하였음

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
 
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.io.PrintWriter"%>
<%@ page import="bbs.BbsDAO"%>
<%@ page import="bbs.Bbs"%>
<%@ page import="java.util.ArrayList"%>
<!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.min.css">
<link rel="stylesheet" href="css/custom.css">
<title>프로젝트 JSP 게시판 웹사이트</title>
<style type="text/css">
a, a:hover {
    color: #000000;
    text-decoration: none;
}
</style>
</head>
 
<body>
    <!-- 로그인 된 사람은 로그인 정보를 담을 수 있게 만들어줌 -->
    <%
        String userID = null; //그렇지 않으면 null값
    if (session.getAttribute("userID") != null) {
        userID = (String) session.getAttribute("userID");
 
    }
    //파라미터로 pageNumber가 넘어왔다면 pageNumber에는 해당 파라미터의 값을 넣어줄  있또록 한다. 
    int pageNumber = 1; //기본 페이지를 의미한다.
    if (request.getParameter("pageNumber") != null) {
        pageNumber = Integer.parseInt(request.getParameter("pageNumber"));
    }
    %>
 
    <!-- 네비게이션  -->
 
    <nav class="navbar navbar-default">
 
        <div class="navbar-header">
 
            <button type="button" class="navbar-toggle collapsed"
                data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
                aria-expaned="false">
 
                <span class="icon-bar"></span> <span class="icon-bar"></span> <span
                    class="icon-bar"></span>
 
            </button>
 
            <a class="navbar-brand" href="main.jsp">kobalja의 게시판</a>
 
        </div>
 
        <div class="collapse navbar-collapse"
            id="#bs-example-navbar-collapse-1">
 
            <ul class="nav navbar-nav">
 
                <li><a href="main.jsp">메인</a></li>
                <!-- <--- 현재 접속 페이지가 메인이란 걸 알려줌 -->
 
                <li class="active"><a href="bbs.jsp">게시판</a></li>
 
            </ul>
            <%
                if (userID == null) {
            %>
            <ul class="nav navbar-nav navbar-right">
 
                <li class="dropdown"><a href="#" class="dropdown-toggle"
                    data-toggle="dropdown" role="button" aria-haspopup="true"
                    aria-expanded="false">접속하기<span class="caret"></span></a>
 
                    <ul class="dropdown-menu">
 
                        <li><a href="login.jsp">로그인</a></li>
                        <li><a href="join.jsp">회원가입</a></li>
 
                    </ul></li>
            </ul>
            <%
                } else {
            %>
            <ul class="nav navbar-nav navbar-right">
 
                <li class="dropdown"><a href="#" class="dropdown-toggle"
                    data-toggle="dropdown" role="button" aria-haspopup="true"
                    aria-expanded="false">회원관리<span class="caret"></span></a>
 
                    <ul class="dropdown-menu">
                        <li><a href="logoutAction.jsp">로그아웃</a></li>
                    </ul></li>
            </ul>
            <%
                }
            %>
        </div>
 
    </nav>
    <!-- 게시판 화면 -->
    <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: #b7b7ff; text-align: center;">번호</th>
                        <th style="background-color: #b7b7ff; text-align: center;">제목</th>
                        <th style="background-color: #b7b7ff; text-align: center;">작성자</th>
                        <th style="background-color: #b7b7ff; text-align: center;">작성일</th>
                    </tr>
                </thead>
                <tbody>
                    <%
                        BbsDAO bbsDAO = new BbsDAO();
                    ArrayList<Bbs> list = bbsDAO.getList(pageNumber);
                    for (int i = 0; i < list.size(); i++) {
                    %>
 
                    <tr>
                        <td><%=list.get(i).getBbsID()%></td>
                        <td><a href="view.jsp?bbsID=<%=list.get(i).getBbsID()%>"><%=list.get(i).getBbsTitle().replaceAll(" ", "&nbsp").replaceAll("<", "&lt").replaceAll(">", "&gt")
        .replaceAll("\n", "<br>")%></a></td>
                        <td><%=list.get(i).getUserID()%></td>
                        <td><%=list.get(i).getBbsDate().substring(0, 11) + list.get(i).getBbsDate().substring(11, 13) + "시"
        + list.get(i).getBbsDate().substring(14, 16) + "분"%></td>
 
                    </tr>
                    <%
                        }
                    %>
                </tbody>
            </table>
            <%
                if (pageNumber != 1) {
            %>
            <a href="bbs.jsp?pageNumber=<%=pageNumber - 1%>"
                class="btn btn-success btn-arraw-left">이전</a>
            <%
                }
            if (bbsDAO.nextPage(pageNumber + 1)) {
            %>
            <a href="bbs.jsp?pageNumber=<%=pageNumber + 1%>"
                class="btn btn-success btn=arraw-left">다음</a>
            <%
                }
            %>
            <!-- 회원만넘어가도록 -->
 
            <%
                //if logined userID라는 변수에 해당 아이디가 담기고 if not null
 
            if (session.getAttribute("userID") != null) {
            %>
            <a href="write.jsp" class="btn btn-primary pull-right">글쓰기</a>
 
            <%
                } else {
            %>
            <button class="btn btn-primary pull-right"
                onclick="if(confirm('로그인이 필요합니다.'))location.href='login.jsp';"
                type="button">글쓰기</button>
            <%
                }
            %>
        </div>
    </div>
 
 
    <!-- 애니매이션 담당 JQUERY -->
 
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
 
    <!-- 부트스트랩 JS  -->
 
    <script src="js/bootstrap.js"></script>
 
 
 
</body>
 
</html>
 
cs
반응형
  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기