페이지 생성, 수정, 삭제

페이지 생성

< main.js 추가 >

app.get('/create', function(request, response){
    topic.create(request, response);
});

app.post('/create_process', function(request, response){
   topic.create_process(request, response);
});

• 작성한 내용을 전달받을 때는 app.post()를 사용한다.
• post 방식으로 전송하면 app.get()이 아닌 app.post()로 자동으로 가지만 명시적으로 create_process라고 하여 구분하여 주자.

 

< topic.js 추가 >

exports.create = function(request, response){
    db.query(`SELECT * FROM topic`, function(error, topics){
        db.query(`SELECT * FROM author`, function(error2, authors){

          var title = 'Create';
          var list = template.list(topics);
          var html = template.HTML(sanitizeHtml(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.send(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;
        var author = post.author;
        
        db.query(`
          INSERT INTO topic (title, description, created, author_id)
            VALUES(?, ?, NOW(), ?)`,
            [title, description, author],
            function(error, result){
              if(error) throw error;
              response.writeHead(302, {Location: `/page/${result.insertId}`});
              response.end();
            }
            );
    });
}

 

처음에 create_process에서 문제가 생겼지만 process에서 오타가 난 어이 없는 문제였음 ^ㅅ^

그러나 삽질을 하면서 알게된 것들이 있음

 

• pm2 flush - 앞 로그들을 지우는 pm2 명령어, pm2 log가 제대로 작동하지 않는 것 같다고 생각하다 알게된 명령어
• topic - RowDataPacket 하나가 들어있는 배열
• topic[0] - RowDataPacket 이라서 이제까지 코드에서 topic[0]을 사용했던거임

 

페이지 수정

 

< main.js 추가 >

app.get('/update/:pageId', function(request, response){
    topic.update(request, response);
});

app.post('/update_process', function(request, response){
    topic.update_process(request, response);
});

 

< topic.js 추가 >

exports.update = function(request, response){
    db.query(`SELECT * FROM topic`, function(error, topics){
        if(error) throw error;
        db.query(`SELECT * FROM topic WHERE id=?`, [request.params.pageId], 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(sanitizeHtml(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="${sanitizeHtml(topic[0].title)}"></p>
                <p>
                  <textarea name="description" placeholder="description">${sanitizeHtml(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/${topic[0].id}">update</a>`
            );
            response.send(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){
          if(error) throw error;
          response.redirect(`/page/${id}`);
        });
    });
}

• 깔끔한 페이징을 위해 :pageId를 사용하고
• queryData.id도 request.params.pageId로 바꿔줌

 

페이지 삭제

 

< main.js 추가 >

app.post('/delete_process', function(request, response){
    topic.delete_process(request, response);
 });

 

< topic.js 추가 >

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.redirect('/');
        });
    });
}

 

+ 상세페이지 ( exports.page ) 에서 delete_process 관련 form 태그를

<form action="/delete_process" method="post">

이렇게 바꿔주어 ( 앞에 / 추가 ) 게시글 삭제 후 최상위 페이지로 갈 수 있도록 하였다.

 

+ response.redirect() 함수를 이용하여 라우팅을 express스럽게 바꿔주었다.