요기보드3   필수기초 선택과목 요기보드 그누보드 로그인

요기보드 Ver.3


공지사항 ( notice.php )

이번에는 조금 더 복잡한 화면을 분석해 보자구.
요기보드 상단 메뉴의 [게시판]을 클릭하면 공지사항 페이지로 이동하는 것을 볼 수 있어.
이때, 브라우저의 주소를 보면 http://홈피주소/notice.php 를 보면 notice.php가 만든 웹페이지라는 것을 짐작할 수 있겠지?
에디터로 이 파일을 열어 봐.


<?php
include_once('./_path.php');
$current_menu = '게시판' ;  // 메인메뉴
$catno = 10;  // 공지사항 게시판분류 번호
$results_per_page = 10 ;     // 페이지당 게시글 출력수
$write_level = 8 ;          // 쓰기권한 회원등급
include_once('menu_sub.php') ;
include_once('layout2.php');  // 2단 레이아웃
?>
    <h3>공지사항</h3>
    <hr>
<?php
include_once(YOGI_DIR . '/bbs.php');  // 게시판삽입
?>
<!--- layout2 에서 열었던 div 닫기 --->
    </div> <!-- col 9 -->
</div> <!-- row -->
</div> <!-- container -->
<?php
include_once('footer.php');
?>

화면은 복잡한데 코드는 앞서 배운 index.php 와 비슷하네?
앞서 배운 바 대로 각 담당 부분을 모두 include_once()로 불러왔기 때문이야.
한 줄씩 파악해 보자구.

▶ $current_menu = '게시판' ; // 메인메뉴
$current_menu 에 '게시판' 이라는 주메뉴의 이름을 넣었어.
이것은 몇 줄 아래의 include_once('menu_sub.php') 에서 사용하게 되는데 주메뉴에 따라 서브메뉴(사이드메뉴)를 찾아가기 위한 변수야.
그 자리 갔을 때 설명할께.

▶ $catno = 10; // 게시판분류 번호
$catno 는 Category No 라는 뜻으로 각 게시판의 고유 분류번호를 뜻해.
예를들어 10 번은 '공지사항'의 고유번호, 11 번은 '자유게시판'의 고유번호.. 이런식으로 게시판을 만들 때 마다 고유번호가 필요하거든.

요기보드에서 모든 게시판은 yg_bbs 라는 단 1 개의 테이블만 사용해.
그런데 회원들이 게시글을 적을 때 공지사항에서 적었으면 10 번이 들어가고, 자유게시판에서 적었으면 11 번이 들어가야 해.
이 분류번호를 이용해 공지사항을 보여 줄 때는 게시글에서 catno = 10 인 게시글만 뽑아서 보여 주면 되겠지?
바로 이런 용도로 사용하는 변수야.

게시판이 많아지면 "어디가 몇 번이더라? 몇 번까지 사용했지?" 헷갈릴 수 있으니 게시판에 따른 번호는 [관리자 전용게시판]에 적어 두는게 관리하기 편할거야.
이 $catno 는 아래쪽 bbs.php 에서 사용하게 될거야.

▶ $results_per_page = 10
게시판에서 게시글 들을 출력할 때 한 번에 몇개 씩 보여 줄지를 설정해.
10 으로 했으면 10 개만 보여 주고 10 개가 넘으면 아래 쪽에 [1][2][3]. . .같은 페이지 링크로 표시해.

▶ $write_level = 8
$write_level 은 이 게시판에서 글쓰기를 할 수 있는 회원의 권한이야.
현재 공지사항은 8 로 되어 있는데 일반 회원들도 공지사항에 글을 쓰게 하려면 값을 2 로 하면 돼.
(회원가입하면 기본 등급이 2 이거든)
보통 공지사항은 관리자급에서만 작성을 하기 때문에 기본설치에서는 8 로 지정했어.
회원 등급이 8 보다 크면 게시판 상단에 [글쓰기] 버튼이 보이고, 1~7 까지는 버튼이 안 보여서 글을 작성할 수 없어.

▶ include_once('menu_sub.php')
앞서 1단 페이지 형태인 index.php 와 intro.php 에서는 없었던 menu_sub.php 를 불러 왔어.
이 모듈은 부메뉴(사이드 메뉴)를 담당하는 파일이야.
어디 menu_sub.php 의 내용을 볼까?


