컴퓨터 프로그래밍/Node.js
[Node.js] 상세페이지 만들기 2 (링크 만들기)
한33
2023. 11. 7. 20:56
<%= JSON.stringify(변수)%> 를 하면 html 에서 데이터를 띄워볼 때 array 나 object 값이어도 내용을 깨지지 않고 봐볼 수 있다.
server.js
try {
let result = await db.collection('post').findOne({ _id: new ObjectId(요청.params.id) })
console.log(result)
if (result == null) {
응답.status(404).send('이상한 url 입력함')
}
응답.render('detail.ejs', { 글: result })
} catch (e) {
console.log(e)
응답.status(404).send('이상한 url 입력함')
}
})
list.ejs
<div class="white-bg">
<% for (let i =0; i<글목록.length; i++){ %>
<div class="list-box">
<h4><a style="text-decoration : none" href="/detail/<%= 글목록[i]._id%>"><%= 글목록[i].title%></a></h4>
<p><%= 글목록[i].content%></p>
</div>
<% } %>
</div>
우선 list.ejs 파일에서 다음과 같이 a태그를 넣어서 자동으로 url 페이지로 해당 데이터의 id 값을 넣어 이동시킬 수 있도록 하였다.
a:hover {
color: pink;
}
a {
color: black;
}
a태그의 색상과 밑줄을 변경할 수 있는 코드이다.
밑줄을 제거한 건
a style="text-decoration : none"
다이렉트로 style 을 넣어줬다.
코드의 안정성을 위해서 예외상황을 처리해줬다.
맨 위의 코드를 보면 유저의 입력값이 id 보다 짧으면 catch , 길이는 같지만 다른 값은 null 값이 뜨기 때문에
catch 로 예외를 못 잡는 상황이 나와서 if 문으로 null 일 시에 다르게 처리되도록 코드를 짜줬다.
