12 장 가입인사 게시판 제작

12장가입인사 게시판 제작

IT CookBook,PHP 웹 프로그래밍 입문 ( 개정판 )

[ 강의교안 이용 안내 ]• 본 강의교안의 저작권은 한빛아카데미㈜에 있습니다 . • 이 자료를 무단으로 전제하거나 배포할 경우 저작권법 136 조에 의거하여 최고 5 년

이하의 징역 또는 5 천만원 이하의 벌금에 처할 수 있고 이를 병과 ( 倂科 ) 할 수도 있습니다 .

학습목표 게시판 구현하는 방법 숙지 HTML 글 쓰기 처리 게시판 검색 기능 구현 특정 사용자에게만 권한 부여 게시판 글 저장 및 수정

목차1. 가입인사 게시판의 개요2. DB 테이블 설계 및 생성3. 글 목록확인4. 글 작성5. 글 내용 확인6. 글 내용 수정

1.1 결과 화면과 요구사항

[ 그림 12-1] 가입인사 게시판의 글 목록 페이지

1.1 결과 화면과 요구사항• 요구사항

페이지 번호가 표시된 글 목록 페이지 조회수 표시 글 내용 보기 내용 검색 HTML 쓰기 가능 글 수정 글 / 수정 글 정장 ( 한 파일에서 처리 ) 작성자와 관리자만 글 수정 및 삭제 가능

1.2 준비 파일과 페이지 구성

구분 파일 / 폴더명 기능

데이터베이스 greet.sql 가입인사 데이터베이스 테이블 생성

페이지

list.php 글 목록 페이지

write_form.php 글쓰기 페이지

view.php 글 내용 보기 페이지

modify_form.php

글 수정 페이지

기능insert.php 글 저장 ( 수정 포함 )

delete.php 글 삭제

[ 표 12-1] 가입인사 게시판 제작 실습에 사용하는 파일 목록


[ 그림 12-2] 글 목록 페이지의 구성


[ 그림 12-3] 글쓰기 페이지의 구성


[ 그림 12-4] 글 내용 보기 페이지의 구성


[ 그림 12-5] 글 수정 페이지의 구성


[ 그림 12-6] 가입인사 게시판의 페이지와 기능 흐름

2. DB 테이블 설계 및 생성

필드명 형식 추가 사항 설명

num intnot null, auto_increment, pri-mary key

일련번호

id char(15) not null 아이디

name char(10) not null 이름

nick char(10) not null 닉네임

subject char(100)

not null 제목

content text not null 글 내용

regist_day char(20) 작성일 및 시간

hit int 조회수

is_html char(1) HTML 쓰기

[ 표 12-2] 가입인사 게시판 데이터베이스 테이블 ( 테이블명 : greet)

greet 데이터베이스 테이블 생성 greet.sql

create table greet ( num int not null auto_increment, id char(15) not null, name char(10) not null, nick char(10) not null, subject char(100) not null, content text not null, regist_day char(20), hit int, is_html char(1), primary key(num) );

3. 글 목록 확인

[ 그림 12-9] 글 목록 페이지

예제 12-1 가입인사 게시판의 글 목록 페이지 list.php

001 <?002 session_start();003 ?>004 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">005 <html>006 <head>007 <meta charset="euc-kr">008 <link href="../css/common.css" rel="stylesheet" type="text/css" media="all">009 <link href="../css/greet.css" rel="stylesheet" type="text/css" media="all">010 </head>011 <?012 include "../lib/dbconn.php";013014 $scale=10; // 한 화면에 표시되는 글의 개수015


016 if($mode= ="search") // 검색 모드017 {018 if(!$search)019 {020 echo("021 <script>022 window.alert(' 검색할 단어를 입력해 주세요 !');023 history.go(-1);024 </script>025 ");026 exit;027 }028029 $sql="select * from greet where $find like '%$search%' order by num desc";030 }


