node.js으로 crud 만들기 -3

이번에는 앞에까지 만들어온 앱에 글쓰기 form ui를 만들고
전송하기
그리고 전송을 받아올 페이지 url를 만들어본다.

일단은 앱의 안에 create link를 만들어 주고
link를 클릭하면 /create라는 페이지로 가서 ui 안에
글쓰기를 할 수 있도록 만들어준다.

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="http://localhost:3000/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);
      });

submit을 누르고 network를 보면 404오류를 내며 전송실패 한 것을 알 수 있다. 이제는 이 요청을 받아올 "http://localhost:3000/create_process" 를 만들어야 한다.

 var qs = require("querystring");
 
 
 else if (pathname === "/create_process") {
    var body = "";
    request.on("data", function (data) {
      body = body + data;
    });
    request.on("end", function () {
      var post = qs.parse(body);
      console.log(post);
      var title = post.title;
      var description = post.description;
    });
    response.writeHead(200);
    response.end("success");

위에 있는 request의 메서드는 createserver의 매개변수로 들어간
request에서 온 것이다. body에 데이터를 담아주고
전송이 다 끝나면 query에 담아주도록 하는 내용이다.
아직 이 전송된 데이터에 대한 처리를 어떻게 처리할 것인지 나타내는 부분은 없다. 그렇게 전송된 데이터를 파일에 저장해주는 부분이 필요하다.

fs.writeFile(`data/${title}`, description, function (err) {
        response.writeHead(302, { location: `/?id= ${title}` });
        response.end();

이렇게 해주면 파일에 생성된 제목이름으로 파일이 생성되고
302번으로 응답되면서 페이지까지 리다이렉션 되는 것을 할 수 있다.