W' page

- XE로 만든 홈페이지는 내 개인 Linux 머신으로 옮겼다.

대부분의 사람들은 어떤 목적을 갖고 홈페이지를 만든다.
그렇다면 홈페이지를 만들 때 가장 먼저 하는 일은 바로 홈페이지의 구조를 생각하는 것이다.
 
예를들어 커뮤니티를 운영한다고 하면 Home 화면이 있을 것이고, 각각의 목적에 따라 게시판들이 필요할 것이다.
그러면 그에 따른 메뉴들이 필요할 것이고 필요에 따라 하위, 혹은 제 3차 하위메뉴까지도 필요할 것이다.
이러한 가장 기본적인 메뉴들의 속성 설정 및 게시판 생성해 주는 작업을 해보자.
 
먼저 홈페이지를 들어간다.
이제 관리자 ID/PW 로 로그인 하면 맨 위 회원정보에 톱니바퀴 모양과 함께 관리 버튼이 생길 것이다.
이 페이지가 바로 홈페이지를 마구마구 꾸미고 주무를 수 있는 곳이다.
 
왼쪽 사이트제작/편집 의 하위메뉴인 사이트 메뉴 편집에 들어가면 우리가 하려는 메뉴 목록 설정을 할 수 있다.
Welcome menu 가 기본적으로 설정되어 있을 것이고 그 아래 있는 위젯 페이지가 바로 우리의 메인 페이지이다.
이제 그 아럐쪽에 tree처럼 가지를 하나씩 뻗어나갈 수 있다.
(홈페이지의 기본 레이아웃-디자인 에서는 주메뉴 - 1차메뉴 밖에 지원을 안하는듯 하다.)
 
 
2014.08.20 기준으로 나의 홈페이지는

 
 
이렇게 짜여있다.
 

주 메뉴의 세부 설정을 살펴보면
 

 
1. Home
 

메인 페이지.
앞으로 다른 글에서 이 페이지의 위젯을 어떻게 설정했는지 적을 예정이다.
 

2. blog
 
내 개인적인 blog를 쓰고 싶어서 만든 메뉴이다.
지금 쓰고 있는 Web, 이것 저것 경험해보고 쓰는 리뷰 등을 다루고 있다.
blog는 게시판으로 생성하였다.
아래 하위메뉴인 Web과 Review에는 게시판에서 Web 카테고리만 보이는 페이지, Review만 보이는 페이지의 url을 연결시키는
바로가기 메뉴로 만들었다.
 

3. 일상
 
내 개인적인 일기 등을 쓰는 곳이다.
그냥 게시판 형으로 만들었다.
 

4. 예그린
 
예그린 메뉴에는 예그린 아이들이 이용할 수 있는 자유게시판과 업데이트가 한참 밀려있는 콘티&연습 게시판이 있다.
먼저 자유게시판과 연습&콘티 게시판을 하위 메뉴로 만들어 놓고
상위 예그린 메뉴에는 자유게시판 바로가기 페이지로 꾸몄다.
 

 
5. To Woong
 
누구나 글 쓸 수 있고 나만 볼 수 있게 하는.. 게시판으로 하나 만들었다.

/*  2014.08.22 추가

6. 방명록

XE 의 기본 방명록 모듈을 다운로드 하여 사용중이다.

모듈에 오류가 있어 수정해서 사용해야 하는데 그것은 게시판 관련 글에서 다루도록 하겠다.        */
 

 
지금 말로 적는 이야기들을 눈으로 보기만 하면 이해가 안갈수도 있다.
하지만 이전까지의 작업을 마무리 하고 왼쪽에는 이 글을, 오른쪽엔 관리자메뉴를 보고 있는 사람들에겐
이해가 잘 갈 것이라 믿는다.
 

홈페이지를 만드는 방법에는 여러가지가 있다.
나는 그 중 그래도 내 생각에 우리나라에서 많이 대중적이라고 생각되는 xe라는 툴을 이용하여 만들어 보려고 한다.
 
xe로 홈페이지를 만들기 위해선 1. PC에 FTP 서버 생성, 2.Mysql 계정 생성이 필요하다.
 

 
1. FTP 서버 생성

 FTP 서버 생성을 위해 제일 처음 해야 할 것은 윈도우에 FTP 서버 생성을 위한 툴을 깔아주는 것이다.
(Filezilla 같은 사설 프로그램을 사용해도 되지만 나는 순수 윈도우 기능을 이용해봤다.)

