오늘도 게시판을 이쁘게 꾸미겠습니다.
게시판이니깐 본래 있던 게시판의 css 에 추가로 작성하겠습니다.
최종 게시판의 코드랑 css 코드는 최종 포스트에 올리겠습니다. 그리고 취약점이 발견될 때마다 계속 코드 수정하는
형식으로 할게요
일단 꾸며보겠습니다.
-inquiry_board.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Welcome!</title>
<link rel="stylesheet" href = "/css/style_board.css">
</head>
<body>
<h1>INQUIRY_MENU</h1>
<?php
include 'DB_INFO.php'; //데이터 베이스 정보
//데이터베이스 연결
$conn = mysqli_connect($host,$username,$password,$db_inquiry);
//데이터베이스 오류시 종료
if(mysqli_connect_errno()) {
die("데이터 베이스 오류: ". mysqli_connect_error());
}
session_start(); //세션 시작
?>
<form method ="GET" action="inquiry_board.php" class="board-top">
<input type = "text" name="search" class="board-top1" value="<?php echo filter_var(strip_tags($_GET['search']),FILTER_SANITIZE_SPECIAL_CHARS);?>" placeholder="검색" >
<input type="submit" value="검색" class="board-top2">
<select name="sort" onchange="this.form.submit()">
<option value="">정렬 방식 선택</option>
<option value="date" <?php if(filter_var(strip_tags($_GET['sort']),FILTER_SANITIZE_SPECIAL_CHARS)=='date'){echo ' selected';} ?> >날짜순</option>
<option value="author" <?php if(filter_var(strip_tags($_GET['sort']),FILTER_SANITIZE_SPECIAL_CHARS)=='author'){echo ' selected';} ?> >작성자순</option>
</select>
<label for="date">날짜 선택:</label>
<input type="date" id="date_value" name="date_value" value="<?php echo isset($_GET['date_value']) ? $_GET['date_value'] : ''; ?>">
</form>
<div class = "board-title-bar">
<div class= "board-title-bar1">제목</div>
<div class= "board-title-bar2">작성자</div>
<div class= "board-title-bar3">날짜</div>
</div>
<?php
//한 페이지에 보여줄 게시물 수
$num_per_page = 5;
//현재 페이지 번호
if(isset($_GET['page'])) {
$page = mysqli_real_escape_string($conn,filter_var(strip_tags(intval($_GET['page'])),FILTER_SANITIZE_SPECIAL_CHARS));
} else {
$page = 1;
}
//검색이 입력된 경우
if(isset($_GET['search'])) {
$search = filter_var(strip_tags($_GET['search']),FILTER_SANITIZE_SPECIAL_CHARS);
if(isset($_GET['date_value']) && strtotime($_GET['date_value'])) {
//날짜 선택한 경우, strtotime() 이용해 유효한 값인지 확인
$date_value = filter_var(strip_tags($_GET['date_value']),FILTER_SANITIZE_SPECIAL_CHARS);
$date_value = DateTime::createFromFormat('Y-m-d', $date_value)->format('Y-m-d'); //날짜 값으로 다시 바꾼다
}
else {
//날짜가 선택이 안된 경우
$date_value = '';
}
} else {
//검색이 입력되지 않은 경우
$search = '';
$date_value = '';
}
//각 %을 붙여서 포함 된 문자열을 찾을 수 있게 한다
$search_value = '%'.$search.'%';
$date_value_value = '%'.$date_value.'%';
$sql = "SELECT * FROM $db_inquiry WHERE title LIKE ? AND date_value LIKE ? ";
$total_sql = "SELECT count(*) AS cnt FROM $db_inquiry WHERE title LIKE ? AND date_value LIKE ? ";
$stmt2 = mysqli_stmt_init($conn); //preparedstatement 초기화
//total_sql문 preparedStatement 적용
$stmt2 = mysqli_prepare($conn, $total_sql);
mysqli_stmt_bind_param($stmt2, 'ss', $search_value , $date_value_value); //s는 string, i는 정수형을 뜻한다
mysqli_stmt_execute($stmt2); //실행
$total_result = mysqli_stmt_get_result($stmt2);
$total_row = mysqli_fetch_assoc($total_result); //결과를 배열로 가져온다
$total_posts = $total_row['cnt']; //배열 중 cnt의 값을 가져온다
//전체 페이지 수
$total_pages = ceil($total_posts / $num_per_page);
//각 페이지 시작 인덱스
$start = ($page - 1) * $num_per_page;
//정렬해주는 조건문
if (isset($_GET['sort'])) {
$sort = mysqli_real_escape_string($conn, filter_var(strip_tags($_GET['sort']),FILTER_SANITIZE_SPECIAL_CHARS));
if ($sort == 'date') {
//날짜순
$sql .= " ORDER BY date_value DESC";
} else if ($sort == 'author') {
//작성자순
$sql .= " ORDER BY id DESC";
}
}
$sql .= " LIMIT $start, $num_per_page"; //최대 5개씩 호출
$stmt = mysqli_stmt_init($conn); //preparedstatement 초기화
//쿼리문 실행 preparedstatement 적용
$stmt = mysqli_prepare($conn,$sql);
mysqli_stmt_bind_param($stmt, 'ss', $search_value , $date_value_value); //s는 string, i는 정수형을 뜻한다
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
if(mysqli_num_rows($result) > 0) {
//게시물 출력
while($row = mysqli_fetch_assoc($result)) {
$index = $row['board_id'];
$id = $row['user_id'];
$title = $row['title'];
$date = $row['date_value'];
echo '
<div class="board-main">
<div class = "board-main1">
<a href="view_board.php?index='.$index.'">'.$title.'</a>
</div>
<div class = "board-main2">
'.$id.'
</div>
<div class = "board-main3">
'.$date.'
</div>
</div>
';
}
} else {
echo "게시물이 없습니다!";
}
?>
<div class = "paging-num">
<?php
echo ' [ ';
// 현재 페이지를 10으로 나눈 몫에 10을 곱한 값에서 1을 빼면
// 현재 페이지가 몇 번째 페이지 블록에 있는지 알 수 있습니다.
$block_start = floor(($page-1)/10)*10;
if ($block_start > 1) {
// 이전 페이지 블록이 있다면, 다음 버튼을 출력합니다.
$next_block_start = $block_start - 10;
if($next_block_start == 0) {
$next_block_start += 1; //0페이지는 존재 하지 않기에 1더한다
}
echo '<a href="?page=' . $next_block_start .'"><< </a>';
}
// 이전 버튼 출력
if ($page > 1) {
echo '<a href="?page=' . ($page-1) .'">< </a> ';
}
// 페이지 링크 출력
for ($i = $block_start+1; $i <= min($block_start+10, $total_pages); $i++) {
if($i == $page) {
echo '<strong>'.$i.' </strong>';
} else {
echo '<a href="?page=' . $i .'">'.$i. '</a> ';
}
echo ' ';
}
// 다음 버튼 출력
if ($page < $total_pages) {
echo '<a href="?page=' . ($page+1) .'">> </a> ';
}
if ($block_start+10 < $total_pages) {
// 다음 페이지 블록이 있다면, 다음 버튼을 출력합니다.
$next_block_start = $block_start + 11;
echo '<a href="?page=' . $next_block_start .'">>></a>';
}
echo ' ]</p>';
mysqli_stmt_close($stmt); //preparedstatement 종료
mysqli_stmt_close($stmt2);
?>
</div>
</p>
<p></p>
<form action="inquiry_write_board.php" method="POST">
<p><input type="submit" name="write" value="게시판 작성"></p>
</form>
<form action="login.php">
<p><input type="submit" value="로그인페이지로"></p>
</form>
<form action="inquiry_board.php" method="GET">
<p><input type="submit" value="검색 초기화"></p>
<input type="hidden" name="search" value="">
<input type="hidden" name="sort" value="">
<input type="hidden" name="date_value" value="">
</form>
</body>
</html>
-inquiry_write_board.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>문의게시판 작성 중</title>
<link rel="stylesheet" href = "/css/style_write.css">
</head>
<body>
<h1>문의게시판 작성!</h1>
<div class='form-0'>
<form class='form-1' action="inquiry_write_process_board.php" method="POST">
<input class='write-1' type="text" name="title" maxlegth="44" placeholder="제목 입력, 최대 44자까지 가능합니다" required>
<hr>
<textarea class='write-2' name="detail" rows="20" cols="20" maxlength="254" placeholder="내용 작성,최대 254자 가능합니다" required></textarea>
<hr>
<div class='inqu-write'>
<input class='write-3-1' type="text" name="user_id" placeholder="ID" required>
<input class='write-3-2' type="password" name="pw" maxlegth="44" placeholder="PW" required>
</div>
<hr>
<input class='write-4' type="submit" value="올리기">
</form>
<form action="inquiry_board.php">
<input class='write-5' type="submit" value="돌아가기">
</form>
<?php session_start();
if (isset($_SESSION['write_error'])) {
echo $_SESSION['write_error'];
unset($_SESSION['write_error']);
}
?>
</div>
</body>
</html>
-style_wrtie.css
body{
background-color:#f5f6f7;
}
h1 {
text-align: center;
padding: 10px 10px;
padding-bottom: 30px;
border-bottom:1px solid #848484;
}
.form-0 {
position: relative;
}
.board-top {
width : 80%;
height: 50px;
margin: 0 auto;
max-width: 100%;
}
hr{
width: 100%;
}
.form-1 {
display: flex;
flex-direction: column;
width: 1200px;
margin: 0 auto;
}
.write-1 {
height: 50px;
border : none;
font-size: 40px;
background-color: #f5f6f7;
outline: none;
}
.write-2 {
margin-top: 30px;
font-size: 15px;
border: none;
background-color: #f5f6f7;
outline: none;
}
.write-3 {
margin-top: 10px;
}
.write-4 {
margin-top: 10px;
width: 70px;
height: 30px;
border: none;
background-color: #f5f6f7;
Cursor:pointer;
}
.write-5 {
position: absolute;
bottom: 0;
left: 200px;
width: 70px;
height: 30px;
border: none;
background-color: #f5f6f7;
Cursor:pointer;
}
/*문의 게시판 id랑 pw css class 입니다.*/
.inqu-write {
display: flex;
}
.write-3-1 {
width: 100px;
height: 30px;
margin-right: 10px;
}
.write-3-2 {
width: 100px;
height: 30px;
}
-view_inquiry_board.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Welcome!</title>
<link rel="stylesheet" href = "/css/style_board.css">
</head>
<body>
<h1>INQUIRY_MENU</h1>
<?php
include 'DB_INFO.php'; //데이터 베이스 정보
//데이터베이스 연결
$conn = mysqli_connect($host,$username,$password,$db_inquiry);
//데이터베이스 오류시 종료
if(mysqli_connect_errno()) {
die("데이터 베이스 오류: ". mysqli_connect_error());
}
session_start(); //세션 시작
?>
<form method ="GET" action="inquiry_board.php" class="board-top">
<input type = "text" name="search" class="board-top1" value="<?php echo filter_var(strip_tags($_GET['search']),FILTER_SANITIZE_SPECIAL_CHARS);?>" placeholder="검색" >
<input type="submit" value="검색" class="board-top2">
<select name="sort" onchange="this.form.submit()">
<option value="">정렬 방식 선택</option>
<option value="date" <?php if(filter_var(strip_tags($_GET['sort']),FILTER_SANITIZE_SPECIAL_CHARS)=='date'){echo ' selected';} ?> >날짜순</option>
<option value="author" <?php if(filter_var(strip_tags($_GET['sort']),FILTER_SANITIZE_SPECIAL_CHARS)=='author'){echo ' selected';} ?> >작성자순</option>
</select>
<label for="date">날짜 선택:</label>
<input type="date" id="date_value" name="date_value" value="<?php echo isset($_GET['date_value']) ? $_GET['date_value'] : ''; ?>">
</form>
<div class = "board-title-bar">
<div class= "board-title-bar1">제목</div>
<div class= "board-title-bar2">작성자</div>
<div class= "board-title-bar3">날짜</div>
</div>
<?php
//한 페이지에 보여줄 게시물 수
$num_per_page = 5;
//현재 페이지 번호
if(isset($_GET['page'])) {
$page = mysqli_real_escape_string($conn,filter_var(strip_tags(intval($_GET['page'])),FILTER_SANITIZE_SPECIAL_CHARS));
} else {
$page = 1;
}
//검색이 입력된 경우
if(isset($_GET['search'])) {
$search = filter_var(strip_tags($_GET['search']),FILTER_SANITIZE_SPECIAL_CHARS);
if(isset($_GET['date_value']) && strtotime($_GET['date_value'])) {
//날짜 선택한 경우, strtotime() 이용해 유효한 값인지 확인
$date_value = filter_var(strip_tags($_GET['date_value']),FILTER_SANITIZE_SPECIAL_CHARS);
$date_value = DateTime::createFromFormat('Y-m-d', $date_value)->format('Y-m-d'); //날짜 값으로 다시 바꾼다
}
else {
//날짜가 선택이 안된 경우
$date_value = '';
}
} else {
//검색이 입력되지 않은 경우
$search = '';
$date_value = '';
}
//각 %을 붙여서 포함 된 문자열을 찾을 수 있게 한다
$search_value = '%'.$search.'%';
$date_value_value = '%'.$date_value.'%';
$sql = "SELECT * FROM $db_inquiry WHERE title LIKE ? AND date_value LIKE ? ";
$total_sql = "SELECT count(*) AS cnt FROM $db_inquiry WHERE title LIKE ? AND date_value LIKE ? ";
$stmt2 = mysqli_stmt_init($conn); //preparedstatement 초기화
//total_sql문 preparedStatement 적용
$stmt2 = mysqli_prepare($conn, $total_sql);
mysqli_stmt_bind_param($stmt2, 'ss', $search_value , $date_value_value); //s는 string, i는 정수형을 뜻한다
mysqli_stmt_execute($stmt2); //실행
$total_result = mysqli_stmt_get_result($stmt2);
$total_row = mysqli_fetch_assoc($total_result); //결과를 배열로 가져온다
$total_posts = $total_row['cnt']; //배열 중 cnt의 값을 가져온다
//전체 페이지 수
$total_pages = ceil($total_posts / $num_per_page);
//각 페이지 시작 인덱스
$start = ($page - 1) * $num_per_page;
//정렬해주는 조건문
if (isset($_GET['sort'])) {
$sort = mysqli_real_escape_string($conn, filter_var(strip_tags($_GET['sort']),FILTER_SANITIZE_SPECIAL_CHARS));
if ($sort == 'date') {
//날짜순
$sql .= " ORDER BY date_value DESC";
} else if ($sort == 'author') {
//작성자순
$sql .= " ORDER BY id DESC";
}
}
$sql .= " LIMIT $start, $num_per_page"; //최대 5개씩 호출
$stmt = mysqli_stmt_init($conn); //preparedstatement 초기화
//쿼리문 실행 preparedstatement 적용
$stmt = mysqli_prepare($conn,$sql);
mysqli_stmt_bind_param($stmt, 'ss', $search_value , $date_value_value); //s는 string, i는 정수형을 뜻한다
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
if(mysqli_num_rows($result) > 0) {
//게시물 출력
while($row = mysqli_fetch_assoc($result)) {
$index = $row['board_id'];
$id = $row['user_id'];
$title = $row['title'];
$date = $row['date_value'];
echo '
<div class="board-main">
<div class = "board-main1">
<a href="view_inquiry_board.php?index='.$index.'">'.$title.'</a>
</div>
<div class = "board-main2">
'.$id.'
</div>
<div class = "board-main3">
'.$date.'
</div>
</div>
';
}
} else {
echo "게시물이 없습니다!";
}
?>
<div class = "paging-num">
<?php
echo ' [ ';
// 현재 페이지를 10으로 나눈 몫에 10을 곱한 값에서 1을 빼면
// 현재 페이지가 몇 번째 페이지 블록에 있는지 알 수 있습니다.
$block_start = floor(($page-1)/10)*10;
if ($block_start > 1) {
// 이전 페이지 블록이 있다면, 다음 버튼을 출력합니다.
$next_block_start = $block_start - 10;
if($next_block_start == 0) {
$next_block_start += 1; //0페이지는 존재 하지 않기에 1더한다
}
echo '<a href="?page=' . $next_block_start .'"><< </a>';
}
// 이전 버튼 출력
if ($page > 1) {
echo '<a href="?page=' . ($page-1) .'">< </a> ';
}
// 페이지 링크 출력
for ($i = $block_start+1; $i <= min($block_start+10, $total_pages); $i++) {
if($i == $page) {
echo '<strong>'.$i.' </strong>';
} else {
echo '<a href="?page=' . $i .'">'.$i. '</a> ';
}
echo ' ';
}
// 다음 버튼 출력
if ($page < $total_pages) {
echo '<a href="?page=' . ($page+1) .'">> </a> ';
}
if ($block_start+10 < $total_pages) {
// 다음 페이지 블록이 있다면, 다음 버튼을 출력합니다.
$next_block_start = $block_start + 11;
echo '<a href="?page=' . $next_block_start .'">>></a>';
}
echo ' ]</p>';
mysqli_stmt_close($stmt); //preparedstatement 종료
mysqli_stmt_close($stmt2);
?>
</div>
</p>
<p></p>
<form action="inquiry_write_board.php" method="POST">
<p><input type="submit" name="write" value="게시판 작성"></p>
</form>
<form action="login.php">
<p><input type="submit" value="로그인페이지로"></p>
</form>
<form action="inquiry_board.php" method="GET">
<p><input type="submit" value="검색 초기화"></p>
<input type="hidden" name="search" value="">
<input type="hidden" name="sort" value="">
<input type="hidden" name="date_value" value="">
</form>
</body>
</html>
-inquiry_fix_process_board.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>게시판 수정 중</title>
<link rel="stylesheet" href = "/css/style_write.css">
</head>
<body>
<h1>문의글 수정</h1>
<?php
include 'DB_INFO.php'; //데이터 베이스 정보
session_start();
//데이터베이스 연결
$conn = mysqli_connect($host,$username,$password,$db_inquiry);
//데이터베이스 오류시 종료
if(mysqli_connect_errno()) {
die("데이터 베이스 오류: ". mysqli_connect_error());
}
//GET방식으로 board_id 받기
$board_id = filter_var(strip_tags($_GET['board_id']),FILTER_SANITIZE_SPECIAL_CHARS);
//작성된 게시물들 조회 문
$sql = "SELECT * FROM $db_inquiry WHERE board_id = ? ";
$stmt = mysqli_prepare($conn,$sql);
mysqli_stmt_bind_param($stmt, 'i' , $board_id);
mysqli_stmt_execute($stmt);
//결과값 옮기기
$result = mysqli_stmt_get_result($stmt);
//결과값 가져오기
$row = mysqli_fetch_assoc($result);
if(isset($_POST['pw'])) {
//비밀번호 값을 가져온다
$hashed_pw = $row['pw'];
if(password_verify($_POST['pw'],$hashed_pw)) {
//비밀번호가 맞으면
echo "
<div class='form-0'>
<form class='form-1' action='inquiry_write_process_board.php' method='POST'>
<input class='write-1' type='text' name='title' maxlength='44' value='".$row['title']."' placeholder='제목 입력, 최대 44자까지 가능합니다' required>
<hr>
<textarea class='write-2' name='detail' rows='20' cols='20' maxlength='254' placeholder='내용 작성,최대 254자 가능합니다' required>".$row['detail']."</textarea>
<hr>
<div class='inqu-write'>
<input class='write-3-1' type='text' name='user_id' maxlength='44' value='".$row['user_id']."' placeholder='ID' required>
<input class='write-3-2' type='password' name='pw' maxlength='44' value='".$row['user_pw']."' placeholder='PW' required>
</div>
<hr>
<input class='write-4' type='submit' value='수정하기'>
<input type='hidden' name='board_id' value='".$row['board_id']."'>
</form>
</div>
";
} else {
//비밀번호 틀린경우
$_SESSION['write_error'] = '비밀번호가 틀립니다!';
header("Location: view_inquiry_board.php?index=".$board_id);
exit();
}
} else {
echo "<form method='POST' action='inquiry_fix_process_board.php?board_id=$board_id'>
<input type='password' name='pw' value=''>
<button type='submit'>인증하기</button>
</form>";
}
mysqli_stmt_close($stmt); //preparedstatement 종료
?>
<p>
</p>
</body>
</html>
-inquiry_delete_board.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>게시판 삭제</title>
<link rel="stylesheet" href = "/css/style_write.css">
</head>
<body>
<?php
include 'DB_INFO.php'; //데이터 베이스 정보
session_start(); //세션 시작
//게시판 데이터베이스 연결
$conn = mysqli_connect($host,$username,$password, $db_inquiry);
//데이터베이스 오류시 종료
if(mysqli_connect_errno()) {
die("데이터 베이스 오류: ". mysqli_connect_error());
}
//POST로 전달된 정보 받기
$board_id = filter_var(strip_tags($_GET['board_id']),FILTER_SANITIZE_SPECIAL_CHARS);
//삭제용 sql문 작성
$sql = "DELETE FROM $db_inquiry WHERE board_id= ? ";
//비밀번호 조회용 sql문 작성
$sql_pw = "SELECT pw FROM $db_inquiry WHERE board_id= ? ";
$stmt = mysqli_prepare($conn,$sql); //삭제용sql
$stmt2 = mysqli_prepare($conn,$sql_pw); //비밀번호sql
mysqli_stmt_bind_param($stmt , 'i' , $board_id);
mysqli_stmt_bind_param($stmt2, 'i' , $board_id);
mysqli_stmt_execute($stmt2); //비밀번호부터 실행
//실행(비밀번호)
$result = mysqli_stmt_get_result($stmt2);
//결과값 가져오기
$row = mysqli_fetch_assoc($result);
if(isset($_POST['pw'])) {
//비밀번호 값을 가져온다
$hashed_pw = $row['pw'];
if(password_verify($_POST['pw'],$hashed_pw)) {
//실행
if(mysqli_stmt_execute($stmt)) {
//실행 후 게시판으로 이동
header("Location: inquiry_board.php");
} else {
//오류 발생 시 메시지 호출
$_SESSION['write_error'] = '삭제하는데 실패했습니다! 조금 있다 하십시오';
header("Location: view_inquiry_board.php?index=$board_id");
}
} else {
//비밀번호 틀린경우
$_SESSION['write_error'] = '비밀번호가 틀립니다!';
header("Location: view_inquiry_board.php?index=$board_id");
}
} else {
echo "<form method='POST' action='inquiry_delete_board.php?board_id=$board_id'>
<input type='password' name='pw' value=''>
<p><button type='submit'>인증하기</button></p>
</form>";
}
mysqli_stmt_close($stmt); //preparedstatement 종료
mysqli_stmt_close($stmt2);
exit();
?>
</body>
</html>
전부 기존에 있던 css 파일을 이용해서 추가 코딩을 했습니다.
이렇게 해서.. 게시판은 전부 꾸몄습니다. 다음에 마이 페이지 간단하게 꾸미고 끝내면 되겠네요!
감사합니다.
'개발과제' 카테고리의 다른 글
게시판 마무리 (10) | 2023.06.16 |
---|---|
마이페이지 CSS 꾸미기 (0) | 2023.06.14 |
CSS 꾸미기 게시판 작성 페이지 (0) | 2023.06.12 |
[노말틱 모의 해킹 취업반 추가 개발과제 ] css - 게시판 보기 (0) | 2023.05.27 |
[노말틱 모의 해킹 취업반 추가 개발과제 ] css - 게시판 꾸미기 (3) | 2023.05.17 |