본문 바로가기
IT/Nodejs

Node.js express (게시판 기본구조)

by DOSGamer 2019. 10. 17.
반응형

가장 기본이 되는 게시판을 만들면 아래와 같이 프로세스 처리와 화면 분기를 시켜주는 js 파일과

UI 영역을 담당하는 ejs 파일로 구분된다

 

 

//main.js
var express = require("express");
var ejs = require("ejs");

var app = express();

app.set("views", __dirname + "/views");
app.set("view engine", "ejs");
app.engine("ejs", ejs.renderFile);

app.use(express.static("public"));

var controller1 = require("./router/root")(app);
var controller2 = require("./router/bbs")(app);

var server = app.listen(3000, function(){
	console.log("server starting");
});

POST 로 넘어오는 값의 처리를 위해서 body-parser 모듈을 사용하고

app.post 로 값을 받아서 처리한다

//router/bbs.js
let bodyParser = require("body-parser");
var urlencodedParser = bodyParser.urlencoded({extended : false});

module.exports = function(app){
	app.get("/bbs/view", function(req, res){
		let req_data = {
			id : req.query.id,
			page : req.query.page
		};
		res.render("bbsview.ejs", req_data);
	});
	
	app.get("/bbs/write", function(req, res){
		res.render("bbswrite.ejs");
	});

	app.post("/bbs/writeprocess", urlencodedParser, function(req, res){
		let req_data = {
			id : req.body.id,
			title : req.body.title,
			contents : req.body.contents
		};
		res.render("writeok.ejs", req_data);
	});

	app.get("/bbs/writeprocess", function(req, res){
		let req_data = {
			id : req.query.id,
			title : req.query.title,
			contents : req.query.contents
		};
		res.render("writeok.ejs", req_data);
	});

	app.get("/bbs/list", function(req, res){
		res.send("BBS LIST");
	});
};

 

//router/root.js
module.exports = function(app){
	let html = "index.ejs";
	app.get("/", function(req, res){
		res.render(html);
	});
};

등록화면에서 값전달 방법은 POST 를 사용한다

//views/bbswrite.ejs
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>BBS Write</title>
</head>
<body>
    <form action="writeprocess" method="post">
        <p>ID : <input type="text" name="id"/></p>
        <p>TITLE : <input type="text" name="title"/></p>
        <p>CONTENTS : <input type="text" name="contents"/></p>
        <p><button type="submit">등록</button></p>
    </form>
</body>
</html>

 

 

반응형