<?php
switch ($current_menu) {
//**** 홈 메뉴 ******************************************************
case '홈피소개' ; // 홈피소개는 1단 메뉴이므로 서브메뉴가 없음 
$sub1 = '' ; 
$side = '' ;
break;
//**** 게시판 메뉴 ******************************************************
case '게시판' ;
$sub1 = 'notice.php' ;
$sub2 = 'free.php' ;
$side = <<<EOL
<!---- 서브메뉴 (menu_sub.php) -------->
    <div class="w3-card w3-bar-block w3-round w3-left-aling">
      <div class="w3-center w3-dark-gray w3-padding-16 w3-round">게시판</div>
      <a href="$sub1" class="w3-bar-item w3-button w3-border-bottom">공지사항</a>
      <a href="$sub2" class="w3-bar-item w3-button w3-border-bottom">자유게시판</a>
    </div>
EOL;
break;
//**** 로그인 메뉴 ******************************************************
case '로그인' ;
$sub1 = 'login.php' ;
$sub2 = 'signup.php' ;
$side = <<<EOL
<!---- 서브메뉴 (menu_sub.php) -------->
    <div class="w3-card w3-bar-block w3-round w3-left-aling">
      <div class="w3-center w3-dark-gray w3-padding-16 w3-round">로 그 인</div>
      <a href="$sub1" class="w3-bar-item w3-button w3-border-bottom">로그인</a>
      <a href="$sub2" class="w3-bar-item w3-button w3-border-bottom">회원가입</a>
    </div>
EOL;
break;
. . .  생 략 . . .
//**** 값이 잘못되었을때 **************************************************
default ;
$side = '<br><br><br><br>memu_sub.php를 호출하기 전에 $current_menu 변수에 메뉴명을 지정하지 않았음. 당신이 잘못했네..' ;
} // End switch
?>

앞서 php에서 배웠던 switch() 명령이 나왔네.
첫 줄 switch($current_menu) 는 변수 $current_menu 값에 따라 건너 뛰는 거 배웠지?
그런데 현재 이 값은 ‘게시판’ 이잖아. (notice.php의 3 줄에서 ‘게시판’ 이라고 값을 넣었어.)
그러니 명령의 제어권은 9줄의 [case '게시판'] 자리로 이동할 거야.
여기서 변수 $sub1에는 'notice.php' 라는 문자열이 변수값으로 저장되고, 변수 $sub2에는 'free.php' 가 변수값으로 저장돼.
그리고 $side 변수에는 값으로 <<<EOL 다음부터 19줄 EOL 이전까지의 모든 내용이 저장돼.
즉, $side 변수에는 게시판 우측에 있는 사이드바 메뉴의 html 코드들이 저장되는거야.

☞ 잠깐! heredoc
<<<EOL / EOL은 php의 heredoc(히어닥)이라고 부르는 명령인데 주로 변수값이 아주 길거나 줄 바꿈까지 있을 때 “ ” 대신 사용하는 방법이야.
[<<<이름]으로 시작하면 다음에 [이름;]을 만날 때까지의 모든 내용을 변수값으로 취급해.
이때 종료를 알려주는 [이름;]은 반드시 첫 칸(칼럼1)에 있어야 해.
그리고 [이름]은 꼭 EOL이 아니고 여러분이 지어도 돼. 주로 EOL, EOT 같은 이름을 많이 사용해. (추가적인 사용법은 인터넷에서 php heredoc으로 검색.)

즉, $side 변수에는 주석인 <!-- 서브메뉴 포함해 아래의 <div>~</div>의 모든 내용이 몽땅 변수값으로 들어갔어.
여기서 한 가지 중요한 점은 $side 변수에 값만 저장한 것이지 아직 화면에 출력하는 것은 아니야.
echo 명령을 줘야 그제서야 화면에 출력되겠지?
EOL; 다음 줄은 break로 이 switch()문을 나오라는 것이니, 이제 menu_sub.php를 빠져나와 다시 notice.php 의 다음 줄로 돌아가겠지?

