본문 바로가기

class "Think"/"PHP On Azure"

[PHP on Azure - 초급 - 7] git을 활용하여 PHP-MySQL 웹 사이트를 Azure에 배포하기 (2)

- 윈도우 애저 무료 평가판 다운로드 : http://www.windowsazure.com/ko-kr/pricing/free-trial/?WT.mc_id=A53D57CF7 

- 윈도우 애저 평가판 설치 내용 하기 : http://www.phpschool.com/link/teach/2650


저번강의(http://hahaheo.com/231)에서 Azure에 여러분의 웹사이트를 올릴 공간을 MySQL DB와 함께 생성하고 git repository를 셋팅하는 작업을 진행했습니다.

이번 강의에서는 git을 여러분의 컴퓨터에 셋팅하고, 소스를 코딩하고, azure에 올려서 정상적으로 작동하는지 확인해볼 예정입니다. 그리고 웹 사이트를 수정한뒤 다시한번 git repository를 이용해서 배포해볼 예정입니다. 저번 강의에서도 말씀드렸지만 이번강의는 여러분의 컴퓨터에 MySQL을 설치하고 실행할수 있는 환경이 셋팅되어야 진행이 가능합니다.


강의를 시작하겠습니다
* 이번 강의에서 사용된 예제의 원본 내용은 하단의 (1) 링크를 참고하시면 됩니다.

이번 강의에서 만들 예제 사이트는 1개의 테이블이 있는 데이터베이스를 연동한 1개의 php 페이지입니다. 강의를 끝내고나서 완성하면 다음과 같은 결과물이 나옵니다


먼저 저번 강의때 만든 MySQL DB에 웹사이트에서 사용할 테이블을 생성해야합니다. Windows 기준으로 MySQL Command Line Client 를 실행하셔서 외부의 데이터베이스로 접근해야 합니다. 먼저 cmd를 띄우고, mysql 프로그램이 보통 환경변수로 셋팅되지 않았기 때문에 프로그램이 있는 경로로 이동해야 합니다. (설치환경마다 경로가 조금 다를수 있습니다)

 >cd c:\Program Files\MySQL\MySQL Server 5.5\bin


이제 다음 명령어를 실행합니다. Mac이나 Linux 에서는 Terminal에서 동일하게 실행하면 됩니다.

>mysql -h[Data Source] -u[User Id] -p[Password] -D[Database]


여기서 Data Source, User Id, Password, Database는 이전 강의에서 마지막에 보았던 View Connection Strings 값을 그대로 넣어주면 됩니다. 적어두었던 값을 그대로 입력해서 MySQL DB에 접속하도록 합니다.


이제 테이블과 테이블 스키마를 생성하도록 하겠습니다. 구체적으로 어떤 내용이 생성되는지 설명은 생략하도록 하겠습니다. 여러분은 내용을 단순히 Copy & Paste 하셔서 실행하시면 됩니다.


mysql> CREATE TABLE registration_tbl(id INT NOT NULL AUTO_INCREMENT, PRIMARY KEY(id), name VARCHAR(30), email VARCHAR(30), date DATE); 


여기까지 진행하면 콘솔창에 다음과 같이 진행되었을 것입니다. 참고하셔서 오류가 나셨다면 다시 시도하시면 됩니다.

아래 명령어로 콘솔창을 종료합니다.


mysql>exit 


이제 php 페이지의 내용을 코딩해보도록 하겠습니다. 내용을 코딩 후 여러분의 개발환경에 apache가 설치되어 있어야 하고, PDO extension for MySQL을 사용할수 있게 웹서버에서 enable이 되어있어야 합니다. 하지만 내용상 이번 강의에서는 생략하도록 하겠습니다. PDO extension for MySQL에 더 궁금하시면 하단에 (2) 링크를 참고하시기 바랍니다.


아래 소스에서 굵게 표시된 줄은 여러분의 데이터베이스 설정에 맞게 수정하셔야합니다. 마찬가지로 View Connection Strings 값을 참고하셔서 입력하시면 됩니다. 어떤 항목이 들어가야하는지는 여러분들이 더 잘 아실거라고 생각됩니다 :)


<html>

<head>

<Title>Registration Form</Title>

