본문 바로가기
웹개발/Node.js

[Node.js] 글 상세페이지 만들기

by 철없는민물장어 2023. 2. 19.
728x90
반응형

글 제목을 클릭하면 상세페이지가 열리는것을 만들어 보자.

 

우선, 상세페이지는 하나만 있는것이 아니라, 

글마다 하나씩 있어야 하기 때문에 

경로를 /detail/:id로 했다.

그러면 '/detail/글번호 '경로로 해당 글번호에 해당하는 상세페이지를 볼 수 있다.

 

 

(server.js)

app.get('/detail/:id',function(req,res){
    
    db.collection('post').findOne({_id:parseInt(req.params.id)},function(에러,결과){
        console.log(결과);
        res.render('detail.ejs',{data:결과})
    })
  
})

'/detail/:id' 경로로 오는 get요청을 처리해준다.

경로에서 콜론: 뒤에오는 것은 파라미터로,

req.params.파라미터명으로 사용할 수 있다.

 

DB에서 _id:req.params.id인 요소를 찾고,

res.render()를 통해 detail.ejs파일에 data라는 변수명으로 결과값을 보낸다.

(그럼 detail.ejs파일에서는 data를 가지고 상세페이지를 잘 나타내면 될 것 같다.)

 

(detail.ejs)

<h4>글 번호: <%=data._id%></h4>
  <h4>제목: <%=data.title%></h4>
  <h4>날짜: <%=data.date%></h4>

아주 간단하게 data를 이용해서 글 번호, 제목, 날짜를 나타내주었다.

 

이제 detail페이지에 대한 것은 거진 완료되었고,

list.ejs에서 글 제목을 클릭하면 상세페이지 경로로 이동하게끔 하면 되겠다.

(list.ejs)

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

간단하게 <a>태그를 이용해서 detail/글번호 로 이동할 수 있게 했다.

728x90
반응형

댓글