상세 페이지 이동 - board page

DATE : 2023/12/02

4주차에 구현한 코드에서는 단순히 DB에 있는 정보를 가져와

게시판 페이지에 목록을 만드는 수준이었다면

이제는 게시판 글 중에서 하나의 글을 선택했을 때,

해당 게시물의 내용을 볼 수 있는 상세 페이지로 이동할 수 있어야 한다!!

그렇다면 우리가 해결해야 할 두 가지는 다음과 같다.

(1) 이동할 상세 페이지 만들기

(2) 상세 페이지로 이동하기 위한 링크 연결

아직 상세한 레이아웃을 생각한 건 아니기 때문에 이번 POST에서는 (2)번을 주로 다루어볼 예정이다.

while($row = mysqli_fetch_array($get_post_res)) {?>
    <tr class="article_row" id="article_row">
        <th><?=$row['id'];?></th>
        <th class="title"><a href="article.php?idx=<?=$row['id'];?>"><?=$row['title'];?></a></th>
        <th><?=$row['author'];?></th>
        <th><?=$row['date']?></th>
        <th><?=$row['hit']?></th>
    </tr>

"사용자가 게시물을 골랐을 때, 어떻게 하면 해당 게시물 페이지로 이동할 수 있을까?"에 대한 해답은

바로 a tag이다.

코드를 보면 알 수 있듯이, 게시물 제목에 a tag로 링크를 걸어두는데

여기서 링크를 클릭하게 되면 해당 게시물의 id가 idx parameter로

href = "article.php?idx=<?=$row['id']?>"

article.php에 전달된다.

"게시물을 클릭했을 때, 상세 페이지로 이동한다"라는 과정은 결과적으로 보면

게시물의 개수 만큼 서로 다른 페이지가 만들어져야 한다는 의미인데

그렇다면 우리가 1만 개의 게시물이 있다고 하면,

각 게시물의 상세 페이지를 미리 만들어 놓고 사용자가 요청할 때 보내주면 되는 걸까??

정답은 NO!

정적 페이지 vs 동적 페이지에서 배운 거 처럼 우리는 일일이 페이지를 만드는 작업 대신

이미 고정된 틀에 요청된 게시물로 내용만 바꿔가면서 상세 페이지를 만들 것이다. 💡

즉, 상세 페이지는 동적 페이지라는 뜻이고 그렇기 때문에 확장자가 PHP인 걸 볼 수 있다. (article.php)

이때 고정된 틀로 사용할 레이아웃을 미리 작성하는 것과

요청된 게시물의 내용으로 페이지를 채워 넣는 것이 (1)번 업무가 될 것이다.

여기까지 이해가 됐다면 다음으로 고려해볼 문제는

"사용자가 클릭한 게시물의 정보를 어떻게 가져올 것인가?" 이다.

이 문제를 해결하기 위해서 a tag href에서는

선택된 게시물의 id를 idx parameter로 전달하고 있는 것이다.

여기서 코드를 살펴볼 건 아니지만, 후에 article.php code를 보게 된다면

idx 값을 가져와 해당 아이디의 게시물을 board Table에서 꺼내온 후,

Table에서 가져온 정보(title, content, author, date, hit)를 가지고

페이지를 구성함으로써 동적 페이지로 동작하게 됨을 이해할 수 있을 것이다.

idx는 사용자가 선택한 게시물에 따라 달라지는 값이고,

이 값을 토대로 가져오는 게시물 정보로 페이지를 만들기 때문에

당연히 idx 값이 달라지면 완성된 페이지의 내용이 달라지게 되는 것.

이런 점을 활용해서 다음으로는, 우리가 원하는 게시물의 상세 페이지를 만들어보도록 하자. ➡️