<style type="text/css">

    body { background-color: #fff; border-top: solid 10px #000;

        color: #333; font-size: .85em; margin: 20; padding: 20;

        font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;

    }

    h1, h2, h3,{ color: #000; margin-bottom: 0; padding-bottom: 0; }

    h1 { font-size: 2em; }

    h2 { font-size: 1.75em; }

    h3 { font-size: 1.2em; }

    table { margin-top: 0.75em; }

    th { font-size: 1.2em; text-align: left; border: none; padding-left: 0; }

    td { padding: 0.25em 2em 0.25em 0em; border: 0 none; }

</style>

</head>

<body>

<h1>Register here!</h1>

<p>Fill in your name and email address, then click <strong>Submit</strong> to register.</p>

<form method="post" action="index.php" enctype="multipart/form-data" >

      Name  <input type="text" name="name" id="name"/></br>

      Email <input type="text" name="email" id="email"/></br>

      <input type="submit" name="submit" value="Submit" />

</form>

<?php

    // DB connection info

    //TODO: Update the values for $host, $user, $pwd, and $db

    //using the values you retrieved earlier from the portal.

    $host = "value of Data Source";

    $user = "value of User Id";

    $pwd = "value of Password";

    $db = "value of Database";

    // Connect to database.

    try {

        $conn = new PDO( "mysql:host=$host;dbname=$db", $user, $pwd);

        $conn->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );

    }

    catch(Exception $e){

        die(var_dump($e));

    }

    // Insert registration info

    if(!empty($_POST)) {

    try {

        $name = $_POST['name'];

        $email = $_POST['email'];

        $date = date("Y-m-d");

        // Insert data

        $sql_insert = "INSERT INTO registration_tbl (name, email, date) 

                   VALUES (?,?,?)";

        $stmt = $conn->prepare($sql_insert);

        $stmt->bindValue(1, $name);

        $stmt->bindValue(2, $email);

        $stmt->bindValue(3, $date);

        $stmt->execute();

    }

    catch(Exception $e) {

        die(var_dump($e));

    }

    echo "<h3>Your're registered!</h3>";

    }

    // Retrieve data

    $sql_select = "SELECT * FROM registration_tbl";

    $stmt = $conn->query($sql_select);

    $registrants = $stmt->fetchAll(); 

    if(count($registrants) > 0) {

        echo "<h2>People who are registered:</h2>";

        echo "<table>";

        echo "<tr><th>Name</th>";

        echo "<th>Email</th>";

        echo "<th>Date</th></tr>";

        foreach($registrants as $registrant) {

            echo "<tr><td>".$registrant['name']."</td>";

            echo "<td>".$registrant['email']."</td>";

            echo "<td>".$registrant['date']."</td></tr>";

        }

        echo "</table>";

    } else {

        echo "<h3>No one is currently registered.</h3>";

    }

?>

</body>

</html>


파일이름을 index.php로 해서 저장하도록 합니다.


PHP에 익숙한 여러분들은 크게 어려움 없이 이해가 가능한 소스 코드입니다. 사용된 php 스크립트에 대해 디테일하게 설명하긴 강의 분량상 어렵지만, 특이한 부분으로 데이터베이스는 PDO extension을 사용하여 접근하고 있습니다. 페이지에 대해 간단히 설명하자면 폼에 사용자가 입력한 데이터를 데이터베이스에 Insert하고, 이를 다시 조회하여 웹페이지에 보여주는 형태의 웹 사이트 입니다.

이제 웹사이트를 Azure에 배포해야 하는데, 그 전에 먼저 Git reposory를 사용할 수 있는 프로그램을 설치해야 합니다.

배포 이전에 git에 접근할수 있는 client 프로그램을 설치해야 합니다. 저는 GitHub for Windows 를 사용할 예정입니다. 여러분이 사용하시는 툴이 있다면 그 툴을 사용해서 배포하시면 됩니다.

http://windows.github.com/ 



위 주소로 이동하셔서 사진의 버튼을 클릭하면 무료로 사용하실수 있습니다. 설치과정은 생략하겠습니다

처음 설치하면 github를 등록할거냐고 물어보는데 skip setup 버튼을 클릭합니다.

사실 gui를 사용해서 배포하는게 좋으나, 다른 클라이언트 사용자 분들을 위해 Command Line Interface에서 강의를 진행하도록 하겠습니다. 자동으로 실행된 프로그램을 종료하시고, 
시작메뉴 -> 모든 프로그램 -> GitHub, Inc -> Git Shell 을 실행하도록 합니다.

