Mukho

Load css in board

...@@ -327,6 +327,8 @@ th { ...@@ -327,6 +327,8 @@ th {
327 border-color: inherit; 327 border-color: inherit;
328 border-style: solid; 328 border-style: solid;
329 border-width: 0; 329 border-width: 0;
330 + border: 1px solid #444444;
331 + padding: 2px;
330 } 332 }
331 333
332 label { 334 label {
...@@ -1969,8 +1971,10 @@ progress { ...@@ -1969,8 +1971,10 @@ progress {
1969 margin-bottom: 1rem; 1971 margin-bottom: 1rem;
1970 color: #212529; 1972 color: #212529;
1971 vertical-align: top; 1973 vertical-align: top;
1974 + border: 1px solid #444444;
1972 border-color: #dee2e6; 1975 border-color: #dee2e6;
1973 } 1976 }
1977 +
1974 .table > :not(caption) > * > * { 1978 .table > :not(caption) > * > * {
1975 padding: 0.5rem 0.5rem; 1979 padding: 0.5rem 0.5rem;
1976 background-color: var(--bs-table-bg); 1980 background-color: var(--bs-table-bg);
......
...@@ -16,7 +16,17 @@ ...@@ -16,7 +16,17 @@
16 <link href="../css/styles.css" rel="stylesheet" /> 16 <link href="../css/styles.css" rel="stylesheet" />
17 </head> 17 </head>
18 <body> 18 <body>
19 - 19 + <!-- Navigation-->
20 + <nav class="navbar navbar-light bg-light static-top">
21 + <div class="container">
22 + <a class="navbar-brand" href="/main">묵호의 놀이터</a>
23 + <div class="user">
24 + <a class="btn btn-primary" href="/login">로그인</a>
25 + <a class="btn btn-primary" href="/register">회원가입</a>
26 + </div>
27 + </div>
28 + </nav>
29 +
20 </body> 30 </body>
21 31
22 </html> 32 </html>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -42,8 +42,6 @@ DB구조 - board에서 사용됨(*idx, name, title, content, regdate, modidate, ...@@ -42,8 +42,6 @@ DB구조 - board에서 사용됨(*idx, name, title, content, regdate, modidate,
42 LF 오류시 git config --global core.autocrlf true 입력<br><br> 42 LF 오류시 git config --global core.autocrlf true 입력<br><br>
43 43
44 44
45 -최종 수정: 2021-11-17 06:01<br> 45 +최종 수정: 2021-11-18 13:17<br>
46 -최종 수정 내용: 게시판의 글쓰기 및 글 열람 기능 추가. 46 +최종 수정 내용: 게시판에 기본 서식 추가, 로그인시에만 게시판 관련 경로에 접근가능하게 함
47 -최종 수정: 2021-11-17 14:25<br> 47 +수정 내용: 경로 지정 수정, 제목 추가, userDB, 회원가입에 nickname요소 추가, 세션에 ID + 닉네임 전달기능 추가, 게시판의 글쓰기 및 글 열람 기능 추가.
48 -최종 수정 내용: 세션에 ID + 닉네임 전달기능 추가
49 -수정 내용: 경로 지정 수정, 제목 추가, userDB, 회원가입에 nickname요소 추가
......
1 +const e = require('express');
1 var express = require('express'); 2 var express = require('express');
2 const { connect } = require('http2'); 3 const { connect } = require('http2');
3 var router = express.Router(); 4 var router = express.Router();
...@@ -8,25 +9,37 @@ var board = mysql_odbc.init(); ...@@ -8,25 +9,37 @@ var board = mysql_odbc.init();
8 9
9 10
10 router.get('/list/:page', function(req, res, next) { 11 router.get('/list/:page', function(req, res, next) {
11 - var page = req.params.page; 12 + var id = req.user;
12 - var sql = "select idx, name, title, date_format(modidate,'%Y-%m-%d %H:%i:%s') modidate, " + 13 + if(!id) res.redirect('/board/list')
13 - "date_format(regdate,'%Y-%m-%d %H:%i:%s') regdate from board"; 14 + else{
14 - 15 + var page = req.params.page;
15 - board.query(sql, function(err,rows) { 16 + var sql = "select idx, name, title, date_format(modidate,'%Y-%m-%d %H:%i:%s') modidate, " +
16 - if (err) console.error("err : " + err); 17 + "date_format(regdate,'%Y-%m-%d %H:%i:%s') regdate from board";
17 - var id = req.user.ID; 18 +
18 - var nickname = req.user.nickname; 19 + board.query(sql, function(err,rows) {
19 - if(!id) nickname = "손님" // 수정 예정 20 + if (err) console.error("err : " + err);
20 - res.render('list.ejs', {'ID':id, 'nickname': nickname, title: '게시판 리스트', rows: rows}) 21 + var id = req.user.ID;
21 - }) 22 + var nickname = req.user.nickname;
23 + if(!id) nickname = "손님" // 수정 예정
24 + res.render('list.ejs', {'ID':id, 'nickname': nickname, title: '게시판 리스트', rows: rows})
25 + })
26 + }
22 }); 27 });
23 28
24 router.get('/list', function(req,res,next){ 29 router.get('/list', function(req,res,next){
25 - res.redirect('/board/list/1') 30 + var id = req.user;
31 + if(!id) res.sendFile(path.join(__dirname, "../../public/login.html"))
32 + else res.redirect('/board/list/1')
26 }) 33 })
27 34
28 router.get('/write', function(req,res,next){ 35 router.get('/write', function(req,res,next){
29 - res.render('write.ejs', {title:"게시판 글 쓰기"}) 36 + var id = req.user;
37 + if(!id) res.sendFile(path.join(__dirname, "../../public/login.html"))
38 + else{
39 + var id = req.user.ID;
40 + var nickname = req.user.nickname;
41 + res.render('write.ejs', {'ID':id, 'nickname': nickname, title:"게시판 글 쓰기"})
42 + }
30 }) 43 })
31 44
32 router.post('/write', function(req,res,next){ 45 router.post('/write', function(req,res,next){
...@@ -49,7 +62,14 @@ router.get('/read/:idx', function(req,res,next){ ...@@ -49,7 +62,14 @@ router.get('/read/:idx', function(req,res,next){
49 "date_format(regdate,'%Y-%m-%d %H:%i:%s') regdate,hit from board where idx=?"; 62 "date_format(regdate,'%Y-%m-%d %H:%i:%s') regdate,hit from board where idx=?";
50 board.query(sql,[idx], function(err,row){ 63 board.query(sql,[idx], function(err,row){
51 if(err) console.error(err) 64 if(err) console.error(err)
52 - res.render('read.ejs', {title:"글 상세", row:row[0]}) 65 +
66 + var id = req.user;
67 + if(!id) res.redirect('/board/list')
68 + else{
69 + var id = req.user.ID;
70 + var nickname = req.user.nickname;
71 + res.render('read.ejs', {'ID':id, 'nickname': nickname, title:"글 상세", row:row[0]})
72 + }
53 }) 73 })
54 }) 74 })
55 75
......
...@@ -5,7 +5,7 @@ var path = require('path') // 상대경로 ...@@ -5,7 +5,7 @@ var path = require('path') // 상대경로
5 5
6 // main page는 login이 된 상태(세션정보가 있을때만) 접근이 가능하게 하자 -> info에 구현해놓음. 6 // main page는 login이 된 상태(세션정보가 있을때만) 접근이 가능하게 하자 -> info에 구현해놓음.
7 router.get('/', function(req, res){ 7 router.get('/', function(req, res){
8 - var id = req.user.ID; 8 + var id = req.user;
9 if(!id) res.sendFile(path.join(__dirname, "../../public/main.html")) 9 if(!id) res.sendFile(path.join(__dirname, "../../public/main.html"))
10 if(id){ 10 if(id){
11 var nickname = req.user.nickname; 11 var nickname = req.user.nickname;
......
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 -<html> 2 +<html leng="en">
3 -<head> 3 + <head>
4 - <title>묵호 - 놀이터</title> 4 + <meta charset="utf-8" />
5 - <!-- Favicon--> 5 + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
6 - <link rel="icon" type="image/x-icon" href="../assets/favicon.ico" /> 6 + <meta name="description" content="" />
7 - <link rel='stylesheet' href='/stylesheets/style.css'/> 7 + <meta name="author" content="" />
8 -</head> 8 + <title>묵호 - 놀이터</title>
9 -<body> 9 + <!-- Favicon-->
10 - <!-- Navigation--> 10 + <link rel="icon" type="image/x-icon" href="../assets/favicon.ico" />
11 - <nav class="navbar navbar-light bg-light static-top"> 11 + <!-- Bootstrap icons-->
12 - <div class="container"> 12 + <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
13 - <a class="navbar-brand" href="/main">묵호의 놀이터</a> 13 + <!-- Google fonts-->
14 - <div class="user"> 14 + <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
15 - <a> <%= nickname %> 님 안녕하세요 </section></a> 15 + <!-- Core theme CSS (includes Bootstrap)-->
16 - <a class="btn btn-primary" href="/logout">로그아웃</a> 16 + <link href="/css/styles.css?after" rel="stylesheet" />
17 + </head>
18 + <body>
19 + <!-- Navigation-->
20 + <nav class="navbar navbar-light bg-light static-top">
21 + <div class="container">
22 + <a class="navbar-brand" href="/main">묵호의 놀이터</a>
23 + <div class="user">
24 + <a> <%= nickname %> 님 안녕하세요 </section></a>
25 + <a class="btn btn-primary" href="/logout">로그아웃</a>
26 + </div>
17 </div> 27 </div>
28 + </nav>
29 + <div class="container px-5 my-5">
30 + <h1><%= title %></h1>
31 + <a href="/board/write">글쓰기</a>
32 + <table border="1">
33 + <tr>
34 + <td>번호</td>
35 + <td>작성자</td>
36 + <td>제목</td>
37 + <td>조회수</td>
38 + <td>수정일</td>
39 + <td>등록일</td>
40 + </tr>
41 + <%
42 + for(var i=0; i<rows.length; i++)
43 + {
44 + var data = rows[i];
45 + %>
46 + <tr>
47 + <td><%=data.idx%></td>
48 + <td><%=data.name%></td>
49 + <td><a href="/board/read/<%=data.idx%>"><%=data.title%></a></td>
50 + <td><%=data.hit%></td>
51 + <td><%=data.modidate%></td>
52 + <td><%=data.regdate%></td>
53 + </tr>
54 + <%}%>
55 + </table>
18 </div> 56 </div>
19 - </nav> 57 + </body>
20 - <h1><%= title %></h1>
21 - <a href="/board/write">글쓰기</a>
22 - <table border="1">
23 - <tr>
24 - <td>번호</td>
25 - <td>작성자</td>
26 - <td>제목</td>
27 - <td>조회수</td>
28 - <td>수정일</td>
29 - <td>등록일</td>
30 - </tr>
31 - <%
32 - for(var i=0; i<rows.length; i++)
33 - {
34 - var data = rows[i];
35 - %>
36 - <tr>
37 - <td><%=data.idx%></td>
38 - <td><%=data.name%></td>
39 - <td><a href="/board/read/<%=data.idx%>"><%=data.title%></a></td>
40 - <td><%=data.hit%></td>
41 - <td><%=data.modidate%></td>
42 - <td><%=data.regdate%></td>
43 - </tr>
44 - <%}%>
45 - </table>
46 -</body>
47 </html> 58 </html>
48 59
......
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 - <title><%= title %></title> 4 + <title>묵호 - 놀이터</title>
5 - <link rel='stylesheet' href='/stylesheets/style.css'/> 5 + <!-- Favicon-->
6 + <link rel="icon" type="image/x-icon" href="../assets/favicon.ico" />
7 + <!-- Bootstrap icons-->
8 + <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
9 + <!-- Google fonts-->
10 + <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
11 + <!-- Core theme CSS (includes Bootstrap)-->
12 + <link href="/css/styles.css?after" rel="stylesheet" />
13 +
6 </head> 14 </head>
7 <body> 15 <body>
8 -<h1><%= title %></h1> 16 + <!-- Navigation-->
9 - 17 + <nav class="navbar navbar-light bg-light static-top">
10 -<form action="/board/update" method="post"> 18 + <div class="container">
11 - <table border="1"> 19 + <a class="navbar-brand" href="/main">묵호의 놀이터</a>
12 - <input type="hidden" name="idx" value="<%=row.idx%>"/> 20 + <div class="user">
13 - <tr> 21 + <a> <%= nickname %> 님 안녕하세요 </section></a>
14 - <td>작성자</td> 22 + <a class="btn btn-primary" href="/logout">로그아웃</a>
15 - <td><input type="text" name="name" id="name" value="<%=row.name%>" required/></td> 23 + </div>
16 - </tr> 24 + </div>
17 - <tr> 25 + </nav>
18 - <td>제목</td> 26 + <div class="container px-5 my-5">
19 - <td><input type="text" name="title" id="title" value="<%=row.title%>" required/></td> 27 + <h1><%= title %></h1>
20 - </tr>
21 - <tr>
22 - <td>내용</td>
23 - <td><textarea name="content" id="content" cols="30" rows="10" required><%=row.content%></textarea></td>
24 - </tr>
25 - <tr>
26 - <td>패스워드</td>
27 - <td><input type="password" name="passwd" id="passwd" required/></td>
28 - </tr>
29 - <tr>
30 - <td>변경일</td>
31 - <td><%=row.modidate%></td>
32 - </tr>
33 - <tr>
34 - <td>등록일</td>
35 - <td><%=row.regdate%></td>
36 - </tr>
37 - <tr>
38 - <td>조회수</td>
39 - <td><%=row.hit%></td>
40 - </tr>
41 - <tr>
42 - <td colspan="2">
43 - <button type="submit">글 수정</button>
44 - <a href="/board/list">목록</a>
45 - </td>
46 - </tr>
47 - </table>
48 -</form>
49 28
29 + <form action="/board/update" method="post">
30 + <table border="1">
31 + <input type="hidden" name="idx" value="<%=row.idx%>"/>
32 + <tr>
33 + <td>작성자</td>
34 + <td><input type="text" name="name" id="name" value="<%=row.name%>" required/></td>
35 + </tr>
36 + <tr>
37 + <td>제목</td>
38 + <td><input type="text" name="title" id="title" value="<%=row.title%>" required/></td>
39 + </tr>
40 + <tr>
41 + <td>내용</td>
42 + <td><textarea name="content" id="content" cols="30" rows="10" required><%=row.content%></textarea></td>
43 + </tr>
44 + <tr>
45 + <td>패스워드</td>
46 + <td><input type="password" name="passwd" id="passwd" required/></td>
47 + </tr>
48 + <tr>
49 + <td>변경일</td>
50 + <td><%=row.modidate%></td>
51 + </tr>
52 + <tr>
53 + <td>등록일</td>
54 + <td><%=row.regdate%></td>
55 + </tr>
56 + <tr>
57 + <td>조회수</td>
58 + <td><%=row.hit%></td>
59 + </tr>
60 + <tr>
61 + <td colspan="2">
62 + <button type="submit">글 수정</button>
63 + <a href="/board/list">목록</a>
64 + </td>
65 + </tr>
66 + </table>
67 + </form>
68 + </div>
50 </body> 69 </body>
51 </html> 70 </html>
...\ No newline at end of file ...\ No newline at end of file
......
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 - <title><%= title %></title> 4 + <title>묵호 - 놀이터</title>
5 - <link rel='stylesheet' href='/stylesheets/style.css'/> 5 + <!-- Favicon-->
6 + <link rel="icon" type="image/x-icon" href="../assets/favicon.ico" />
7 + <!-- Bootstrap icons-->
8 + <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
9 + <!-- Google fonts-->
10 + <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
11 + <!-- Core theme CSS (includes Bootstrap)-->
12 + <link href="/css/styles.css?after" rel="stylesheet" />
6 </head> 13 </head>
7 <body> 14 <body>
8 -<h1><%= title %></h1> 15 + <!-- Navigation-->
9 - 16 + <nav class="navbar navbar-light bg-light static-top">
10 - 17 + <div class="container">
11 -<form action="/board/write" method="post"> 18 + <a class="navbar-brand" href="/main">묵호의 놀이터</a>
12 - <table border="1"> 19 + <div class="user">
13 - <tr> 20 + <a> <%= nickname %> 님 안녕하세요 </section></a>
14 - <td>작성자</td> 21 + <a class="btn btn-primary" href="/logout">로그아웃</a>
15 - <td><input type="text" name="name" id="name" required/></td> 22 + </div>
16 - </tr> 23 + </div>
17 - <tr> 24 + </nav>
18 - <td>제목</td> 25 + <div class="container px-5 my-5">
19 - <td><input type="text" name="title" id="title" required/></td> 26 + <h1><%= title %></h1>
20 - </tr> 27 + <form action="/board/write" method="post">
21 - <tr> 28 +
22 - <td>내용</td> 29 + <table border="1">
23 - <td><textarea name="content" id="content" cols="30" rows="10" required></textarea></td> 30 + <tr>
24 - </tr> 31 + <td>작성자</td>
25 - <tr> 32 + <td><input type="text" name="name" id="name" required/></td>
26 - <td>패스워드</td> 33 + </tr>
27 - <td><input type="password" name="passwd" id="passwd" required/></td> 34 + <tr>
28 - </tr> 35 + <td>제목</td>
29 - <tr> 36 + <td><input type="text" name="title" id="title" required/></td>
30 - <td colspan="2"> 37 + </tr>
31 - <button type="submit">글쓰기</button> 38 + <tr>
32 - </td> 39 + <td>내용</td>
33 - </tr> 40 + <td><textarea name="content" id="content" cols="30" rows="10" required></textarea></td>
34 - </table> 41 + </tr>
35 -</form> 42 + <tr>
36 - 43 + <td>패스워드</td>
37 - 44 + <td><input type="password" name="passwd" id="passwd" required/></td>
45 + </tr>
46 + <tr>
47 + <td colspan="2">
48 + <button type="submit">글쓰기</button>
49 + </td>
50 + </tr>
51 + </table>
52 + </form>
53 + </div>
38 </body> 54 </body>
39 </html> 55 </html>
...\ No newline at end of file ...\ No newline at end of file
......