제어판 - 프로그램 추가/제거 - Windows 기능 사용/사용 안함 - FTP 관련 항목 모두 체크하고 확인

     => 이제 윈도우에서 FTP 서버 생성 가능!

이젠 나의  FTP 서버에 접속할 수 있는 계정을 만들어줘야 한다.
나의 경우에는 윈도우 설치시 만든 내 계정 이름을 사용하였는데, 비밀번호를 꼭 사용해야 한다.
(헌데 컴퓨터 부팅 시 비밀번호 치기 귀찮으면 시작+r - netplwiz - 사용자 이름과 암호를 입력해야 이 컴퓨터를 사용할 수 있음 에 체크 해제!)
시작+E (탐색기 실행) - 컴퓨터 오른클릭 - 관리 - 시스템도구 - 로컬 사용자 및 그룹 - 사용자 오른클릭 - 새 사용자
사용자 이름 / 암호, 암호확인 을 채워 넣고 다음 로그인 시 사용자가 반드시 암호를 변경해야 함 체크 해제,
사용자가 암호를 변경할 수 없음 및 암호 사용 기간 제한 없음 요 2군데에 체크하여 만들기 클릭

이제 이 사용자 계정을 이용하여  FTP 서버를 사용할 수 있게끔 해보자.
시작+E (탐색기 실행) - 컴퓨터 오른클릭 - 관리 - 서비스 및 응용프로그램 - IIS(인터넷 정보 서비스)
여길 들어가면 오른쪽에 세로로 2등분 된 화면이 나온다. 그 중 왼쪽 화면에서 내 PC 이름을 더블클릭하면 사이트 라는 하위 항목이 나온다.
사이트 오른클릭 - FTP 사이트 추가 - FTP 사이트 이름(아무 것이나 상관 없음) - 실제 경로(Apache에서 설정한 기본 폴더) - 다음
포트(기본은 21이지만 사용자가 원하는 다른 포트도 사용 가능) - SSL 없음 - 다음
인증(기본) - 권한부여 - 지정한 사용자(내가 만든 사용자) - 사용 권한(읽기, 쓰기 모두 선택) - 마침
이렇게 하면 내가 지정한 FTP 사이트 이름으로 FTP 서버가 시작된 것을 볼 수 있다.

방화벽에서 FTP 포트의 인/아웃바운드 설정도 해줘야한다.
제어판 - Windows 방화벽 - 고급설정 - 인바운드규칙 - 우측에 새규칙 - 포트 - 다음
특정 로컬 포트에 내가 설정한 FTP포트 입력 - 다음

연결 허용 - 다음 - 다음 - 이름엔 내가 알아볼 수 있는 이름을 적고 마침
                             

 
2. Mysql 계정 생성
 
apmsetup 을 설치하였으면 apmsetup 모니터 프로그램이 설치되어있을 것이다. 실행하면 우착 하단 작업표시줄에 프로그램이 실행된다.
작업표시줄의 프로그램 오른클릭 - Mysql 신규 계정 생성에서 신규 계정을 생성한다. (root의 Mysql 최초 비밀번호는 apmsetup 이다.)
 

3. xe 설치

자, 이제 xe의 설치를 본격적으로 시작 해보자.
먼저 http://www.xpressengine.com/download 에 들어가 최신 버전의 xe를 다운받는다.
다운 받으면 압축 파일이 있을 텐데 xe폴더 째로 압축이 되어있다. 헌데 우리는 xe 폴더째 압축을 푸는 것이 아니라
xe 폴더 안에 있는 내용물만 Apache에서 설정한 기본 폴더에 푼다.
(만약 xe 폴더 째로 압축을 풀면  내 도메인/xe 이 홈페이지 주소가 되어버린다.)

인터넷 브라우저에 localhost 또는 내가 지정한 도메인을 입력하면 Xpress Engine 설정 창이 나온다.
 
첫번째 창에서는 한국어 선택 - 다음 
설치 조건 확인에서는 내 컴퓨터에 깔린 Apache, php, Mysql 등의 버전을 검사한다. 설치를 진행합니다 클릭
FTP 정보 입력에는 주소 및 계정 정보를 넣어야 한다.(호스팅을 통하는 경우 적지 않을 수도 있다.)
FTP 주소 : ftp://내도메인:ftp포트번호  이고 ID/PW 는 위에서 설정한 것을 넣으면 된다.  - 다음
 
DB 선택은 나도 잘 모른다. mysql 지정 후 다음을 눌렀다.
mysql 정보에는 내가 신규 생성한 mysql 계정 정보를 넣으면 된다. 아래쪽 내용은 그냥 넘어간다.
(호스팅 업체에서 실시하는 것이라면 호스팅 업체에서 주는 정보를 넣으면 된다.)
 
