CodeIgniter 2.0.X

CodeIgniter
PHP Framework 2.0.X
Appleboy (Bo-Yi Wu)
2011.04.16
2011.04.17 1

內容皆採用創用 CC 姓名標示 - 相
同方式分享 3.0 台灣授權條款

2011.04.17 2

感謝
● OSSF 自由軟體鑄造場工作坊
● KaLUG 社群
● 現場所有工作人員或聽眾

2011.04.17 3

今天上課如果有任何問題
麻煩請舉手直接打斷講課過程
因為您的問題或許是大家的共同問題

2011.04.17 4

這份投影片適合 PHP 初學者
及尚未使用過 Framework 有幫助
( 熟悉 MVC 的長輩們就不用聽這些了 )

2011.04.17 5

今天來推廣 CodeIgniter PHP Framework
教大家如何快速開發網站
不必一個人辛苦默默從”無 ”寫到有

2011.04.17 6

Who Am I
Bo-Yi Wu (appleboy)
CodeIgniter 台灣繁體中文手冊翻譯
CodeIgniter 台灣繁體中文網站及討論區
CodeIgniter PHP Plurk API (github)
CodeIgniter Google Short URL API (github)
Contact
appleboy.tw At gmail.com
http://plurk.com/appleboy46
http://blog.wu-boy.com
Now
正文科技有限公司 (Software Department)
- Linux Kernel Driver, Soho Router Integration
- Android G-Sensor Driver
2011.04.17 7

尚未使用 Framework 的設計模式

2011.04.17 8

Evolution of Web Development

最新消息
最新消息 News.php

關於我們
關於我們 About.php
公司網站
公司網站

產品資訊
產品資訊 Product.php

聯絡我們
聯絡我們 Contact.php
2011.04.17 9

Evolution of Web Development

新增新聞
新增新聞
Add

Delete 刪除新聞
刪除新聞 MySQL
News.php
Edit 修改新聞
修改新聞

http://xxxx.com.tw/news.php?mode=[add|delete|edit]&news_id=xxxx
2011.04.17 10

$action = (isset($_GET['mode'])) ? $_GET['mode'] : 'add';
switch($action)
{
case 'add':
echo 'add news';
$sql = “insert into xxxx values('aa', 'bb')”;
case 'edit':
echo 'edit news';
$sql = “update xxx set title = 'title name' where id = '1'”;
case 'delete':
echo 'delete news';
$sql = “delete xxx where id = '1'”;
}
2011.04.17 11

一個模組一個檔案
● SQL 語法 , CSS html, PHP 全部寫在同一檔案
● 維護困難
● 擴充性差
● 程式雜亂
● 無法交接
● 系統漏洞 SQL Injection
● 開發速度慢
● 後輩愈看愈不爽，砍掉重練？太難維護
– 後後輩更不爽，又砍掉？
● …..........................
2011.04.17 12

Why use PHP Framework?

2011.04.17 13

為了加快網站開發速度及維護
模組化套件 , 方便閱讀程式碼
所以 PHP Framework 誕生

2011.04.17 14

Public Web Framework

2011.04.17 15

Why Choose CodeIgniter?

2011.04.17 16

Why Choose CodeIgniter ?
1. Small ( 非常小 )
2. Fast ( 非常快速，想用什麼就 load 什麼 )
3. Simple ( 程式架構容易 )
4. High Performance (CI vs ZF vs CakePHP)
5. Nearly Zero Configuration ( 五分鐘內搞定 )
6. Cleaner Code ( 方便學習擴充 Framework)
7. 由我本人親自支援 ( 歡迎討論區留言 )

2011.04.17 17

What is CodeIgniter ?

Open Source Web Application Framework

MVC (Model View Controller) Architecture

2011.04.17 18

CodeIgniter 版本演進
● Version 1.7.1 Release: 2009.02.10
● Version 1.7.3 Security patch
● Version 2.0.0 Release: 2011.01.28 2 month
1 month
Thanks for CodeIgniter Reactor

2011.04.17 19

MVC Architecture
Database LAYOUT

MODEL View

Controller

ROUTES

WEB SERVER

Client BROWSER
2011.04.17 20

MVC
View (views/product.php)
<html>
View <body>
<p>Product Count:<?=$count?></p>
</body>
</html>
Controller (controllers/product.php)
function showProduct($id) {
$this->load->model(“product”);
Controller $count = $this->product->getCount($id);
$data[‘count’] = $count;
$this->load->view(“product”, $data);
}

