먼저 이 글은
http://dalibor.dvorski.net/downloads/docs/InstallingConfiguringDevelopingWithXAMPP.pdf
에 있는 문서를 참조하여 만들어졌음을 밝혀두며
많은 의역과 생략이 있음을 이해해 주기 바란다.
----------------------------------------------------------------------------------
INSTALLING, CONFIGURING, ANDDEVELOPINGWITHXAMPP
by Nobang, Jan 2012
---------------------------------------------------------------
이 글은 XAMPP 아파치 배포판의 설치와 환경설정을 설명하고
PHP와 MySQL을 이용하여 주소록을 개발하는 과정을 단계별로 제공한다.
XAMPP 1.1.7
- Apache Apache 2.2.21
- MySQL Server 5.5.16
- Php 5.3.8
- tomcat 7.0.16
- phpMyAdmin 3.4.5
XAMPP 설치
XAMPP는 무료로 다운로드 및 설치가 가능하다
모든 XAMPP 패키지들과 add-on들은 Apache Friends 웹사이트를 통해 배보된다
(http://www.apachefriends.org)
웹사이트에서는 XAMPP Lite의 윈도우즈 설치버전을 찾을 수 있고
자동으로 압푹을 푸는 파일도 다운받을 수 있다.
다운받을 후에 설치할 폴더에 압축을 푸는 작업을 한다
예를 들면, 기본 C:\로 지정을 하면 해당 경우에 압축을 풀게된다.
만약 다른 폴더로 지정을 할 경우
모든 설치가 제대로 됐는지 테스트 하려면
설치된 폴더안의 xamp 디덱토리 안에 apache_start.bat 파일을 구동시켰을 때
Apache HTTP Server가 동작해야 한다.
----------------------------------------
NOTE : 윈도 환경설정에 따라 다르지만
Apache HTTP Server에게 네트워크 접속을 허용하는지 묻는 경우가 있다
이것은 아파치 서버가 방확벽을 지나 네크워크 접속을 하도록 허락하는 것이다.
-----------------------------------------
다음으로 아파치 서버가 동작하는지 확인하기 위하여
인터넷 브라우저를 열고 http://localhost/ 를 입력하여 제대로 열리는지 테스트 한다.
만약 환경이 제대로 되어 있다면 아래 보이는 화면[그림1]과 비슷한 화면이 나타날 것이다
[그림 1]
모든아파치 프로세스를 중지하기 위해 터미널 어플리케이션을 닫지 않는다.
대신 xampp 돌더 아래에 apache_stop.bat 배치파일을 시행시키면 된다.
PHP Hello World
이전 단계에서 Apache HTTP Server를 설치하고 동작시켰다.
이번에는 "Hello World"라는 간단한 프로그램을 PHP로 Test 해 본다
새로운 파일을 만든다 xampp\htdocs 폴더아래에 helloWorld.php 라는 파일을 만들고
다음과 같이 작성한다.
<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Hello world</title></head>
<body><p><?php echo "Hello World"; ?></p>
</html>
작성이 되었으면 http://localhost/helloWorld.php 를 입력한다.
아래 [그림2]와 같은 화면이 나오면 성공이다.
[그림 2]
DataBase 생성, Table 생성 그리고 Data 입력
이제 Apache와 PHP가 제대로 돌고 있다.
다음 단계는 MySQL을 시작하고 database와 table을 생성하여 우리는 주소록을 만들 것이다.
MySql을 시작하려면 xampp 폴더에서 mysql_start.bat 배치파일을 실행시킨다.
--------------
NOTE : Apache HTTP Server와 비슷하게 MySQL 또한 네트워크 접속이 필요하다
따라서 윈도우 방화벽 설정에서 네트워크 접속을 허용해야한다.
--------------
XAMPP 패키지는 phpMyAdmin이라고 불리는 어플리케이션을 포함하고 있다.
이것은 개발자가 MySQL Database를 관리할 수 있게 해준다.
우리는 phpMyAdmin을 이용하여 이번 작업을 진행한다.
xampp\phpMyAdmin 가 있는지 확인한다.
http://localhost/phpMyAdmin/ 을 브라우저에 입력했을 때
아래와 비슷한 화면[그럼 3]이 나타나면 된다.
[그림 3]
phpMyAdmin으로 실제 작업을 해 보면
[그림 4]의 Databases 탭에서
Create new database에 DB명 addressbook을 입력하고 Create버튼을 누른다.
좌측메뉴에 addressbook이 나타나면 성공이다.
addressbook를 누르고 structure탭에서 table을 생성하는 화면이 나타난다.
table(colleague) 이름을 입력하고 몇개의 column을 사용할 것인지 입력(5)한 뒤 Go 버튼을 누른다
입력한 갯수만큼 칼럼정보를 입력하는 popup이 나타난다
칼럼정보는 다음과 같다.
Field Type Length/Values Extra Key
id int 11 auto_increment primary key
firstName varchar 20
lastName varchar 20
telephone varchar 11
email varchar 40
테이블을 생성한 뒤에 샘플 데이터를 입력해야하는데
다음과 같은 내용으로 해도 되고 다른 Data를 넣어도 된다.
---------------
NOTE : 테이블에 Data를 넣을 때 id 필드는 입력하지 않는다.
이유는 이미 auto increment라는 속성을 지정했으므로 자동으로 숫자가 채워지게 된다
---------------
id firstName lastName telephone email
1 James Smith 01000001111 abc@abc.com
2 John Johnson 02000002222 bcd@abc.com
3 Robert Williams 03000003333 cde@abc.com
4 Richard Davis 04000004444 def@abc.com
5 David Rrown 05000004444 efg@abc.com
db는 준비가 끝났다.
다음으로 작성할 프로그램의 과정은
첫째로 PHP를 이용하여 Database에 연결하고
xhtml 정의와 Meta data로 시작하여
page의 body 부분에 colleague table을 조회하여
가져온 모든 항목을 반복문을 통해 브라우저에 보여주게 한다.
htdocs 폴더 아래에 addressBook 폴더를 생성하여 index.php로 저장한다
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("adressbook");
$result = mysql_query("SELECT * FROM colleague");
?>
위 코드가 DB에 접속하는 부분인데
database 의 접속 address 는 localhost 이고
root는 username, ""는 패스워드인데 현재 지정을 하지 않았다.
phpMyAdmin으로 address와 username, password를 지정할 수 있다.
--------------------
NOTE :물론 배울 때에는 기본 username과 password를 써도 좋지만
보안을 좀 더 높이려면 비밀번호를 변경하는것을 추천한다.
--------------------
mysql_connect("localhost", "root", ""); 이 줄은
바로 뒤에 addressbook 이라는 database에 연결하고 사용할 것을 말한다.
마지막으로 result라는 변수를 선언하여 거기에 colleague table 테이블에 있는
모든 레코드를 조회한 결과를 담도록 한다.
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("test");
$result = mysql_query("SELECT * FROM colleague");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Address Book</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
</head>
상단의 예제 코드에서 <?php 와 ?> 는 PHP 코드 블럭이라는 것을 알려준다.
그리고 이것은 XHTML 문서가 정의 되지 전에 끝낸다.
이전에 만든 "Hello World"예제에서도 PHP 코드 블럭이 XHTML tab영역안에 있던것을 기억할 것이다
이것은 XHTML과 PHP는 서로의 영역에서 자유롭게 쓸 수 있다는 뜻이다.
이 개념은 또한 DB에서 조회해 온 결과를 PHP 반복문을 써서 보여줄 수 있다는 것을 보여준다.
</head>를 끝내고 다음 몇줄을 추가한다
<body>
<h1>Address Book</h1>
<table border="1" collpadding="2" cellspacing="3" summary="Table holds colleague contact information">
<tr>
<th>ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Telephone</th>
<th>Email Address</th>
</tr>
위의 새 코드는 문서의 Body이다 새로운 XHTML table을 위치시키고 row의 헤더를 정의한다
ID, First Name, Last Name, Telephone, Email
다음으로 db에서 가져온 결과를 PHP의 반복문을 이용하여
각 Row를 XHTML table에 출력하도록 한다.
<?php
while($row = mysql_fetch_array($result)){
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['firstName'] . "</td>";
echo "<td>" . $row['lastName'] . "</td>";
echo "<td>" . $row['telephone'] . "</td>";
echo "<td>" . $row['email'] . "</td>";
}
mysql_free_result($result);
mysql_close();
?>
반복은 테이블에 각 Db의 레코드 만큼 Row를 추가하는 <tr> 태그를 넣고
그안의 cell 에 id, firstName, lastName, telephone, email을 <td> 태그로 넣는다.
끝나기 전에 </tr>로 테이블의 Row를 닫는다.
PHP 블록에서 메모리를 자유롭게 갈무리 하기 위해 mysql_free_result($result); 를 추가하고
DB연결을 닫는다 mysql_close();
코드의 큰 맥락은 다 쓰였으나, XHTML 문서는 몇가지 테그를 더 닫아주어야 한다.
</table>
</body>
</html>
예제의 완전한 코드는 다음과 같다.
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("addressbook");
$result = mysql_query("SELECT * FROM colleague");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Address Book</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
</head>
<body>
<h1>Address Book</h1>
<table border="1" collpadding="2" cellspacing="3" summary="Table holds colleague contact information">
<tr>
<th>ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Telephone</th>
<th>Email Address</th>
</tr>
<?php
while($row = mysql_fetch_array($result)){
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['firstName'] . "</td>";
echo "<td>" . $row['lastName'] . "</td>";
echo "<td>" . $row['telephone'] . "</td>";
echo "<td>" . $row['email'] . "</td>";
}
mysql_free_result($result);
mysql_close();
?>
</table>
</body>
</html>
이것으로 DB를 생성하고 table도 생성하고
table에 Data도 넣고 PHP를 이용하여 이것들을 읽는 것까지 했다.
필요하다면 남은 작업은 test다
Apache HTTP Server와 MySQLR가 동작하는지 확인하고
브라우저를 열어서 주소를 입력했을 때 제대로 열리는지 확인한다.
파일을 htdocs 폴더아래 addressBook 폴더 아래에 index.php로 저장했다면
http://localhost/addressBook/index.php 로 입력을 하면 [그림 5]와 같이 보여질 것이다.
만약 Error를 만나게 되면 위 예제의 완전한 코드를 보고 비교하여 잘못된 곳을 찾기를 바란다.
[그림 5]
마지막으로 모든 Process를 중지하고 닫으려면
apache_stop.bat와 mysql_stop.bat를 각각 실행하여 서버와 DB를 중지시킨다.
결론
이 아티클을 통해 개발환경 셋업과 DB 생성 그리고 프로그램으로 DB에 접속하고 조회하는 시작개념을 보여줬다
물로 이 개념들은 중요하지만 Application의 끝은 아니다.
Address Book 프로그램 예제를 이용한것 처럼 여러 Application 안에는 많은 기능들이 구현 되어있다.
연락처 정보를 수정하거나 지우거나 새 연락처를 추가 또는 폼을 통해 emaail로 연락하는 기능들이 모두 추가 가능한 기능들이다.
다른 요소들을 추가하여 당신만의 address book program에 도전해 보자
