Node.js로 웹서비스 만들기 14일차

URL 파라미터로 상세페이지 보여주기

 

/detail/게시글번호

의 형식으로 get요청을 했을때 서버에서 해당 게시물 번호에 맞는 내용을 detail.ejs 파일에 보여준다.

 

//server.js

app.get('/detail/:id', function(request, response){
    db.collection('post').findOne({_id : parseInt(request.params.id)}, function(error, result){
        console.log(result);
        response.render('detail.ejs', { data : result });
    });    
});

detail/:id  파라미터를 id라는 이름으로 넘겨준다

post 라는 이름의 컬렉션에서 _id가 파라미터로 넘겨주는 id인 게시글을 찾아서 결과를 보여줄건데

콘솔에도 한번 띄워주고

detail.ejs를 화면에 렌더링 할때 data라는 이름으로 결과를 보내줄거야

결과는 이런 식으로 콘솔에 찍힌다

 

그러면 이제 detail.ejs파일을 만든다.

//detail.ejs
<h4>상세페이지</h4>

        <%= data.제목 %><br>
        <%= data.날짜 %>

data라는 이름으로 받은 결과 // 저 위에 있는 오브젝트형 자료에서

제목

날짜

를 화면에 보여줌

 

그럼 이제 url 접속만 하면 됨

 

리스트 화면에서 링크를 만들어준다

 

//list.ejs
<% for(var i=0; i<posts.length; i++) { %>
          <li class="list-group-item">            
            <h4>할일 제목 : <a href="/detail/<%= posts[i]._id %>"><%= posts[i].제목 %></a></h4>
            <p>할일 마감날짜 : <%= posts[i].날짜 %></p>
            <button type="button" class="delete" data-id="<%= posts[i]._id %>">삭제</button>
          </li>
        <% } %>

<a href="/detail/<%= posts[i]._id %>"><%= posts[i].제목 %></a>

게시글의 _id 번호로 접속하게 된다.

 

그러면 detail.ejs 화면에서

게시글의 _id 번호의 제목과

게시글의 _id 번호의 날짜를 보여주게 됨