Mukho

Load css in board

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