Notice
Recent Posts
Recent Comments
Link
«   2025/07   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
Archives
Today
Total
관리 메뉴

9시 24분

실습 준비, 홈페이지 구현, 상세페이지 구현 본문

Javascript/Node.js

실습 준비, 홈페이지 구현, 상세페이지 구현

leeeee.yeon 2021. 7. 7. 21:53

배포에 성공했으니 express도 얼른 신나게 해보장

 

실습 준비

 

npm install express --save

express를 설치하고 node_modules에 반영되었는지 확인하자.

 

var express = require('express');
var app = express()

// app.get('/', (req, res) => res.send('Hello World'));
app.get('/', function(req, res){
  return res.send('Hello World');
});

app.listen(3000, () => console.log('Example app listening on port 3000!'));

app.get - 라우팅

기존 코드에서는 if else 문을 이용하여 라우팅을 했는데, 이제는 get 함수를 이용하여 라우팅을 하자.

 

홈페이지 구현

 

< main.js 전체 코드 >

var express = require('express');
var app = express();

var http = require('http');
var url = require('url');
var topic = require('./lib/topic.js');
var author = require('./lib/author.js');

// app.get('/', (req, res) => res.send('Hello World'));
app.get('/', function(request, response){
    topic.home(request, response);
});

app.listen(3000);

 

상세페이지 구현

 

< main.js 수정 >

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

 

< topic.js 수정 >

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=?`,
        [request.params.pageId],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>${sanitizeHtml(title)}</h2>
            ${sanitizeHtml(description)}
            <p>by ${sanitizeHtml(topic[0].name)}</p>`,
            `<a href="/create">create</a>
            <a href="/update?id=${request.params.pageId}">update</a>
            <form action="delete_process" method="post">
              <input type="hidden" name="id" value="${request.params.pageId}">
              <input type="submit" value="delete">
            </form>`
          );

          response.send(html);
        });
      });
}
  • queryData.id를 request.params.pageId로 수정

 

< template.js 수정 >

  ,list:function(topics){
    var list = '<ul>';
    var i = 0;
    while(i < topics.length){
      list = list + `<li><a href="/page/${topics[i].id}">${sanitizeHtml(topics[i].title)}</a></li>`;
      i = i + 1;
    }
    list = list+'</ul>';
    return list;
  }
  • a 태그 수정