Today I Learned …
[웹개발] 게시글 리스트 출력 기능 본문
* 개인적인 공부 내용을 기록한 글입니다.
최종 화면
게시판 리스트 출력 기능
0. 요약
[1] 게시판 페이지를 만든다.
[2] 게시글 목록을 출력할 표를 만든다.
[3] DB에 담긴 게시글 정보를 최신글부터 가져와 출력해준다.
1. 게시판 페이지 (= board.php) 에 게시글 목록을 출력할 표를 만든다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Board</title>
</head>
<body>
<div class=top><h2>게시판</h2></div>
<button class=no onclick="window.location.href='write.php'">글쓰기</button>
<table class=middle>
<thead>
<tr align=center>
<th width=70>Post ID</th>
<th width=300>제목</th>
<th width=120>작성자</th>
<th width=120>작성일</th>
<th width=70>조회수</th>
<th width=70>좋아요</th>
</tr>
</thead>[0] 게시글 목록 상단의 제목 부분을 만든다.
① Post ID
② 제목
③ 작성자
④ 작성일
⑤ 조회수
⑥ 좋아요
2. DB에 담긴 게시글 정보를 최신글부터 가져와 출력해준다.
//(윗 부분)...
<?php
$conn = mysqli_connect('localhost', 'choco', '7173', 'study_login');
$sql = "SELECT * FROM board ORDER BY id DESC";
$res = mysqli_query($conn, $sql);
while($row = mysqli_fetch_array($res)){
?>
<tbody>
<tr align=center>
<td><?php echo $row['id'];?></td>
<td><a href="view.php?id=<?=$row['id']?>"><?php echo $row['title'];?></a></td>
<td><?php echo $row['name'];?></td>
<td><?php echo $row['written'];?></td>
<td><?php echo $row['hit'];?></td>
<td><?php echo $row['liked'];?></td>
</tr>
</tbody>
<?php } ?>
</table>
</body>
</html>[1] SELECT ~ ORDER BY 구문을 통해 모든 게시글의 정보를 최신글부터 가져온다.
[2] fetch를 반복 실행해서 쿼리문을 통해 뽑은 모든 행을 출력한다.
[3] echo*를 통해 게시글 목록 표의 원하는 위치에 원하는 컬럼별 정보를 출력한다.
* <?php echo 는 <?=로 줄여쓸 수도 있다.
2-1. 쿼리문 뜯어보기
1. SELECT * FROM board ORDER BY id DESC
[1] SELECT * FROM board
⇒ board (= 게시글 DB) 의 모든 정보를,
[2] ORDER BY id DESC
⇒ id (= 식별자컬럼명) 에 대한 내림차순으로 가져온다.
2. 쿼리문을 통해 뽑은 모든 행을 출력하고 싶다면?
[1] mysqli_fetch_array는 1회 실행에 한 개의 행만을 가져온다.
[2] 또한 데이터를 가져온 후 함수 내부의 포인터를 증가시켜, 다시 호출될 때 그 다음 행을 가져올 수 있도록 한다.
[3] 따라서, while문을 통해 여러번 fetch 해주면 모든 행을 순서대로 출력할 수 있다.
'Web > APM' 카테고리의 다른 글
| [웹개발] 웹 최종 한 눈에 보기 (2) : 글수정, 글삭제, 조회수, 좋아요 (취소 포함) (0) | 2021.10.27 |
|---|---|
| [웹개발] 웹 최종 한 눈에 보기 (1) : 그리팅, 로그인, 회원가입, 메인, 글쓰기, 글조회, 게시판, 검색어로 검색, 작성기간으로 검색 (0) | 2021.10.27 |
| [웹개발] 게시글 작성 기능 (0) | 2021.10.26 |
| [웹개발] 비밀번호 일치 확인 (0) | 2021.10.24 |
| [웹개발] 로그인 5 Cases (2) | 2021.10.24 |