Model (controllers/product.php)
function getCount($id) {
$this->db->where(“id”, $id);
$this->db->from(“my_product”);
Model $query = $this->db->get();
return $->num_rows();
}
2011.04.17 21

Application Flow Of CodeIgniter

CodeIgniter Plugin 已經在 2.0.X 被移除
2011.04.17 22

How to install CodeIgniter ?

2011.04.17 23

System Requirement 系統需求
● System
● Windows, Linux(Fedora, Ubuntu), FreeBSD
● PHP
● Version 5.1.6 (not support PHP 4 for 2.0.x 系列 )
● 如果要支援 PHP 4 請使用 CI 1.7.x 系列
● Database
● MySQL (4.1+), MySQLi, MS SQL, Postgres, Oracle,
SQLite, 以及 ODBC

2011.04.17 24

以最短時間內安裝完成
● Windows + Appserv ( 推薦 )
● FreeBSD + Ports (www/codeigniter-devel)
● Ubuntu + apt ( 完成 AMP 架構 )

2011.04.17 25

以最快速度安裝好 CodeIgniter 環境
(Windows + Appserv + CodeIgniter 2.0)

2011.04.17 26

Windows 環境安裝步驟
● 請先準備好 Windows OS (XP, Win 7)
● 下載 CodeIgniter 2.0.X 安裝檔
● 請參考 http://www.codeigniter.org.tw
● 解壓縮到 C 槽 Appserv/www 目錄
● 重新命名目錄
● CodeIgniter_2.0.2 → CodeIgniter
● 打開瀏覽器鍵入
● http://localhost/CodeIgniter/
2011.04.17 27

請大家先安裝好 CodeIgniter 環境

2011.04.17 28

完成畫面

2011.04.17 29

CodeIgniter 目錄架構
● application/
● 專案目錄 ( 存放所有前端後端程式碼 )
● system/
● CodeIgniter 核心目錄 ( 不需要更動 )
● user_guide/
● CodeIgniter Document ( 可以看中文版 )
● index.php

2011.04.17 30

根目錄 Index.php 設定
● $system_path : 系統核心目錄設定
● $application_folder : 專案目錄設定
● 如果多專案，可以將核心目錄共用

2011.04.17 31

專案目錄 application
● application
● Cache ( 網站快取檔案 )
● Config ( 網站設定檔 : 資料庫 ....)
● Controllers ( 所有控制 )
● Libraries ( 共用函式 )
● Models ( 資料庫檔案 )
● Views ( 前端 html, css)

2011.04.17 32

CodeIgniter URL
● example.com/index.php/news/show/article_id
● news 代表 Controller
● show 代表 Controller 類別內的函式或 Method
● article_id 代表 ID 或任何參數傳入給 Method

● 範例 : 比對以前設計
example.com/news.php?mode=show&id=1

2011.04.17 33

移除 index.php 檔案
● mod_rewrite 功能
● 利用 .htaccess 移除 URL 所包含的 index.php

2011.04.17 34

任意副檔名
● CodeIgniter/index.php/welcome/index
● 可以在 index 後面任意加上副檔名
● 範例 :
● codeIgniter/index.php/welcome/index.html
● codeIgniter/index.php/welcome/index.htm
● codeIgniter/index.php/welcome/index.py
● 修改 application/config/config.php
● $config['url_suffix'] = '.py';

2011.04.17 35

Controllers
● example.com/index.php/blog/
● 直接找到 application/controllers/blog.php

<?php
class Blog extends CI_Controller {

public function index()
{
echo 'Hello World!';
}
}
?>
2011.04.17 36

Controller Functions
● example.com/index.php/blog/index
● example.com/index.php/blog/comments
<?php

public function index()
{
echo 'Hello World!';
}

public function comments()
{
echo 'Look at this!';
}
}
?>
2011.04.17 37

類別建構子
<?php

public function __construct()
{
parent::__construct();
// Your own constructor code
$this->load->helper('url');
$this->load->library('email');
}
}
?>

2011.04.17 38

Default Controller
● example.com/index.php/welcome/index
● example.com/

● 修改設定檔
● application/config/routes.php
● $route['default_controller'] = 'welcome';

2011.04.17 39

作業
● 請新增 Blog Controller
● 裏面包含兩個 method
● Index and person
● Index method
● 傳入自己的 ID 比如是 appleboy
● 畫面會顯示 : Hi appleboy, 歡迎來到 CodeIgniter
● person method
● 產生 3 個 input text (name, company, phone)
● 帶入 3 個參數可以分別寫入上述欄位
2011.04.17 40