환경 설정에선 내가 있는 곳 시간을 넣으면 된다. - 다음
관리자 정보 입력에는 자신이 사용 할 관리자의 정보를 넣으면 된다. - 완료

이제 나만의 홈페이지가 만들어졌다!

이제는 홈페이지를 꾸미고 관리하는 재미를 누릴 시간이다.

홈페이지를 구축하려면 크게 3가지가 필요하다고 한다. 그 3가지는 다음과 같다.
(아래 각 항목에 대한 설명은 내가 이해한 것들이다. 틀리거나 보강할 것이 있으면 개의치 말고 알려주십시길..)
 

1. Apache

 
인터넷을 하는 우리 모두에겐 고유한 ip가 있다. (허브 및 공유기를 통해 고유한 ip를 여러명이 나눠쓰기도 한다.)
쨋든 외부에서 내 ip나 특정 Domain을 입력하여 내 PC까지 왔을때 '이리로 가시오~'라고 안내해 주는 것이 필요하다.
이러한 안내의 역할을 해주는 것이 Apache이다.
(일반적으로 80번 포트를 개방해주고 Apache 프로그램에서 지정한 폴더 안에 있는 index.html 이나 index.php 를 띄우도록 해준다.)
 

 
2. PHP

친절한 Apache를 통해 내 PC의 정문을 통해 내가 만들어 놓은 공간에 누군가 들어왔다.
근데 이 공간이 보여주기만 하는, 아주 정적인 박물관같이 꾸며져 있으면 참 재미없을것이다.

요즘 움직이는 박물관이 유행하듯이 내 홈페이지를 방문한 사람의 행동에 반응하는 것이 필요하다. 그래서 필요한 것이 PHP 이다.
사용자들이 보기만 하는 것이 아니라 함께 소통할 수 있도록 움직이는 공간을 구현해주는, 동적인 것을 구현해 주는 것이 PHP 이다.

(가장 간단한 예로 게시판을 들 수 있다. 사용자가 '쓰기'를 눌러 글을 쓴 다음 '등록'을 누르면 홈페이지에 변화가 생긴다.)
 

 
3. Mysql

홈페이지 공간을 구성하는 요소 요소가 바로 Database 일 것이다. 이 Database를 효과적으로 주무르기 위해 존재하는 것이 Mysql 이다.

 
이 3가지가 홈페이지를 구축하는데에 필수적인 것들이다.  헌데 이 필수적인 3가지를 손쉽게 설치할 수 있는 프로그램이 있다.
바로 APMSETUP7 이라는 프로그램이다. (http://www.apmsetup.com/download.php 에서 다운받아 설치할 수 있다.)
 
나는 APMSETUP 프로그램을 내가 따로 파티션 나눠놓은 D드라이브에 설치했다.

혹시 모를 상황을 대비해 백업용인 다른 드라이브에 설치하는 것을 추천한다.
 

/*
 
위 3가지를 전문가처럼 직접 설치하는 방법은 나도 잘 모른다. 하지만 인터넷에 나와있는 방법을 '나를 위해' 적어놓겠다.
http://www.phpschool.com/gnuboard4/bbs/board.php?bo_table=download&wr_id=17266&page=1
위 링크의 글에 있는 첨부파일을 참조!                                                                                                           */
 

 
설치가 완료면 인터넷 브라우저에 localhost 라는 주소가 띄워지면서 APMSETUP 이 잘 설치되었다는 화면이 나올 것이다.
그리고 그 화면은 APMSETUP이 설치된 폴더 안의 htdocs 에 있는 index.php 파일일 것이다.
외부에서 내 PC로 접속하면 이제 htdocs 폴더 안의 index.php 혹은 index.html 로 안내가 되는 것이다.

(htdocs 말고 다른 곳으로도 오게 할 수 있다. 그 설정은 apmsetup 모니터링 프로그램의 서버설정에 들어가면 된다.)
 

이제 인터넷 세계에서 내 PC의 정문으로까지의 길을 닦아 놓았으니, 이젠 내가 보여줄 공간을 꾸미기만 하면 된다.
헌데 이 공간을 꾸미는 방법이... 옛날과는 많이 달라진것 같다.
(옛날이라 하면 내가 초딩때의 제로보드 시절...)
홈페이지를 쉽고 있어보이게 꾸미는 방법은 여러가지가 있지만 나는 내가 이 홈페이지를 만든 XE 라는 툴 사용법에 대해 적으려 한다.