본문 바로가기
프로그래밍 개발/NodeJs

Node.js and Mysql - 저자 관련 기능 구현

by Jinseok Kim 2021. 1. 12.
반응형

 

저자 관련 기능 구현

 

 

 

 

 

1. 저자 목록 보기 기능 구현

 

 

main.js

var http = require('http');
var fs = require('fs');
var url = require('url');
var qs = require('querystring');
var template = require('./lib/template.js');
var db = require('./lib/db');
var topic = require('./lib/topic');
var author = require('./lib/author');

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){
        topic.home(request, response);
      } else {
        topic.page(request, response);
      }
    } else if(pathname === '/create'){
        topic.create(request, response);
     
    } else if(pathname === '/create_process'){
        topic.create_process(request, response);
      
    } else if(pathname === '/update'){
        topic.update(request, response);
      
    } else if(pathname === '/update_process'){
      topic.update_process(request, response);
    
    } else if(pathname === '/delete_process'){
      topic.delate_process(request, response);
      
      //author.js와 연동시켰다.
    } else if(pathname === '/author'){
      author.home(request, response);
    } else {
      response.writeHead(404);
      response.end('Not found');
    }
});
app.listen(3000);

 

 

 

template.js

module.exports = {
  HTML:function(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>
      <a href="/author">author</a>
      ${list}
      ${control}
      ${body}
    </body>
    </html>
    `;
 
  },list:function(topics){
    var list = '<ul>';
    var i = 0;
   
    while(i < topics.length){
      list = list + `<li><a href="/?id=${topics[i].id}">${topics[i].title}</a></li>`;
      i = i + 1;
    }
    list = list+'</ul>';
    return list;
  },authorSelect:function(authors, author_id){
    var tag = '';
    var i = 0;
    while(i < authors.length){
        var selected = '';
        if(authors[i].id === author_id){
            selected = ' selected';
        }
      tag += `<option value="${authors[i].id}"${selected}>${authors[i].name}</option>`;
      i++;
    }
    return `
      <select name="author">
        ${tag}
      </select>
    `
    //author에서 테이블 표를 만드는 템플릿을 아래와 같이 코드 작성함
},authorTable:function(authors){
    var tag = '<table>';
        var i = 0;
        while(i < authors.length){
            tag +=  `
              <tr>
                  <td>${authors[i].name}</td>
                  <td>${authors[i].profile}</td>
                  <td>update</td>
                  <td>delete</td>
          </tr>
             `

            i++;
          }
            tag += '</table>';
            return tag;
}
}

 

 

 

author.js

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

exports.home = function(request, response){
    db.query(`SELECT * FROM topic`, function(error,topics){
             //mysql의 데이터 테이블이 author일때 아래 콜백 함수 실행
        db.query(`SELECT * FROM author`, function(error2,authors){
          var list = template.list(topics);
          var html = template.HTML(title, list,
            `${template.authorTable(authors)} //template.js에서 테이블 표 만든것을 가져옴.
             <style>
             table{
                    border-collapse: collapse;
                }
                td{
                    border:1px solid black;
                }
             </style>

            `,
            `<a href="/create">create</a>`
          );
          response.writeHead(200);
          response.end(html);
        });
    });
    
}

 

author 링크를 누르며 데이터 표가 등장하는 것을 확인 할 수 있었다.

 

 

 

 

 

 

2. 저자 생성 기능 구현

 

 

main.js

var http = require('http');
var fs = require('fs');
var url = require('url');
var qs = require('querystring');
var template = require('./lib/template.js');
var db = require('./lib/db');
var topic = require('./lib/topic');
var author = require('./lib/author');

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){
        topic.home(request, response);
      } else {
        topic.page(request, response);
      }
    } else if(pathname === '/create'){
        topic.create(request, response);
     
    } else if(pathname === '/create_process'){
        topic.create_process(request, response);
      
    } else if(pathname === '/update'){
        topic.update(request, response);
      
    } else if(pathname === '/update_process'){
      topic.update_process(request, response);
    
    } else if(pathname === '/delete_process'){
      topic.delate_process(request, response);
    } else if(pathname === '/author'){
      author.home(request, response);
      //create을 위한 process 연동 추가. author.js으로 연동된다.
    } else if(pathname === '/author/create_process'){
      author.create_process(request, response);
    } else {
      response.writeHead(404);
      response.end('Not found');
    }
});
app.listen(3000);

 

 

author.js

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

exports.home = function(request, response){
    db.query(`SELECT * FROM topic`, function(error,topics){
        db.query(`SELECT * FROM author`, function(error2,authors){
         
        
          var title = 'author';
          var list = template.list(topics);
          var html = template.HTML(title, list,
            `${template.authorTable(authors)}
             <style>
             table{
                    border-collapse: collapse;
                }
                td{
                    border:1px solid black;
                }
             </style>
             
             //create을 위한 폼 태그를 만들었따.
           <form action='/author/create_process' method='post'>
            <p>
             <input type='text' name='name' placeholder='name'>
             
            </p>
            <p>
             <textarea name='profile' placeholder='profile'></textarea>
             
            </p>
             <p>
             <input type='submit'>
             </p>
            </form>
            `,
            ``
          );
          response.writeHead(200);
          response.end(html);
        });
    });
    
}

//author의 create_process가 발동되며 여기로 연동되어 실행된다.
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);
          db.query(`
            INSERT INTO author (name, profile) 
              VALUES(?, ?)`,
            [post.name, post.profile], 
            function(error, result){
              if(error){
                throw error;
              }
              response.writeHead(302, {Location: `/author`}); // 주소 /author일때
              response.end();
            }
          )
      });
}

이제 author의 데이터 표 또한 목록을 생성할 수 있는 것처럼 같은 원리로 데이터 표를 생성할 수 있게 되었다.

 

 

 

 

 

 

 

 

 

4. 저자 수정 기능 구현

 

 

main.js

var http = require('http');
var fs = require('fs');
var url = require('url');
var qs = require('querystring');
var template = require('./lib/template.js');
var db = require('./lib/db');
var topic = require('./lib/topic');
var author = require('./lib/author');

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){
        topic.home(request, response);
      } else {
        topic.page(request, response);
      }
    } else if(pathname === '/create'){
        topic.create(request, response);
     
    } else if(pathname === '/create_process'){
        topic.create_process(request, response);
      
    } else if(pathname === '/update'){
        topic.update(request, response);
      
    } else if(pathname === '/update_process'){
      topic.update_process(request, response);
    
    } else if(pathname === '/delete_process'){
      topic.delate_process(request, response);
    } else if(pathname === '/author'){
      author.home(request, response);
    } else if(pathname === '/author/create_process'){
      author.create_process(request, response);
      //author.js에 update 연동
    } else if(pathname === '/author/update'){
      author.update(request, response);
      //author.js에 update_process 연동
    } else if(pathname === '/author/update_process'){
      author.update_process(request, response);
    } else {
      response.writeHead(404);
      response.end('Not found');
    }
});
app.listen(3000);

 

 

author.js

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

exports.home = function(request, response){
    db.query(`SELECT * FROM topic`, function(error,topics){
        db.query(`SELECT * FROM author`, function(error2,authors){
         
        
          var title = 'author';
          var list = template.list(topics);
          var html = template.HTML(title, list,
            `${template.authorTable(authors)}
             <style>
             table{
                    border-collapse: collapse;
                }
                td{
                    border:1px solid black;
                }
             </style>
           <form action='/author/create_process' method='post'>
            <p>
             <input type='text' name='name' placeholder='name'>
             
            </p>
            <p>
             <textarea name='profile' placeholder='profile'></textarea>
             
            </p>
             <p>
             <input type='submit' value='create'>
             </p>
            </form>
            `,
            ``
          );
          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);
          db.query(`
            INSERT INTO author (name, profile) 
              VALUES(?, ?)`,
            [post.name, post.profile], 
            function(error, result){
              if(error){
                throw error;
              }
              response.writeHead(302, {Location: `/author`});
              response.end();
            }
          )
      });
}

//update 코드 연동
exports.update = function(request, response){
    db.query(`SELECT * FROM topic`, function(error,topics){
        db.query(`SELECT * FROM author`, function(error2,authors){
            var _url = request.url;
            var queryData = url.parse(_url, true).query;
            db.query(`SELECT * FROM author WHERE id=?`,[queryData.id], function(error3,author){
          var title = 'author';
          var list = template.list(topics);
          var html = template.HTML(title, list,
                                   
            `${template.authorTable(authors)}
             <style>
             table{
                    border-collapse: collapse;
                }
                td{
                    border:1px solid black;
                }
             </style>
           <form action='/author/update_process' method='post'>
            <p>
            <input type='hidden' name='id' value='${queryData.id}'
            </p>
            <p>
             <input type='text' name='name' value='${author[0].name}' placeholder='name'>
             
            </p>
            <p>
             <textarea name='profile' placeholder='profile'>${author[0].profile}</textarea>
             
            </p>
             <p>
             <input type='submit' value='update'>
             </p>
            </form>
            `,
            ``
          );
          response.writeHead(200);
          response.end(html);
            });
         
        });
    });
    
}

//update process 연동
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);
          db.query(`
            UPDATE author SET name=?, profile=? WHERE id=?`, 
            [post.name, post.profile, post.id], 
            function(error, result){
              if(error){
                throw error;
              }
              response.writeHead(302, {Location: `/author`});
              response.end();
            }
          )
      });
}

update 링크를 클릭하면 그대로 데이터 표으 데이터가 들어있는 폼이 등장하고 update 버튼을 누르면 바로 데이터 표에 수정된 모습을 확인 할 수 있었다.

 

 

 

 

 

 

 

 

5. 저자 삭제 기능 구현

 

main.js

var http = require('http');
var fs = require('fs');
var url = require('url');
var qs = require('querystring');
var template = require('./lib/template.js');
var db = require('./lib/db');
var topic = require('./lib/topic');
var author = require('./lib/author');

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){
        topic.home(request, response);
      } else {
        topic.page(request, response);
      }
    } else if(pathname === '/create'){
        topic.create(request, response);
     
    } else if(pathname === '/create_process'){
        topic.create_process(request, response);
      
    } else if(pathname === '/update'){
        topic.update(request, response);
      
    } else if(pathname === '/update_process'){
      topic.update_process(request, response);
    
    } else if(pathname === '/delete_process'){
      topic.delate_process(request, response);
    } else if(pathname === '/author'){
      author.home(request, response);
    } else if(pathname === '/author/create_process'){
      author.create_process(request, response);
    } else if(pathname === '/author/update'){
      author.update(request, response);
    } else if(pathname === '/author/update_process'){
      author.update_process(request, response);
      //delete author.js에 연동함.
    } else if(pathname === '/author/delete_process'){
      author.delete_process(request, response);
    }else {
      response.writeHead(404);
      response.end('Not found');
    }
});
app.listen(3000);

 

 

 

template.js

module.exports = {
  HTML:function(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>
      <a href="/author">author</a>
      ${list}
      ${control}
      ${body}
    </body>
    </html>
    `;
 
  },list:function(topics){
    var list = '<ul>';
    var i = 0;
   
    while(i < topics.length){
      list = list + `<li><a href="/?id=${topics[i].id}">${topics[i].title}</a></li>`;
      i = i + 1;
    }
    list = list+'</ul>';
    return list;
  },authorSelect:function(authors, author_id){
    var tag = '';
    var i = 0;
    while(i < authors.length){
        var selected = '';
        if(authors[i].id === author_id){
            selected = ' selected';
        }
      tag += `<option value="${authors[i].id}"${selected}>${authors[i].name}</option>`;
      i++;
    }
    return `
      <select name="author">
        ${tag}
      </select>
    `
},authorTable:function(authors){
    var tag = '<table>';
        var i = 0;
        while(i < authors.length){
            tag +=  `
              <tr>
                  <td>${authors[i].name}</td>
                  <td>${authors[i].profile}</td>
                  <td><a href='/author/update?id=${authors[i].id}'>update</a></td>
                  //delete는 보안상 a링크로 해주면 안된다. 폼 태그로 따로 구현해주었다.
                  <td>
                    <form action='/author/delete_process' method='post'>
                    <input type='hidden' name='id' value="${authors[i].id}">
                    <input type='submit' value="delete">
                    </form>
                   </td>
          </tr>
             `

            i++;
          }
            tag += '</table>';
            return tag;
}
}

 

 

