생활코딩

Coding Everybody

MySQL로 글수정 기능 구현

토픽 생활코딩 > WEB > WEB2 - Node.js > Node.js - MySQL

수업소개

Node.js 웹앱의 글 수정 기능을 MySQL로 구현하는 방법을 소개합니다. 

 

 

 

강의 1

 

 

 

소스코드

main.js (변경사항)

 

 

 

강의 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 path = require('path');
var sanitizeHtml = require('sanitize-html');
var mysql = require('mysql');
var db = mysql.createConnection({
  host:'localhost',
  user:'root',
  password:'111111',
  database:'opentutorials'
});
db.connect();


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){
        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);
        });
      } else {
        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;
           }
          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}`,
            ` <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);
         })
      });
      }
    } else if(pathname === '/create'){
      db.query(`SELECT * FROM topic`, function(error,topics){
        var title = 'Create';
        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>
              <input type="submit">
            </p>
          </form>
          `,
          `<a href="/create">create</a>`
        );
        response.writeHead(200);
        response.end(html);
      });
    } else if(pathname === '/create_process'){
      var body = '';
      request.on('data', function(data){
          body = body + data;
      });
      request.on('end', function(){
          var post = qs.parse(body);
          db.query(`
            INSERT INTO topic (title, description, created, author_id) 
              VALUES(?, ?, NOW(), ?)`,
            [post.title, post.description, 1], 
            function(error, result){
              if(error){
                throw error;
              }
              response.writeHead(302, {Location: `/?id=${result.insertId}`});
              response.end();
            }
          )
      });
    } else if(pathname === '/update'){
      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;
          }
          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>
                <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);
        });
      });
    } else if(pathname === '/update_process'){
      var body = '';
      request.on('data', function(data){
          body = body + data;
      });
      request.on('end', function(){
          var post = qs.parse(body);
          db.query('UPDATE topic SET title=?, description=?, author_id=1 WHERE id=?', [post.title, post.description, post.id], function(error, result){
            response.writeHead(302, {Location: `/?id=${post.id}`});
            response.end();
          })
      });
    } else if(pathname === '/delete_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 filteredId = path.parse(id).base;
          fs.unlink(`data/${filteredId}`, function(error){
            response.writeHead(302, {Location: `/`});
            response.end();
          })
      });
    } else {
      response.writeHead(404);
      response.end('Not found');
    }
});
app.listen(3000);

 

댓글

댓글 본문
  1. 감자
    22.12.19
  2. 당당
    2022.11.09
  3. 대포123
    221020 완료!
  4. toonfac
    220715 오전 11시 42분 완료
  5. 화려하게간다
    답은 익숙해지는 것 뿐!
  6. 화려하게간다
    화긴 .... 근데 아직 request on('data', function(data){
    body='';
    body=body+data;
    request on('end', function(error~~~
    이 부분이 이해가 안된다....ㅠㅠㅠㅠ
  7. RyanHeo
    value 값을 지정하는 과정에서 value=${topic[0].title) 이라고 잘못 기입해서 생긴 문제였네요. value="${topic[0].title}"로 수정 후 정상작동되는 것을 확인했습니다.
    대화보기
    • RyanHeo
      /update 도메인으로 접속시 topic[0].title 값을 input 태그에 넣는 과정에서 첫번째 단어만 남고 그 뒤로는 누락되어버리는데요. 예를 들어, 'Hello World'라는 제목의 글을 클릭하고 update 버튼을 누르고 들어가면 제목을 쓰는 input란에 'Hello'만 출력됩니다. mysql에서 확인해보면 'Hello World'로 들어가있고, 다른 페이지에서는 모두 제대로 작동하는데요. 혹시 저만 그런걸까요? 혹은 input type을 바꿔야할까요?
    • 케굴
      2021-12-29
    • labis98
      2021.08.01 Good!!!
    • hanel_
      21.3.24
    • chimhyangmoo
      21.03.17
    • jeisyoon
      2021.03.11 MySQL 글 수정기능 구현 - OK
    • 김지호
      21 01 03
    • 생활둘기
      2021 1 2
    • quitous
      메인페이지에서 title을 누르면
      localhost:3000?id=1 등으로 가는게 아니라
      localhost:3000/?id=[object%20Object] 로 가서 에러가 납니다ㅜㅜ
      코드에서 실수를 찾지 못해서 올려주신 소스코드 그대로 써도 에러가 나는데 어떤 문제일까요..
    • 콜라
      20201021 완료
    • Jonghwo Lee
      완료
    • Jonghwo Lee
      완료
    • 가톨릭대 컴공
      완료
    • 심여수
      감사합니다
    • 준바이
      감사합니다
    • import.위드
      감사합니다 ㅎㅎ
    • 강다리
      재밌습니다
    • 굼벵이
      완료
    • jo_onc
      감사합니다~
    • 연수아빠
      수강 완료!!