다음과 같이 나타납니다. 하나하나 명령어를 치면서 알아보도록 합니다.

먼저 아까 저장한 index.php가 있는 폴더로 이동해야합니다. 저는 별도의 source 폴더로 이동 하겠습니다. command line 명령어에 대한 설명은 생략하겠습니다

>cd d:\Source\GitHub\phpmysql_Azure\ 


다음 명령어를 차례대로 입력합니다. 간단하게 설명해 드리면 지금 있는 폴더를 git repository로 만들기 위한 초기화 작업과 그 repository에 소스를 최초로 커밋 하는 단계입니다


>git init
>git add .

>git commit -m "inital commit"


여기까지 실행하시면 화면이 다음과 같이 나타날 것입니다



이제 git repository를 azure로 재배포 해야 합니다. 다음과 같은 명령어를 입력합니다


>git remote add azrue [URL]


여기서 URL은 이전 장에서 git repository를 생성할때 포털에 적혀있던 URL입니다. 잊어버리신 분들을 위해 다시 사진을 보여드리겠습니다


주소를 입력하고 다음 명령어를 실행하면 azure에 배포하게 됩니다. 여기서 패스워드를 물어보게 되는데, 이전장에서 credential을 셋팅할때 입력했던 패스워드를 입력하면 됩니다

>git push azure master 


git를 처음설치해서 사용하는 분들은 여기서 오류가 나타날 겁니다. 위에 커멘트라인에서 git commit 할때 fatal 오류가 났는데 무시하고 넘어갔었습니다. git를 커밋하기 전에 global 변수를 지정해야 하는데 그 두가지가 여러분의 이메일과 닉네임 입니다. 이건 규칙같은거라 무시하고 넘어갈 수가 없나보네요 이걸 지정해보도록 하겠습니다


>git config --global user.email "[여러분의 이메일]"

>git config --global user.name "[여러분의 닉네임]" 


입력을 하고 다시 커밋하고 업로드 해보겠습니다


>git commit -m 'initial commit' 

>git push azure master


그럼 다음화면과 같이 정상적으로 완료될 것입니다


이제 사이트로 들어가 정상적으로 작동하는지 확인해보도록 합니다.

azure 포털에서 브라우저 버튼을 클릭해 들어가도 되고, http://[서비스 이름].azurewebsites.net/index.php 에서 [서비스 이름]을 여러분의 서비스 이름으로 바꿔서 들어가도 됩니다.


정상적으로 작동하는것을 확인할 수 있습니다

git 업데이트 현황은 azure포털에서도 확인할 수 있습니다.





마지막으로 git을 통해 소스를 수정해보도록 하겠습니다.


소스를 여러분의 입맛에 맞게 수정하시고 저장한 뒤에 아까 띄웠던 GitHub Command Line 창에서 다음과 같이 입력하시면 됩니다


여기서 "comment describing changes"에는 무엇을 수정했는지 영어로 입력해놓으시면 편하게 버전관리가 가능해집니다.


>git add . 

>git commit -m "comment describing changes"

>git push azure master








정상적으로 웹사이트가 수정된 것을 확인할 수 있습니다. 

다시 Azure 포털로 돌아가서, Deployment 메뉴로 들어가 업데이트 되었던 로그를 확인해보도록 하겠습니다.


로그 기록중 하나를 클릭하게 되면, 좀더 자세하게 언제 commit이 되었는지에 대한 로그와 하단에 ReDeploy 버튼이 나타나게 됩니다. 이는 Git의 가장 기본적인 기능중에 하나이지만, 업데이트했던 내용에 버그가 발생시 즉시 이전의 버전으로 롤백이 가능한 시스템입니다. 이를 Azure 포털에서 쉽게 수행할 수 있습니다.



지금까지 따라한것처럼 git을 이용하면 별다른 절차가 필요 없이 쉽고 빠르게 웹사이트를 배포할 수 있을 뿐만아니라 버전관리도 쉬워집니다. 앞으로 git을 통해서 좀더 체계적으로 여러분의 소스를 관리하고 배포해보시는건 어떨까요?

여기까지 강의를 마치겠습니다.

감사합니다



참고사이트

(2) PDO extension for MySQL - http://www.php.net/manual/en/ref.pdo-mysql.php