author.js

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

exports.home = function(request, response){
    db.query(`SELECT * FROM topic`, function(error,topics){
        db.query(`SELECT * FROM author`, function(error2,authors){
         
        
          var title = 'author';
          var list = template.list(topics);
          var html = template.HTML(title, list,
            `${template.authorTable(authors)}
             <style>
             table{
                    border-collapse: collapse;
                }
                td{
                    border:1px solid black;
                }
             </style>
           <form action='/author/create_process' method='post'>
            <p>
             <input type='text' name='name' placeholder='name'>
             
            </p>
            <p>
             <textarea name='profile' placeholder='profile'></textarea>
             
            </p>
             <p>
             <input type='submit' value='create'>
             </p>
            </form>
            `,
            ``
          );
          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);
          db.query(`
            INSERT INTO author (name, profile) 
              VALUES(?, ?)`,
            [post.name, post.profile], 
            function(error, result){
              if(error){
                throw error;
              }
              response.writeHead(302, {Location: `/author`});
              response.end();
            }
          )
      });
}

exports.update = function(request, response){
    db.query(`SELECT * FROM topic`, function(error,topics){
        db.query(`SELECT * FROM author`, function(error2,authors){
            var _url = request.url;
            var queryData = url.parse(_url, true).query;
            db.query(`SELECT * FROM author WHERE id=?`,[queryData.id], function(error3,author){
          var title = 'author';
          var list = template.list(topics);
          var html = template.HTML(title, list,
                                   
            `${template.authorTable(authors)}
             <style>
             table{
                    border-collapse: collapse;
                }
                td{
                    border:1px solid black;
                }
             </style>
           <form action='/author/update_process' method='post'>
            <p>
            <input type='hidden' name='id' value='${queryData.id}'
            </p>
            <p>
             <input type='text' name='name' value='${author[0].name}' placeholder='name'>
             
            </p>
            <p>
             <textarea name='profile' placeholder='profile'>${author[0].profile}</textarea>
             
            </p>
             <p>
             <input type='submit' value='update'>
             </p>
            </form>
            `,
            ``
          );
          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);
          db.query(`
            UPDATE author SET name=?, profile=? WHERE id=?`, 
            [post.name, post.profile, post.id], 
            function(error, result){
              if(error){
                throw error;
              }
              response.writeHead(302, {Location: `/author`});
              response.end();
            }
          )
          
      });
}

//delete을 구현시키는 코드들이다.
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);
          db.query(
            `DELETE FROM topic WHERE author_id=?`, //mysql에서 topic의 author_id 삭제
            [post.id], 
            function(error1, result1){
                if(error1){
                    throw error1;
                }
                db.query(`
                    DELETE FROM author WHERE id=?`,  //mysql에서 author의 지정한 데이터 삭제
                    [post.id], 
                    function(error2, result2){
                        if(error2){
                            throw error2;
                        }
                        response.writeHead(302, {Location: `/author`});
                        response.end();
                    }
                )
            }
        );
      });
}

delete 버튼을 누르자 완전히 삭제되었다.

 

 

 

 

반응형

'프로그래밍 개발 > NodeJs' 카테고리의 다른 글

Node.js and Mysql - Node.js 정리정돈  (0) 2021.01.11
Node.js and Mysql - My SQL join을 이용해서 구현하기  (0) 2021.01.11
Node.js and Mysql - Node.js에 My SQL 구현하기  (0) 2021.01.11
Node.js - 출력정보에 대한 보안  (0) 2020.12.26
Node.js - 입력정보에 대한 보안  (0) 2020.12.26

관련글

댓글

티스토리툴바