이처럼 memu_sub.php 는 웹페이지의 우측에 있는 부메뉴들의 출력을 담당하는 역할을 해.
물론 memu_sub.php 를 사용하지 않고 notice.php , free.php 같이 각각의 파일 안에 직접 부메뉴를 넣어서 만들어도 돼.
그렇게 하면 이 사이드바의 디자인이나 부메뉴를 추가하려면 각 메뉴별 파일들을 일일이 수정해 줘야 해.
그렇지만 이렇게 이 사이드바의 부메뉴와 관련된 코드들만 menu_sub.php 에 가지고 있으면 부메뉴 관련 수정은 이 파일만 수정하면 되지 않겠어? 그래서 별도로 분리한 거야.

▶ include_once('layout2.php')
다음 줄은 layout2.php 이야.
앞서 공부한 layout1.php 는 본문(body) 부분이 1단 통으로 되어 있지만 layout2.php 는 2 단으로 된 형태야.
좌측에 사이드바를 넣기 위해서야.
차이점이 무엇인지 한 번 볼까?


. . . 생 략 . . .
<body>
<?php include_once('menu_main.php'); ?>
<div class="w3-container w3-content w3-center w3-padding-64 w3-border w3-white" style="max-width:1200px">
<div class="w3-row">
  <div class="w3-col m3 l3 w3-padding">
    <?php echo $side; ?>
  </div> <!-- col 3 -->
  <!--- 본문 들어가는 자리 (layout2.php) ---->
  <div class="w3-col m9 l9 w3-padding">

윗부분은 layout1.php와 똑같은데 <div class="row"> 아랫부분이 약간 달라.
바로 w3css 에서 공부할 때 배운 비율(3:9)로 나눈 2단 레이아웃으로 구성되어 있어.
여기서 좌측 사이드바를 구성하는 자리는 아랫부분이야.


  <div class="w3-col m3 l3 w3-padding">
    <?php echo $side; ?>
  </div> <!-- col 3 -->

그런데 이 <div>~</div> 사이에서 php로 echo $side; 명령이 들어가 있어.
즉, 바로 이 자리에서 menu_sub.php 에서 만들어진 $side 변수에 저장된 내용이 출력되는 거야.
사이드바가 출력되고 나면 본문에 해당하는 <div class="w3-col m9 l9 w3-padding"> (위 소스의 마지막 줄)까지만 보내주고 다시 원래 notice.php로 돌아가게 되겠지?

notice.php 에 돌아 와서는 이제 우측의 상단 제목을 출력하는 <h3>공지사항</h3>이 나오고 그 아래에 include_once()로 다시 다음 코드가 있어.

include_once(YOGI_DIR . '/bbs.php');  // 게시판삽입

상수 YOGI_DIR 폴더에 대해서는 앞서 [요기보드 설치]에서 배웠어.
카페24 를 사용하는 경우는 /아이디/www/yogi 가 되겠지?
또 yogi 폴더는 요기보드의 중요한 코드모음들이 들어 있는 폴더라고 알려 주었어.
yogi 폴더 안에 bbs.php 가 있겠지?
다음 장에서 이 파일을 살펴보자구.

▶ <!--- layout2 에서 열었던 div 닫기 --->
아래 쪽에는 아래 3 줄이 있어. 이것들은 왜 있는 걸까?


    </div> <!-- col 9 -->
</div> <!-- row -->
</div> <!-- container -->

이것은 layout2.php 에서 시작한 <div> 가 아직 끝나지 않았기 때문에 이것을 닫아 주는 태그야.
여러분도 잘 알다시피 <div> 로 시작했으면 </div> 로 닫아 주어야 하잖아.
그런데 layout2.php 는 본문 입력 자리를 위해 <div> 를 열어만 두고 닫지는 않았어.
본문 내용이 바로 이 notice.php 의 게시글 테이블이기 때문이지.
그러니 게시판 까지 출력을 했으면 이제 닫아 주어야 겠지?

본문을 다 처리하고 맨 아래에는 꼬리말(footer.php)를 불러 와서 출력하면 이제 끝이야.
이번 장도 고생했어..짝짝짝..



목차제 목조회
577
338
277
256
269
246
203
198
160
167
213
223
233
117
148
160
150
185