Views
● 檔案放置 application/views/
● 任意新增檔案 blogview.php
<html>
<head>
<title>My Blog</title>
</head>
<body>
<h1>Welcome to my Blog!</h1>
</body>
</html>

2011.04.17 41

如何載入 View
● $this->load->view('name');
● $this->load->view('folder_name/file_name');
<?php

function index()
{
$this->load->view('blogview');
}
}
?>
URL: example.com/index.php/blog/

2011.04.17 42

新增動態資料到 View
● $this->load->view('name', $data);
● $data 陣列格式如下
$data = array(
'title' => 'My Title',
'heading' => 'My Heading',
'message' => 'My Message'
);

$this->load->view('blogview', $data);

2011.04.17 43

Views 接受 $data 顯示資料
● 顯示格式如下

<html>
<head>
<title><?php echo $title;?></title>
</head>
<body>
<h1><?php echo $heading;?></h1>
<hr>
<div><?php echo $message;?></div>
</body>
</html>

2011.04.17 44

顯示迴圈
● Controller 程式
<?php

function index()
{
$data['todo_list'] = array('Clean House' ， 'Call
Mom' ， 'Run Errands');
$data['title'] = "My Real Title";
$data['heading'] = "My Real Heading";

$this->load->view('blogview', $data);
}
}
?>
2011.04.17 45

<html>
<head>
<title><?php echo $title;?></title>
</head>
<body>
<h1><?php echo $heading;?></h1>

<h3>My Todo List</h3>

<ul>
<?php foreach($todo_list as $item):?>

<li><?php echo $item;?></li>

<?php endforeach;?>
</ul>

</body>
</html>
2011.04.17 46

將 views 存到變數
● 用途 : 常常用在 AJAX (demo)
● $string = $this->load->view('myfile', $data, TRUE);
● 將第 3 個參數設定為 true
● 範例如下
$string = $this->load->view('blogview', $data, TRUE);
echo $string;

2011.04.17 47

作業
● 將 blog 的 person 此 method 所有 html 變成
用 $this->load->view 方式顯示
● 產生陣列顯示在 view 如下
● CodeIgniter 非常好玩
● CodeIgniter 是開放軟體
● CodeIgniter 非常快速
● CodeIgniter 非常輕量

2011.04.17 48

Library and helper
● 載入輔助函數
● $this->load->helper('url');
● 載入多個輔助函數
● $this->load->helper( array('url', 'email') );
● 載入 Library 類別
● $this->load->library('email');
● 載��個 Library 類別
● $this->load->library(array('email', 'pagination'));
● 系統預設載入類別 (Ex: input ….);
2011.04.17 49

Input Library
● POST, COOKIE, 或 SERVER 資料
● $this->input->post()
● $this->input->cookie()
● $this->input->server()
● 取得 POST 資料
● $this->input->post('title');
● $this->input->post('title', TRUE);
– 第 2 參數使用 XSS 過濾器處理 POST 資料

2011.04.17 50

作業
● 將 person 資料填入之後送出到 add_person
此 method ，並且將三欄位資料顯示於畫面

2011.04.17 51

資料庫模型 (Models)
● 修改 application/config/database.php
● $db['default']['hostname'] = 'localhost';
● $db['default']['username'] = 'XXXXXX';
● $db['default']['password'] = 'XXXXXX';
● $db['default']['database'] = 'XXXXXX';
● $db['default']['dbdriver'] = 'mysql';

2011.04.17 52

Model 介紹
● application/models/blog_model.php

class Blog_model extends CI_Model {

function __construct()
{
}
}

2011.04.17 53

簡單 model 寫法
class Blog_model extends CI_Model {

function __construct()
{
// 呼叫模型 (Model) 的建構函數
}

function get_last_ten_entries()
{
…............
}

function insert_entry()
{
…...............
}
}
2011.04.17 54

載入 Model
● 請先務必載入 database 才可使用 model
● $this->load->database();
● $this->load->model('blog_model');
● 使用如下
– $this->blog_model->get_last_ten_entries();
– $this->blog_model->insert_entry();

2011.04.17 55

