app_file.js
//app_file.js
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var fs = require('fs');
app.locals.pretty=true;
app.set('views','./views_file');
app.set('view engine','jade');
app.use(bodyParser.urlencoded({extended:false}));
//글 작성 form
app.get('/topic/new',function(req,res){
fs.readdir('data',function(err,files){
if(err){
console.log(err);
res.status(500).send('Internal Server Error');
}
res.render('new',{topics:files});
});
});
// 글 목록 보여주기(view.jade 랜더링) => 파일 명을 보내서 for문을 돌림 + 상세조회 (중복성 제거)
app.get(['/topic','/topic/:id'],function(req,res){
var id = req.params.id;
fs.readdir('data',function(err,files){
if(err){
console.log(err);
res.status(500).send('Internal Server Error');
}
if(id){
//id값이 있을 때 글 상세조회
fs.readFile('data/'+id,'utf-8',function(err,data){
if(err){
console.log(err);
res.status(500).send('Internal Server Error');
}
//view.jade에 파일명 보내기
res.render('view',{topics:files,title:id,description:data});
});
}else{
//id 값 없을 때 view에 파일들을 보내주자. li로 만들어질 동적 생성
//description 과 title은 view.jade에서 아무것도 없이 전송되기때문에 그냥 deafult값으로 전달
res.render('view',{topics:files,title:'Welcome',description:'Hello Javascript for server'});
}
});
});
//글 작성 하고 저장
app.post('/topic',function(req,res){
var title = req.body.title;
var description = req.body.description;
fs.writeFile('data/'+title,description,function(err){
if(err){
console.log(err);
res.status(500).send('Internal Server Error');
}
res.redirect('/topic/'+title);
});
});
app.listen(3000,function(){
console.log("Connected, 3000 port!");
});
view.jade
doctype html
html
head
meta(charset='utf-8')
body
h1
a(href='/topic') Server Side JavaScript
ul
each topic in topics
li
a(href='/topic/'+topic)=topic
article
h2= title
= description
div
a(href='/topic/new') new
new.jade
doctype html
html
head
meta(charset='utf-8')
body
h1
a(href='/topic') Server Side JavaScript
ul
each topic in topics
li
a(href='/topic/'+topic)=topic
article
form(action='/topic' method='post')
p
input(type='text' name='title' placeholder='title')
p
textarea(name='description')
p
input(type='submit')
data 디렉토리(입력한 글을 파일로 저장함)
결과
localhost:3000/topic(메인페이지 글 목록)
localhost:3000/topic/new(새로운 글 작성페이지)
localhost:3000/topic/Spring(글 상세 조회)