031 else // 글 목록 보기 모드032 {033 $sql="select * from greet order by num desc";034 }035 036 $result=mysql_query($sql, $connect);037038 $total_record=mysql_num_rows($result); 039 040 // 전체 페이지 수 ($total_page) 계산041 if($total_record % $scale==0) 042 $total_page=floor($total_record/$scale); 043 else044 $total_page = floor($total_record/$scale) + 1; 045046 if(!$page) // 현재 화면에 표시되는 페이지를 의미하는047 $page=1; // $page 가 0 이라면 1 로 초기화048

049 // 표시할 페이지 ($page) 에 따라 $start 계산050 $start=($page - 1) * $scale; 051052 $number=$total_record - $start;053 ?>054 <body>

074 075 <form name="board_form" method="post" action="list.php?mode=search"> 076 <div id="list_search">077 <div id="list_search1">▷ 총 <?= $total_record ?> 개의 게시물이 있습니다 . </div>078 <div id="list_search2"> <img src="../img/select_search.gif"></div>079 <div id="list_search3">080 <select name="find">081 <option value='subject'> 제목 </option>082 <option value='content'> 내용 </option>083 <option value='nick'> 닉네임 </option>084 <option value='name'> 이름 </option>085 </select></div>

079 <div id="list_search3">080 <select name="find">081 <option value='subject'> 제목 </option>082 <option value='content'> 내용 </option>083 <option value='nick'> 닉네임 </option>084 <option value='name'> 이름 </option>085 </select></div> 086 <div id="list_search4"><input type="text" name="search"></div>087 <div id="list_search5"><input type="image“ src="../img/list_search_button.gif"></div>088 </div> 089 </form>091 <div class="clear"></div>

092 <div id="list_top_title">093 <ul>094 <li id="list_title1"><img src="../img/list_title1.gif"></li>095 <li id="list_title2"><img src="../img/list_title2.gif"></li>096 <li id="list_title3"><img src="../img/list_title3.gif"></li>097 <li id="list_title4"><img src="../img/list_title4.gif"></li>098 <li id="list_title5"><img src="../img/list_title5.gif"></li>099 </ul>100 </div> 101102 <div id="list_content">103 <? // 글 목록 출력104 for($i=$start; $i<$start+$scale && $i<$total_record; $i++)105 {106 // 가져올 레코드로 위치 ( 포인터 ) 이동107 mysql_data_seek($result, $i); 108


109 // 하나의 레코드 가져오기110 $row = mysql_fetch_array($result); 111 112 $item_num=$row[num];113 $item_id=$row[id];114 $item_name=$row[name];115 $item_nick=$row[nick];116 $item_hit=$row[hit];117 $item_date=$row[regist_day];118 $item_date=substr($item_date, 0, 10); 119 $item_subject=str_replace(" ", " ", $row[subject]);120 ?>121 <div id="list_item">122 <div id="list_item1"><?= $number ?></div>123 <div id="list_item2"> <a href="view.php?num=<?=$item_num?> &page=<?=$page?>"><?= $item_subject ?></a></div>124 <div id="list_item3"><?= $item_nick ?></div>125 <div id="list_item4"><?= $item_date ?></div>126 <div id="list_item5"><?= $item_hit ?></div>127 </div> <!– end of list_item -->


128 <?129 $number--;130 }131 ?>132 <div id="page_button">133 <div id="page_num"> ◀ 이전 134 <?135 // 게시판 목록 하단에 페이지 번호 출력 ( 페이지 링크 )136 for($i=1; $i<=$total_page; $i++)137 {138 if($page==$i) // 현재 페이지 번호 링크 안함139 {140 echo "<b> $i </b>";141 }142 else143 { 144 echo "<a href='list.php?page=$i'> $i </a>";145 } 146 }147 ?>

148 다음 ▶149 </div> 150 <div id="button">151 <a href="list.php?page=<?=$page?>"><img src="../img/list.png"></a> 152 <?153 if($userid)154 {155 ?>156 <a href="write_form.php"><img src="../img/write.png"></a>157 <?158 }159 ?>

167 168 </body>169 </html>

substr() 함수• 형식 string substr (string $string, int $start, [int $length]) - 첫 번째 인자 : 대상 문자열 - 두 번째 인자 : 시작 지점 - 세 번째 인자 : 가져올 문자의 개수

