[Web Application-개발] 2023-11-22 웹 어플리케이션 제작 프로젝트 : 게시판 만들기 #9-1

2023. 11. 22. 02:33Project/Web Application-개발

 

프로젝트 일지

 

지난 작업에서는 마이 페이지를 제작하며 사용자별 개인 정보를 확인할 수 있고 필요에 따라 아이디를 제외한 개인 정보를 변경할 수 있는 기능을 구현하였다. 이번 작업은 게시판 페이지를 제작할 예정이며 각 기능별로 일지를 쓸 예정이다.

 

앞으로 진행할 작업 예정 리스트는 다음과 같다.

 

  • 게시판 제작 : DB 연결 및 디스플레이 작업
  • 게시판 제작 : 페이징 작업
  • 게시판 제작 : 글쓰기 및 삭제 작업
  • 게시판 제작 : 조회 기능
  • 게시판 제작 : 디테일 및 마무리

 

게시판 제작 : 디스플레이 작업 및 DB 연결

 

1) <table> 태그

HTML에서 테이블 태그는 주로 표를 만들 때 사용하는 태그로 게시판 틀을 만드는데에 있어서도 유용한다. 테이블 태그의 하위 요소들로는 <th>, <tr>, <td>가 존재하며 이를 활용하여 용도에 맞는 표를 구성할 수 있다. 각 요소별 기능은 다음과 같다.

  • <td>text</td> : table head의 약자를 뜻하며 표의 제목을 나타낸다. 기본값으로 굵은 글씨체와 중앙 정렬 속성을 가진다.
  • <tr>text</tr> : table row의 약자를 뜻하며 표의 행을 나타낸다. 기본값으로 보통 글씨체와 왼쪽 정렬 속성을 가진다.
  • <td>text</td> : table data의 약자를 뜻하며 표의 셀을 나타낸다. 기본값으로 보통 글씨체와 왼쪽 정렬 속성을 가진다.

 

게시판 예시

 

위 사진에서 보이듯이 게시판은 표의 구성을 가지고 있으며 표의 제목으로는 게시판에 쓰인 글의 제목, 글쓴이, 등록일 등이 존재한다. 이를 토대로 표의 제목으로 번호, 제목, 글쓴이, 작성일을 사용한다.

 

2) board.php

 

테이블을 만들기 위해 <table> 태그 안에 요소들을 포함한다. 그리고 표의 제목으로 쓰일 text는 <th> 태그로 나타낸다. <th> 태그에 입력할 내용으로는 게시글의 번호, 제목, 글쓴이, 작성일로 입력한다.

 

 

표의 제목을 입력하여 게시판의 틀을 만들었으면 이제 게시글을 등록하여 정상 작동하는지 확인한다. 등록된 게시글을 저장하기 위해 test_board라는 이름의 테이블을 생성하였다. 게시글의 속성으로 idx(번호), user_id(글쓴이), title(제목), content(내용), reg_date(등록일)으로 입력하였으며 미리 11개의 게시글을 저장해놓았다.

 

 

 

 

게시판의 게시글은 가장 나중에 등록한 게시글이 가장 위에 위치한다. 이러한 효과를 나타내기 위해 게시글을 조회할 때 쿼리문 자체에서 정렬을 하여 조회한다. SQL 쿼리문에서 데이터를 정렬하여 조회하기 위해서는 'order by'구문을 사용한다. 가장 나중에 등록한 게시글이 위에서 부터 위치하려면 등록일(reg_date)을 기준으로 내림차순 정렬을 하여 조회하면 된다. 이는 'order by reg_date DESC'으로 나타낼 수 있으며 DESC가 내림차순을 나타내는 단어이다.(오름차순은 정렬 방법을 입력하지 않으면 기본값으로 사용되며 나타내려면 ASC를 입력하면된다. )