Javascript/Node.js

코드를 정리정돈 해보자

leeeee.yeon 2021. 7. 5. 22:19

1. db 연결 파트

 

< main.js 변경사항 >

var db = require('./lib/db');

< db.js 추가 > - in lib 디렉토리

var mysql = require('mysql');

var db = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: '혹시 모르지만 비밀',
    database: 'web'
  });
  db.connect();

  module.exports = db;

+ db.js가 github에 공개되는 것은 위험할 수가 있으므로 db-template.js를 생성하고 db.js는 github push에서 제외하는 방법이 있음을 알아두자.

< db.template.js >

var mysql = require('mysql');

var db = mysql.createConnection({
    host: '',
    user: '',
    password: '',
    database: ''
  });
  db.connect();

  module.exports = db;

 

2. topic 파트

 

db 파일에서 한거처럼 파일을 분리하고 내용을 옮긴다.

그러나 db와 다르게 topic.js에는 export 해야하는 것이 여러개이므로

exports.~~~ = ~~~와 같은 방식을 사용한다.

 

리팩토링을 잘하다가 글 수정 시 저자가 null로 나오는 것을 발견했다! 글 수정 시 저자 수정 기능을 넣지 않으려고 했는데 그것 때문에 이렇게 된거 같다. 그래서 저자 수정 기능도 추가해주었다.

 

< main.js 수정사항 >

if(pathname === '/'){
if(queryData.id === undefined){ // 메인 페이지
topic.home(request, response);
} else { // 상세 글
topic.page(request, response);
}
} else if(pathname === '/create'){ // 생성
topic.create(request, response);
} else if(pathname === '/create_process'){ // 생성 submit
topic.create_process(request, response);
} else if(pathname === '/update'){ // 수정
topic.update(request, response);
} else if(pathname === '/update_process'){ // 수정 submit
topic.update_process(request, response);
} else if(pathname === '/delete_process'){ // 삭제
topic.delete_process(request, response);
} else {
response.writeHead(404);
response.end('Not found');
}

< topic.js 추가 >

var url = require('url');
var qs = require('querystring');

var db = require('./db');
var template = require('./template.js');

exports.home = function(request, response){
    db.query(`SELECT * FROM topic`, function(error, topics){
        var title = 'Welcome';
        var description = 'Hello, Node.js';
        var list = template.list(topics);
        var html = template.HTML(title, list,
          `<h2>${title}</h2>${description}`,
          `<a href="/create">create</a>`
        );
        response.writeHead(200);
        response.end(html);
      });
}

exports.page = function(request, response){
    var _url = request.url;
    var queryData = url.parse(_url, true).query;

    db.query(`SELECT * FROM topic`, function(error, topics){
        if(error) throw error;
        db.query(`SELECT * FROM topic left join author on topic.author_id=author.id WHERE topic.id=?`,
        [queryData.id],function(error2, topic){
          if(error2) throw error2;
          var title = topic[0].title;
          var description = topic[0].description;
          var list = template.list(topics);
          var html = template.HTML(title, list,
            `<h2>${title}</h2>
            ${description}
            <p>by ${topic[0].name}</p>`,
            `<a href="/create">create</a>
            <a href="/update?id=${queryData.id}">update</a>
            <form action="delete_process" method="post">
              <input type="hidden" name="id" value="${queryData.id}">
              <input type="submit" value="delete">
            </form>`
          );

          response.writeHead(200);
          response.end(html);
        });
      });
}

exports.create = function(request, response){
    db.query(`SELECT * FROM topic`, function(error, topics){
        db.query(`SELECT * FROM author`, function(error2, authors){
          var tag = '';
          var i = 0;
          while(i<authors.length){
            tag += `<option value="${authors[i].id}">${authors[i].name}</option>`
            i++;
          }

          var title = 'Create';
          var description = 'write description';
          var list = template.list(topics);
          var html = template.HTML(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>
                ${template.authorSelect(authors)}
              </p>
              <p>
                <input type="submit">
              </p>
            </form>
          `,
            `<a href="/create">create</a>`
          );
  
          response.writeHead(200);
          response.end(html);
        });
      });
}

exports.create_process = function(request, response){
    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;
        
        db.query(`
          INSERT INTO topic (title, description, created, author_id)
            VALUES(?, ?, NOW(), ?)`,
            [post.title, post.description, post.author],
            function(error, result){
              if(error) throw error;
              response.writeHead(302, {Location: `/?id=${result.insertId}`});
              response.end();
            }
            );
    });
}

exports.update = function(request, response){
    var _url = request.url;
    var queryData = url.parse(_url, true).query;
    db.query(`SELECT * FROM topic`, function(error, topics){
        if(error) throw error;
        db.query(`SELECT * FROM topic WHERE id=?`, [queryData.id], function(error2, topic){
          if(error2) throw error2;
          db.query(`SELECT * FROM author`, function(error3, authors){
            if(error3) throw error3;
            var list = template.list(topics);
            var html = template.HTML(topic[0].title, list,
              `
              <form action="/update_process" method="post">
                <input type="hidden" name="id" value="${topic[0].id}">
                <p><input type="text" name="title" placeholder="title" value="${topic[0].title}"></p>
                <p>
                  <textarea name="description" placeholder="description">${topic[0].description}</textarea>
                </p>
                <p>
                  ${template.authorSelect(authors, topic[0].author_id)}
                </p>
                <p>
                  <input type="submit">
                </p>
              </form>
              `,
              `<a href="/create">create</a> <a href="/update?id=${topic[0].id}">update</a>`
            );
            response.writeHead(200);
            response.end(html);
          });
        });
      });
}

exports.update_process = function(request, response){
    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;
        var author = post.author;
        
        db.query(`UPDATE topic SET title=?, description=?, author_id=? WHERE id=?`,
        [title, description, author, id],
        function(error, result){
          response.writeHead(302, {Location: `/?id=${id}`});
          response.end();
        });
    });
}

exports.delete_process = function(request, response){
    var body = '';
    request.on('data', function(data){
        body = body + data;
    });
    request.on('end', function(){
        var post = qs.parse(body);
        var id = post.id;

        db.query(`DELETE FROM topic WHERE id=?`, [post.id], function(error, result){
          if(error) throw error;
          response.writeHead(302, {Location: `/`});
          response.end();
        });
    });
}