MYSQL을 이용해서 웹애플리케이션 구현
app_mysql.js
var express = require('express');//익스프레스를 가져옴
var bodyParser = require('body-parser')
var fs = require('fs');
var mysql = require('mysql');
var conn = mysql.createConnection({
host : 'localhost',
user : 'root',
password : 'qwer1234',
database : 'o2',
port : 3307
});
conn.connect();//database 접속 완료
var app = express();
var multer = require('multer');//업로드를 위한 multer를 가져옴
var _storage = multer.diskStorage({
destination: function (req, file, cb) {//cb는 callback함수의 약자
//if(파일의 형식이 이미지면)
//이미지 폴더에 저장
//else
//text 폴더에 저장한다 가 가능하게됨
cb(null, 'uploads/')//2번째 인자는 파일이 저장될 인자
},
filename: function (req, file, cb) {//cb는 callback함수의 약자
cb(null, file.originalname)//파일의 이름을 지정함
}
});
var upload = multer({ storage: _storage });
app.use(bodyParser.urlencoded({ extended: false }));//body parser를 사용함
app.locals.pretty = true;//템플릿 줄바꿈
app.set('views', './views_mysql');//템플릿 폴더 위치 표시
app.set('view engine', 'jade');//템플릿 엔진을 jade로 명시함
app.use('/user', express.static('uploads'));//여기로 폴더에 있는 그림을 접근할 수 있음
//업로드 폼을 가져옴
app.get('/upload', function(req, res){
res.render('upload');
});
//실제 업로드를 시키면 post로 옴
//2번째 파라미터는 사용자가 전송한 데이터에서 파일이 포함되면
//req안에 file이라는 프로퍼티를 추가함 미들웨어임
//userfile은 jade에서 input type='file'의 name값
app.post('/upload', upload.single('userfile'), function(req, res){
res.send('Uploaded : '+req.file.filename);
});
//글작성하기 폼
app.get('/topic/new', function(req, res){
fs.readdir('data', function(err, files){//첫번째는 에러 두번째는 파일목록을 전송받음
if(err){//에러가 있다면 여기서 처리
res.status(500).send('Internal Server Error');
}
res.render('new', {topics:files});
});
});
//글목록을 표시 mysql 버전
//[]는 배열을 의미 둘다 여기로 접근 가능하다는 뜻
app.get(['/topic', '/topic/:id'], function(req, res){
console.log('TOPIC');
var sql = 'SELECT id, title FROM topic';//글목록을 보여주기 위한 쿼리문
conn.query(sql, function(err, topics, fields){
res.render('view', {topics:topics});//view.jade파일을 출력함 쿼리문에서 가져온 값을 넘겨줌
});
});
//폼에서 작성한 것을 여기서 받음
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){//에러가 있다면 여기서 처리
res.status(500).send('Internal Server Error');
}
//그 사람이 작성한 페이지로 보내버림
res.redirect('/topic/'+title);//redirect는 바로 그 URL로 이동시키는 것
});//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.id)= topic.title
article
if topic
h2= title
= description
else
h2 Welcome
| This is server side js.
div
a(href='/topic/new') new
실행 화면
다음과 같이 view.jade가 나오면서 글목록이 출력됩니다.
이번에는 글목록을 보여주고 글을 클릭했을때 title 뿐만 아니라 description까지 보여주는 방법을 알아보자
app_mysql.js
var express = require('express');//익스프레스를 가져옴
var bodyParser = require('body-parser')
var fs = require('fs');
var mysql = require('mysql');
var conn = mysql.createConnection({
host : 'localhost',
user : 'root',
password : 'qwer1234',
database : 'o2',
port : 3307
});
conn.connect();//database 접속 완료
var app = express();
var multer = require('multer');//업로드를 위한 multer를 가져옴
var _storage = multer.diskStorage({
destination: function (req, file, cb) {//cb는 callback함수의 약자
//if(파일의 형식이 이미지면)
//이미지 폴더에 저장
//else
//text 폴더에 저장한다 가 가능하게됨
cb(null, 'uploads/')//2번째 인자는 파일이 저장될 인자
},
filename: function (req, file, cb) {//cb는 callback함수의 약자
cb(null, file.originalname)//파일의 이름을 지정함
}
});
var upload = multer({ storage: _storage });
app.use(bodyParser.urlencoded({ extended: false }));//body parser를 사용함
app.locals.pretty = true;//템플릿 줄바꿈
app.set('views', './views_mysql');//템플릿 폴더 위치 표시
app.set('view engine', 'jade');//템플릿 엔진을 jade로 명시함
app.use('/user', express.static('uploads'));//여기로 폴더에 있는 그림을 접근할 수 있음
//업로드 폼을 가져옴
app.get('/upload', function(req, res){
res.render('upload');
});
//실제 업로드를 시키면 post로 옴
//2번째 파라미터는 사용자가 전송한 데이터에서 파일이 포함되면
//req안에 file이라는 프로퍼티를 추가함 미들웨어임
//userfile은 jade에서 input type='file'의 name값
app.post('/upload', upload.single('userfile'), function(req, res){
res.send('Uploaded : '+req.file.filename);
});
//글작성하기 폼
app.get('/topic/new', function(req, res){
fs.readdir('data', function(err, files){//첫번째는 에러 두번째는 파일목록을 전송받음
if(err){//에러가 있다면 여기서 처리
res.status(500).send('Internal Server Error');
}
res.render('new', {topics:files});
});
});
//글목록을 표시 mysql 버전
//[]는 배열을 의미 둘다 여기로 접근 가능하다는 뜻
app.get(['/topic', '/topic/:id'], function(req, res){
var sql = 'SELECT id, title FROM topic';//글목록을 보여주기 위한 쿼리문
conn.query(sql, function(err, topics, fields){
var id = req.params.id;//:id값을 가져옴
if(id){//id가 있으면 상세보기
var sql = 'SELECT * FROM topic WHERE id=?';
conn.query(sql, [id], function(err, topic, fields){
if(err){//데이터베이스 에러가 있다면
console.log(err);
res.status(500).send('Internal Server Error');
}else{
res.render('view', {topics:topics, topic:topic[0]});//topic은 쿼리문의 데이터 한개만 넘겨줌
}
});
}else{//첫화면을 보여줌
res.render('view', {topics:topics});//view.jade파일을 출력함 쿼리문에서 가져온 값을 넘겨줌
}
});
});
//폼에서 작성한 것을 여기서 받음
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){//에러가 있다면 여기서 처리
res.status(500).send('Internal Server Error');
}
//그 사람이 작성한 페이지로 보내버림
res.redirect('/topic/'+title);//redirect는 바로 그 URL로 이동시키는 것
});//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.id)= topic.title
article
if topic
h2= topic.title
= topic.description
div= 'by'+topic.author
else
h2 Welcome
| This is server side js.
div
a(href='/topic/new') new
실행 화면
글목록을 클릭하면
출처 : https://opentutorials.org/course/2136
'프로그래밍 > Node.js' 카테고리의 다른 글
| Node.js 생활코딩 정리 – Cookie를 이용한 장바구니 만들기 (0) | 2016.11.28 |
|---|---|
| Node.js 생활코딩 정리 – HTTP 및 Cookie 구현하기 (0) | 2016.11.28 |
| Node.js 생활코딩 정리 – 세번째 웹애플리케이션 글 삭제 기능 구현 (0) | 2016.11.27 |
| Node.js 생활코딩 정리 – 두번째 웹애플리케이션 글 편집 기능 구현 (0) | 2016.11.27 |
| Node.js 생활코딩 정리 – node-mysql 사용하기 (0) | 2016.11.27 |
| Node.js 생활코딩 정리 – MYSQL 데이터베이스 사용법 (0) | 2016.11.27 |
| Node.js 생활코딩 정리 - 파일업로드 준비 (2) | 2016.11.27 |
| Node.js 생활코딩 정리 - 웹앱 제작 코드 개선하기 (0) | 2016.11.27 |