수업소개
전송된 수정 내용을 받아서 파일명을 변경하고, 내용을 저장하는 방법을 알아봅니다.
강의
소스코드
main.js (변경사항)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 | var http = require('http');var fs = require('fs');var url = require('url');var qs = require('querystring');function templateHTML(title, list, body, control){ return ` <!doctype html> <html> <head> <title>WEB1 - ${title}</title> <meta charset="utf-8"> </head> <body> <h1><a href="/">WEB</a></h1> ${list} ${control} ${body} </body> </html> `;}function templateList(filelist){ var list = '<ul>'; var i = 0; while(i < filelist.length){ list = list + `<li><a href="/?id=${filelist[i]}">${filelist[i]}</a></li>`; i = i + 1; } list = list+'</ul>'; return list;}var app = http.createServer(function(request,response){ var _url = request.url; var queryData = url.parse(_url, true).query; var pathname = url.parse(_url, true).pathname; if(pathname === '/'){ if(queryData.id === undefined){ fs.readdir('./data', function(error, filelist){ var title = 'Welcome'; var description = 'Hello, Node.js'; var list = templateList(filelist); var template = templateHTML(title, list, `<h2>${title}</h2>${description}`, `<a href="/create">create</a>` ); response.writeHead(200); response.end(template); }); } else { fs.readdir('./data', function(error, filelist){ fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){ var title = queryData.id; var list = templateList(filelist); var template = templateHTML(title, list, `<h2>${title}</h2>${description}`, `<a href="/create">create</a> <a href="/update?id=${title}">update</a>` ); response.writeHead(200); response.end(template); }); }); } } else if(pathname === '/create'){ fs.readdir('./data', function(error, filelist){ var title = 'WEB - create'; var list = templateList(filelist); var template = templateHTML(title, list, ` <form action="/create_process" method="post"> <p><input type="text" name="title" placeholder="title"></p> <p> <textarea name="description" placeholder="description"></textarea> </p> <p> <input type="submit"> </p> </form> `, ''); response.writeHead(200); response.end(template); }); } else if(pathname === '/create_process'){ var body = ''; request.on('data', function(data){ body = body + data; }); request.on('end', function(){ var post = qs.parse(body); var title = post.title; var description = post.description; fs.writeFile(`data/${title}`, description, 'utf8', function(err){ response.writeHead(302, {Location: `/?id=${title}`}); response.end(); }) }); } else if(pathname === '/update'){ fs.readdir('./data', function(error, filelist){ fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){ var title = queryData.id; var list = templateList(filelist); var template = templateHTML(title, list, ` <form action="/update_process" method="post"> <input type="hidden" name="id" value="${title}"> <p><input type="text" name="title" placeholder="title" value="${title}"></p> <p> <textarea name="description" placeholder="description">${description}</textarea> </p> <p> <input type="submit"> </p> </form> `, `<a href="/create">create</a> <a href="/update?id=${title}">update</a>` ); response.writeHead(200); response.end(template); }); }); } else if(pathname === '/update_process'){ var body = ''; request.on('data', function(data){ body = body + data; }); request.on('end', function(){ var post = qs.parse(body); var id = post.id; var title = post.title; var description = post.description; fs.rename(`data/${id}`, `data/${title}`, function(error){ fs.writeFile(`data/${title}`, description, 'utf8', function(err){ response.writeHead(302, {Location: `/?id=${title}`}); response.end(); }) }); }); } else { response.writeHead(404); response.end('Not found'); }});app.listen(3000); |
수업에서 다루지 못한 이야기
pm2를 실행할 때 --watch 옵션을 주면 파일이 변경되었을 때 앱을 리로드하게 됩니다. 즉 data 디렉토리의 파일이 수정되었을 때 리로드가 일어나게 되는 것이죠. 이런 문제를 방지하기 위해서는 data 디렉토리에 대해서는 watch를 하지 않도록 설정해야 합니다. 아래의 방법이 도움이 될 것입니다.
1 2 | pm2 delete mainpm2 start main.js --watch --ignore-watch="data/*" |