• 기능 substr() 함수는 첫 번째 인자인 $string 에서 두 번째 인자인 $start 부터 세 번째 인자인 $lengh 개수 만큼 문자열 일부를 가져와 그 문자열을 반환한다 .

• 사용 예 <? $a="I am happy"; $b = substr($a, 6, 4); echo $b; // 실행 결과 : appy ?>

• 참고사항 substr() 의 두 번째 인자는 0 부터 시작된다 . 위의 예처럼 두 번째 인자가 6 이라면 , 7 번째 문자인 a 부터 y 까지 네 개의 문자 ‘ appy’ 를 가져와 출력한다 .

4.1 글쓰기 페이지 생성

[ 그림 12-10] 글쓰기 페이지

예제 12-2 가입인사 게시판의 글쓰기 페이지 write_form.php

01 <? 02 session_start(); 03 ?>04 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">05 <html>06 <head>07 <meta charset="euc-kr">08 <link href="../css/common.css" rel="stylesheet" type="text/css" me-dia="all">09 <link href="../css/greet.css" rel="stylesheet" type="text/css" me-dia="all">10 </head>11 12 <body>

39 <form name="board_form" method="post" action="insert.php"> 40 <div id="write_form">41 <div class="write_line"></div>42 <div id="write_row1">43 <div class="col1"> 닉네임 </div>44 <div class="col2"><?=$usernick?></div>

45 <div class="col3"><input type="checkbox" name="html_ok" value="y"> HTML 쓰기 </div>46 </div> 47 <div class="write_line"></div>48 <div id="write_row2"><div class="col1"> 제목 </div>49 <div class="col2"><input type="text" name="subject"></div>50 </div>51 <div class="write_line"></div>52 <div id="write_row3"><div class="col1"> 내용 </div>53 <div class="col2"><textarea rows="15" cols="79" name="content"></textarea></div>54 </div>55 <div class="write_line"></div>56 </div> 5758 <div id="write_button"><input type="image" src="../img/ok.png"> 59 <a href="list.php?page=<?=$page?>"><img src="../img/list.png"></a>60 </div> 61 </form>62

63 </div> 64 </div> 65 </div> 6667 </body>68 </html>

예제 12-3 가입인사 글 저장 insert.php

37 $regist_day=date("Y-m-d (H:i)"); // 현재의 ' 년 - 월 - 일- 시 - 분 ' 을 저장 38 include "../lib/dbconn.php"; // dbconn.php 파일을 불러옴39 40 if($mode=="modify")41 {42 $sql="update greet set subject='$subject', content='$content' where num=$num";43 }44 else45 {46 if($html_ok=="y")47 {48 $is_html = "y";49 }

예제 12-3 가입인사 글 저장 insert.php

50 else51 {52 $is_html="";53 $content=htmlspecialchars($content);54 }5556 $sql="insert into greet (id, name, nick, subject, content, regist_day, hit, is_html) ";57 $sql.="values('$userid', '$username', '$usernick', '$subject', '$content', '$regist_day', 0, '$is_html')";58 }59 60 mysql_query($sql, $connect); // $sql 에 저장된 명령 실행61 mysql_close(); // 데이터베이스 연결 끊기62 63 echo ("64 <script>65 location.href = 'list.php?page=$page';66 </script>67 ");68 ?>

htmlspecialchars() 함수 • 형식 string htmlspecialchars(string $string)

• 기능 htmlspecialchars() 함수는 $string 의 내용 중에서 HTML 특수문자를 HTML 코드로 변경한다 . 예를 들어 & 와 같은 기호가 화면에 그대로 나올 수 있도록 &amp 로 변경한다 . 변경되는 문자들은 다음과 같다 .

• & (ampersand) → &• " (double quote) → "• ' (single quote) → '• < (less than) → <• > (greater than) → >

5.1 글 내용 보기 페이지 생성

[ 그림 12-12] 글 내용 보기 페이지

예제 12-4 가입인사 게시판의 글 내용 보기 페이지 view.php