快速入門
● $query = $this->db->query("YOUR QUERY");
● $query = $this->db->query('SELECT name, title,
email FROM my_table');
foreach ($query->result() as $row)
{
echo $row->title;
echo $row->name;
echo $row->email;
}

2011.04.17 56

Database Active Record
● 查詢資料 (Selecting)
● 新增資料 (Inserting)
● 更新資料 (Updating)
● 刪除資料 (Deleting)

2011.04.17 57

新增資料 Insert
$data = array(
'title' => 'my title' ,
'name' => 'my name' ,
'date' => '2011.04.16'
);

$this->db->insert('table_name', $data);

產生 :INSERT INTO table_name (title, name, date)
VALUES ('my title', 'my name', '2011.04.16')

2011.04.17 58

作業
● 請新增資料庫 blog
● 設定 application/config/database.php 資訊
● 新增資料表 blog_author
● author_id, authod_name, author_company,
author_phone
● 新增 blog_model and add_person method
● 利用 Controller 呼叫 blog model 新增資料

2011.04.17 59

查詢資料 Selecting
● $query = $this->db->get('table_name');
● 產生 :SELECT * FROM mytable
● $query = $this->db->get('mytable', 10, 20);
● 產生 :SELECT * FROM mytable LIMIT 20, 10

2011.04.17 60

● 利用 select + get 查詢
● $this->db->select('title, content, date');
● $query = $this->db->get('mytable');
● 利用 select + from + get 查詢
● $this->db->select('title, content, date');
● $this->db->from('mytable');
● $query = $this->db->get();
– SELECT title, content, date FROM mytable
● 加上判斷條件 where
● $this->db->where('name', $name);
● $this->db->where('title', $title);
● $this->db->where('status', $status);
2011.04.17 61

查詢 Result 回傳值
● 多筆資料 ( 常用 )
● result()
● result_array()
● 單筆資料
● row()
● row_array()

2011.04.17 62

多筆資料輸出 ( 物件方式 )
$query = $this->db->query("YOUR QUERY");

if ($query->num_rows() > 0)
{
foreach ($query->result() as $row)
{
echo $row->title;
echo $row->name;
echo $row->body;
}
}
2011.04.17 63

多筆資料輸出 ( 陣列方式 )

{
foreach ($query->result_array() as $row)
{
echo $row['title'];
echo $row['name'];
echo $row['body'];
}
}
2011.04.17 64

單筆資料輸出 ( 物件方式 )

{
$row = $query->row();

echo $row->title;
echo $row->name;
echo $row->body;
}

2011.04.17 65

單筆資料輸出 ( 陣列方式 )

{
$row = $query->row_array();

echo $row['title'];
echo $row['name'];
echo $row['body'];
}

2011.04.17 66

作業
● 將資料表 blog_author 所有資料顯示出來
● 新增 blog_model get_all_data method
● 將所有資料回傳給 blog controller
● 將資料傳到 view 條列式顯示出來

2011.04.17 67

更新資料 (Updating)
$data = array(
'title' => $title,
'name' => $name,
'date' => $date
);

$this->db->where('id', $id);
$this->db->update('mytable', $data);

產生 : UPDATE mytable SET title = '{$title}', name =
'{$name}', date = '{$date}' WHERE id = $id

2011.04.17 68

作業
● 在 person 顯示畫面加入”編輯”連結
● 點選之後會顯示該筆資料
● 修改完成之後，按下儲存可以覆蓋該筆資料

2011.04.17 69

刪除資料 (Deleting)
● $this->db->where('id', $id);
● $this->db->delete('mytable');
● 產生 : DELETE FROM mytable WHERE id = $id

2011.04.17 70

作業
● 在 person 顯示畫面加入”刪除”連結
● 點選該連結會刪除該筆資料，並且返回 person
顯示畫面

2011.04.17 71

join 兩表格
$this->db->select('*');
$this->db->from('blogs');
$this->db->join('comments', 'comments.id = blogs.id', 'left');

$query = $this->db->get();

產生 :SELECT * FROM blogs LEFT JOIN comments ON
comments.id = blogs.id

2011.04.17 72

期末作業
● 實做部落格發文系統
● 部落格作者資料表 blog_author
● 發表文章時，可以下拉選擇作者 blog_author
● 可以新增刪除修改顯示文章
– 請新增 blog_post 資料表
● post_id, author_id, post_title, post_data, add_time, edit_time
– 用 join 方式將作者顯示在畫面

2011.04.17 73

今天課程就到這裡
如果有任何問題都可以發問
大家辛苦了 , 期末作業要交喔

2011.04.17 74

Thank You

2011.04.17 75

CodeIgniter 2.0.X

Related slideshows

More Related Content

CodeIgniter 2.0.X