ABOUT ME

    -

    Today
    -
    Yesterday
    -
    Total
    -
    • [CodeIgniter] 2. CodeIgniter 개발 환경 구성
      Web/CodeIgniter 2015. 7. 17. 11:26

      Chapter 2. CodeIgniter 개발 환경 구성


       CodeIgniter는 PHP 환경에서 작동합니다. 운영체제에 상관없이 PHP가 작동하는 환경이라면 사용할 수 있습니다.


       윈도우를 기준으로 개발 환경 구성을 해보도록 하곘습니다.



       2.1 윈도우에서 환경 구성하기


        윈도우에서 PHP 개발 환경을 구성하려면 Apache, PHP, MySQL (APM)을 각각 설치하고 설정해야 하는데, 이 과정은 단순 반복이어서 번거롭습니다. XAMPP를 이용하면 APM을 한 번에 설치하고 관리할 수 있습니다.


       

        2.1.1 XAMPP 설치


        XAMPP 페이지(https://www.apachefriends.org/index.html)를 방문합니다.


        다운로드 탭에 XAMPP for Windows 를 클릭하여 다운받습니다.


        설치 과정 중에 아래 화면과 같이 옵션을 구성합니다.







        설치 완료 후, Control Panel에서 아파치를 실행시켜 줍니다.








        이후, 웹 브라우저에 localhost를 입력하여 아래와 같은 화면이 표시되는지 확인합니다.







        위 화면이 표시되지 않는다면 XAMPP가 제대로 설치되지 않은 것이니 XAMPP를 제거 후, 재 설치하시길 바랍니다. 화면에 표시되는 내용은 xampp/htdocs 디렉터리에 들어 있습니다. 우리도 앞으로 이 디렉터리에서 웹 사이트를 개발하게 됩니다.









        2.1.2 CodeIgniter 설치


        CodeIgniter 웹 사이트(http://www.codeigniter.com/download)에서 CodeIgniter 2.x 버전을 다운받습니다.

        xampp/htdocs에 있는 XAMPP 파일을 모두 삭제한 뒤에 내려받은 파일의 압축을 풀고 해당 파일을 xampp/htdocs로 복사합니다.






         다시 localhost에 접속해서 결과를 확인합니다. 아래와 같이 화면이 나오면 끝입니다.







       

       2.2 Hello World 페이지 만들기

       

        이번 절에서는 설치된 CodeIgniter의 기본 Welcome 화면을 수정하여 Hello World 페이지를 만들어 보겠습니다.


        웹 브라우저에 locahost로 접속했을 때 "Welcome to CodeIgniter"라는 화면을 봤을 것입니다. 


        주소에 컨트롤러를 입력하지 않고 호스트 명만 입력했는데 어떤 컨트롤러가 실행되고, 어떤 뷰가 화면에 출력됐습니다. 


        이런 역할을 해주는 것이 application/config/routes.php에 있습니다.


        

      1
      2
      3
      4
      5
      <?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');
       
       
      $route['default_controller'] = "welcome";
      $route['404_override'] = '';
      		cs




         4번 라인의 기본적으로 welcome.php를 실행하게 두었습니다. 사이트의 메인 화면을 main.php 컨트롤러가 담당한다면 main으로 수정해주시면 됩니다. 그 다음 도메인만 입력하고 사이트에 접속하면 메인 화면을 볼 수 있습니다. CodeIgniter의 컨트롤러는 application/controller에 작성합니다. 





         다음은 welcome.php 파일의 내용을 보도록 하겠습니다.





      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      <?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
       
      class Welcome extends CI_Controller {
       
          /**
           * Index Page for this controller.
           *
           * Maps to the following URL
           *         http://example.com/index.php/welcome
           *    - or -  
           *         http://example.com/index.php/welcome/index
           *    - or -
           * Since this controller is set as the default controller in 
           * config/routes.php, it's displayed at http://example.com/
           *
           * So any other public methods not prefixed with an underscore will
           * map to /index.php/welcome/<method_name>
           * @see http://codeigniter.com/user_guide/general/urls.html
           */
          public function index()
          {
              $this->load->view('welcome_message');
          }
      }
       
      /* End of file welcome.php */
      /* Location: ./application/controllers/welcome.php */
      		cs

        



          Line 20: CodeIgniter의 주소체계는 http://호스트/컨트롤러/메서드로 되어있습니다. 

      routes.php에서 default_controller를 welcome.php로 지정하여 컨트롤러명은 알 수 있는데 실행되는 메서드명은 알 수 없습니다. index 메서드를 선언하면 http://localhost/welcome/ 까지만 쳐도 자동으로 http://localhost/welcome/index 라고 실행이 됩니다. 에러 방지의 목적도 있기 때문에 index 메서드는 항상 만드는 것이 좋습니다.




          Line 22: 퓨 파일을 로딩하라는 의미이며 applcation/views/welcome_message.php 파일이 로딩됩니다.




        다음으로 컨트롤러에 선언된 뷰 파일(welcome_message.php)을 보겠습니다.





      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      33
      34
      35
      36
      37
      38
      39
      40
      41
      42
      43
      44
      45
      46
      47
      48
      49
      50
      51
      52
      53
      54
      55
      56
      57
      58
      59
      60
      61
      62
      63
      64
      65
      66
      67
      68
      69
      70
      71
      72
      73
      74
      75
      76
      77
      78
      79
      80
      81
      82
      83
      84
      85
      86
      87
      88
      <!DOCTYPE html>
      <html lang="en">
      <head>
          <meta charset="utf-8">
          <title>Welcome to CodeIgniter</title>
       
          <style type="text/css">
          ::selection{ background-color: #E13300; color: white; }
          ::moz-selection{ background-color: #E13300; color: white; }
          ::webkit-selection{ background-color: #E13300; color: white; }
          body {
              background-color: #fff;
              margin: 40px;
              font: 13px/20px normal Helvetica, Arial, sans-serif;
              color: #4F5155;
          }
          a {
              color: #003399;
              background-color: transparent;
              font-weight: normal;
          }
          h1 {
              color: #444;
              background-color: transparent;
              border-bottom: 1px solid #D0D0D0;
              font-size: 19px;
              font-weight: normal;
              margin: 0 0 14px 0;
              padding: 14px 15px 10px 15px;
          }
          code {
              font-family: Consolas, Monaco, Courier New, Courier, monospace;
              font-size: 12px;
              background-color: #f9f9f9;
              border: 1px solid #D0D0D0;
              color: #002166;
              display: block;
              margin: 14px 0 14px 0;
              padding: 12px 10px 12px 10px;
          }
          #body{
              margin: 0 15px 0 15px;
          }
          
          p.footer{
              text-align: right;
              font-size: 11px;
              border-top: 1px solid #D0D0D0;
              line-height: 32px;
              padding: 0 10px 0 10px;
              margin: 20px 0 0 0;
          }
          
          #container{
              margin: 10px;
              border: 1px solid #D0D0D0;
              -webkit-box-shadow: 0 0 8px #D0D0D0;
          }
         </style>
      </head>
      <body>
       
      <div id="container">
          <h1>Welcome to CodeIgniter!</h1>
       
          <div id="body">
              <p>The page you are looking at is being generated dynamically by CodeIgniter.</p>
       
              <p>If you would like to edit this page you'll find it located at:</p>
              <code>application/views/welcome_message.php</code>
       
              <p>The corresponding controller for this page is found at:</p>
              <code>application/controllers/welcome.php</code>
       
              <p>If you are exploring CodeIgniter for the very first time, you should start by reading the <a href="user_guide/">User Guide</a>.</p>
          </div>
       
          <p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds</p>
      </div>
       
      </body>
      </html>
      		cs





        welcome_message.php를 아래와 같이 수정해서 hello world 문구를 띄워봅시다.




      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      33
      34
      35
      36
      37
      38
      39
      40
      41
      42
      43
      44
      45
      46
      47
      48
      49
      50
      51
      52
      53
      54
      55
      56
      57
      58
      59
      60
      61
      62
      63
      64
      65
      66
      67
      68
      69
      70
      71
      72
      73
      74
      75
      76
      77
      78
      79
      80
      <!DOCTYPE html>
      <html lang="en">
      <head>
          <meta charset="utf-8">
          <title>Welcome to CodeIgniter</title>
       
          <style type="text/css">
          ::selection{ background-color: #E13300; color: white; }
          ::moz-selection{ background-color: #E13300; color: white; }
          ::webkit-selection{ background-color: #E13300; color: white; }
          body {
              background-color: #fff;
              margin: 40px;
              font: 13px/20px normal Helvetica, Arial, sans-serif;
              color: #4F5155;
          }
          a {
              color: #003399;
              background-color: transparent;
              font-weight: normal;
          }
          h1 {
              color: #444;
              background-color: transparent;
              border-bottom: 1px solid #D0D0D0;
              font-size: 19px;
              font-weight: normal;
              margin: 0 0 14px 0;
              padding: 14px 15px 10px 15px;
          }
          code {
              font-family: Consolas, Monaco, Courier New, Courier, monospace;
              font-size: 12px;
              background-color: #f9f9f9;
              border: 1px solid #D0D0D0;
              color: #002166;
              display: block;
              margin: 14px 0 14px 0;
              padding: 12px 10px 12px 10px;
          }
          #body{
              margin: 0 15px 0 15px;
          }
          
          p.footer{
              text-align: right;
              font-size: 11px;
              border-top: 1px solid #D0D0D0;
              line-height: 32px;
              padding: 0 10px 0 10px;
              margin: 20px 0 0 0;
          }
          
          #container{
              margin: 10px;
              border: 1px solid #D0D0D0;
              -webkit-box-shadow: 0 0 8px #D0D0D0;
          }
         </style>
      </head>
      <body>
       
      <div id="container">
          <h1>Hello world</h1>
       
          <div id="body">
              <p> 코드이그나이터 설치 후 볼 수 있는 화면입니다.</p>
          </div>
       
          <p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds</p>
      </div>
       
      </body>
      </html>
      		cs





       이번 절에서는 CodeIgniter의 Welcome 화면을 변경하여 원하는 결과를 화면에 출력했습니다. 


       다음 장에서는 이번 절에서 빠진 모델을 추가하여 MVC 패턴으로 Todo Application을 만들어 보겠습니다.










      * 이 포스트는 서적 '만들면서 배우는 CodeIgniter 프레임워크'를 참고하여 작성하였습니다.

      저작자표시

      'Web > CodeIgniter' 카테고리의 다른 글

      [CodeIgniter] 5. 폼 검증하기  (0) 2015.08.24
      [CodeIgniter] 4. 게시판 프로젝트 - 수정, 삭제  (0) 2015.08.23
      [CodeIgniter] 4. 게시판 프로젝트 - 검색, 입력, 보기 기능  (1) 2015.08.23
      [CodeIgniter] 4. 게시판 프로젝트 - DB 설계, 페이징 처리  (0) 2015.08.21
      [CodeIgniter] 3. Todo 애플리케이션 프로젝트  (0) 2015.08.21
      [CodeIgniter] 1. CodeIgniter 소개  (0) 2015.07.17

      관련글 관련글 더보기

      댓글

    Designed by Tistory.

    티스토리툴바