001 <? 002 session_start();003 004 include "../lib/dbconn.php";005 006 $sql="select * from greet where num=$num";007 $result=mysql_query($sql, $connect);008009 // 하나의 레코드 가져오기010 $row=mysql_fetch_array($result); 011 012 $item_num=$row[num];013 $item_id=$row[id];014 $item_name=$row[name];015 $item_nick=$row[nick];016 $item_hit=$row[hit];


017 $item_date=$row[regist_day];018 $item_subject=str_replace(" ", " ", $row[subject]);019 $item_content=$row[content];020 $is_html=$row[is_html];021022 if($is_html!="y")023 {024 $item_content=str_replace(" ", " ", $item_content);025 $item_content=str_replace("\n", "<br>", $item_content);026 }027028 // 글 조회수 증가029 $new_hit=$item_hit + 1; 030 $sql="update greet set hit=$new_hit where num=$num"; 031 mysql_query($sql, $connect);032 ?>033 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">034 <html>035 <head>

036 <meta charset="euc-kr">037 <link href="../css/common.css" rel="stylesheet" type="text/css" media="all">038 <link href="../css/greet.css" rel="stylesheet" type="text/css" media="all">039 <script>040 function del(href) 041 {042 if(confirm(" 한번 삭제한 자료는 복구할 방법이 없습니다 .\n\n 정말 삭제하시겠습니까 ?"))043 { 044 document.location.href=href;045 }046 }047 </script>048 </head>049050 <body>

075 <div id="view_title">076 <div id="view_title1"><?=$item_subject ?></div> <div id="view_title2"><?=$item_nick ?>| 조회 : <?=$item_hit ?>|<?= $item_date ?> </div>077 </div> 078079 <div id="view_content">080 <?= $item_content ?>081 </div> 082 083 <div id="view_button">084 <a href="list.php?page=<?=$page?>"> <img src="../img/list.png"></a> 085 <? 086 if($userid==$item_id or $userid=="admin")087 {088 ?>


089 <a href="modify_form.php?num=<?=$num?>&page=<?=$page?>"> <img src="../img/modify.png"></a> 090 <a href="javascript:del('delete.php?num=<?=$num?>')"> <img src="../img/delete.png"></a> 091 <?092 }093 ?>094 <? 095 if($userid)096 {097 ?>098 <a href="write_form.php"><img src="../img/write.png"></a>099 <?100 }101 ?>

102 </div> 103 104 <div class="clear"></div>105 </div> 106 </div> 107 </div> 108 109 </body>110 </html>

6. 글 내용 수정

[ 그림 12-14] 글 수정 페이지

예제 12-6 가입인사 게시판의 글 수정 페이지 modify_form.php

01 <? 02 session_start(); 03 include "../lib/dbconn.php";0405 $sql="select * from greet where num=$num";06 $result=mysql_query($sql, $connect);07 08 $row=mysql_fetch_array($result); 09 $item_subject=$row[subject];10 $item_content=$row[content];11 ?>12 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">13 <html>

20 <body>

48 <div class="clera"></div>49 <form name="board_form" method="post" action="insert.php?mode=modify&num=<?=$num?>&page=<?=$page?>"> 50 <div id="write_form">51 <div class="write_line"></div>52 <div id="write_row1">53 <div class="col1"> 닉네임 </div>54 <div class="col2"><?=$usernick?></div>55 </div> ???56 <div class="write_line"></div>57 <div id="write_row2"><div class="col1"> 제목 </div>58 <div class="col2"><input type="text" name="subject“ value="<?=$item_subject?>" ></div>59 </div>60 <div class="write_line"></div>61 <div id="write_row3"><div class="col1"> 내용 </div>62 <div class="col2"><textarea rows="15" cols="79“ name="content"><?=$item_content?></textarea></div>63 </div>

64 <div class="write_line"></div>65 </div>6667 <div id="write_button"><input type="image" src="../img/ok.png"> 68 <a href="list.php?page=<?=$page?>"><img src="../img/list.png"></a>69 </div> 70 </form>71 72 </div> 73 </div> 74 </div> 75 76 </body>77 </html>

12 장 가입인사 게시판 제작

Documents