게시글을 다른 사용자와 공유할 수 있는 기능을 추가하려면, 각 게시글에 고유한 URL을 생성하고 이를 통해 게시글을 조회할 수 있도록 구현해야 합니다. 다음과 같은 단계를 따라 구현할 수 있습니다:
1. 게시글에 고유 ID 부여
각 게시글을 식별하기 위해 고유한 ID를 부여합니다.
// 게시글 데이터를 저장할 배열
let posts = [];
let nextId = 1; // 게시글 ID 초기값
// 게시글 작성 처리
app.post('/create', (req, res) => {
const { title, content } = req.body;
const newPost = {
id: nextId++,
title,
content,
date: new Date().toLocaleString()
};
posts.push(newPost);
res.redirect('/');
});2. 게시글 상세 보기 라우트 추가
고유한 ID를 사용하여 특정 게시글을 조회할 수 있는 라우트를 추가합니다.
// 게시글 상세 보기
app.get('/posts/:id', (req, res) => {
const postId = parseInt(req.params.id);
const post = posts.find(p => p.id === postId);
if (post) {
res.render('post', { post });
} else {
res.status(404).send('게시글을 찾을 수 없습니다.');
}
});3. 뷰 파일 생성 및 수정
게시글 목록에서 각 게시글의 제목을 클릭하면 해당 게시글의 상세 페이지로 이동할 수 있도록 index.ejs 파일을 수정하고, 게시글 상세 내용을 표시할 post.ejs 파일을 생성합니다.
views/index.ejs:
<!DOCTYPE html>
<html>
<head>
<title>게시판</title>
</head>
<body>
<h1>게시판</h1>
<a href="/new">새 글 작성</a>
<ul>
<% posts.forEach(post => { %>
<li>
<h2><a href="/posts/<%= post.id %>"><%= post.title %></a></h2>
<p><%= post.content %></p>
<p><small><%= post.date %></small></p>
</li>
<% }) %>
</ul>
</body>
</html>views/post.ejs:
<!DOCTYPE html>
<html>
<head>
<title><%= post.title %></title>
</head>
<body>
<h1><%= post.title %></h1>
<p><%= post.content %></p>
<p><small><%= post.date %></small></p>
<a href="/">목록으로</a>
</body>
</html>4. 공유 링크 제공
게시글 상세 페이지에서 현재 페이지의 URL을 복사하여 다른 사용자와 공유할 수 있도록 안내합니다.
views/post.ejs에 추가:
<p>이 게시글을 공유하려면 아래 URL을 복사하세요:</p>
<input type="text" value="<%= 'http://localhost:3000/posts/' + post.id %>" readonly onclick="this.select();">이러한 구현을 통해 각 게시글에 고유한 URL을 부여하고, 해당 URL을 통해 게시글을 공유할 수 있습니다.
참고 자료: