[RESTful 라우트] RESTful 주석 Show

728x90

이번에는 Show 라우트를 구현하는 방법에 대해 알아보겠습니다. Show 라우트는 특정 리소스의 세부 정보를 확장된 형식으로 표시하는 역할을 합니다. 이는 댓글 하나, 게시물, 사용자, 또는 다른 리소스에 해당할 수 있습니다. 이 글에서는 우리의 댓글 시스템을 기준으로 설명할 것이며, 다른 리소스에 대한 Show 라우트를 구현하는 방법도 유사합니다.

먼저, Show 라우트는 하나의 특정 리소스에 대한 정보를 표시하는데, 이를 위해 해당 리소스를 고유하게 식별할 수 있는 식별자(ID)가 필요합니다. 이 ID는 주로 URL에 포함되며, 예를 들어 /comments/1과 같은 형식으로 표현됩니다. 이 ID는 데이터베이스에서 해당 리소스를 찾을 때 사용됩니다.

간단한 예시로, 댓글에 대한 Show 라우트를 구현하는 코드를 살펴보겠습니다.

// comments/show 라우트 정의
app.get('/comments/:id', (req, res) => {
  // ID를 가져오기
  const { id } = req.params;
  
  // ID를 숫자로 변환
  const commentId = parseInt(id);
  
  // 데이터베이스에서 댓글 찾기
  const comment = comments.find(c => c.id === commentId);
  
  // 댓글이 존재하면 Show 페이지 렌더링
  if (comment) {
    res.render('comments/show', { comment });
  } else {
    // 댓글이 없으면 오류 처리
    res.status(404).send('Comment not found');
  }
});

위 코드에서 /comments/:id는 URL의 동적 파라미터를 나타냅니다. 여기서 :id는 해당 위치에 있는 값을 req.params.id로 가져올 수 있도록 합니다.

이제 Show 페이지를 위한 템플릿을 만들어보겠습니다. views/comments/show.ejs 파일을 생성하고 다음과 같이 작성합니다.

<!-- views/comments/show.ejs -->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Comment Details</title>
</head>
<body>
  <h1>Comment <%= comment.id %></h1>
  <h2><%= comment.username %> - <%= comment.text %></h2>
  <a href="/comments">Back to Index</a>
</body>
</html>

위의 코드에서 <a href="/comments/<%= comment.id %>">Details</a> 부분은 각 댓글에 대한 Show 페이지로 이동하는 링크를 생성합니다.

이제 Show 라우트 및 페이지가 구현되었습니다. 각 댓글에 대한 세부 정보를 확인하고, 인덱스 페이지에서 해당 댓글로 쉽게 이동할 수 있게 되었습니다. 다음 영상에서는 나머지 부분에 대한 처리와 오류 처리에 대해 알아보겠습니다.

728x90

'프로그래밍 언어 > Node.js' 카테고리의 다른 글

[RESTful 라우트] RESTful 주석 업데이트: Patch 요청과 댓글 수정 (0)	2023.11.14
[RESTful 라우트] UUID 패키지를 활용한 범용 고유 식별자 생성 (0)	2023.11.14
[RESTful 라우트] Express 방향 수정: 리다이렉트와 더 나은 사용자 경험 (0)	2023.11.14
[RESTful 라우트] RESTful 주석 - 새로운 댓글 생성하기 (CRUD: Create) (0)	2023.11.14
[RESTful 라우트] RESTful 주석 Index 구현하기 (0)	2023.11.13

'프로그래밍 언어 > Node.js' 카테고리의 다른 글

티스토리툴바