• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Ci tutorial
 

Ci tutorial

on

  • 1,875 views

CodeIgniter's first tutorial.

CodeIgniter's first tutorial.

Statistics

Views

Total Views
1,875
Views on SlideShare
1,875
Embed Views
0

Actions

Likes
1
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as OpenOffice

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Ci tutorial Ci tutorial Presentation Transcript

    • CodeIgniter 最初の一歩 CodeIgniterが インストールできたので とりあえず Tutorialをやってみた 編
    • basic news application 最初のチュートリアルを実際に試してみます。 このチュートリアルで学ぶことは、● Model, View, Controller の基本● Routingの基本● Form Validation(妥当性の確認)● 基本的なDBクエリ
    • 目的はhttp://example.com/news/latest/10というURIにアクセスして最新のニュースを10件表示できること。
    • pagesコントローラまずページのコントローラを作ります。次のファイルを作成。application/controllers/pages.php <?php class Pages extends CI_Controller { public function view($page = home) { } }
    • テンプレート(header)● テンプレートとしてheaderを作ります。 application/views/templates/header.php<html><head> <title><?php echo $title ?> - CodeIgniter 2 Tutorial</title></head><body> <h1>CodeIgniter 2 Tutorial</h1>
    • テンプレート(footer)● テンプレートとしてfooterを作ります。 application/views/templates/footer.php<strong>&copy; 2011</strong></body></html>
    • 静的コンテンツを用意 application/views/pages/ 上記フォルダに、● home.php● about.php というファイルを作成します。 中身は適当な文章でOK。 Hello World!! とか
    • コントローラにロジック追加先のapplication/controllers/pages.phpを編集public function view($page = home){ if ( ! file_exists(application/views/pages/.$page..php)) { // Whoops, we dont have a page for that! show_404(); } $data[title] = ucfirst($page); // Capitalize the first letter $this->load->view(templates/header, $data); $this->load->view(pages/.$page, $data); $this->load->view(templates/footer, $data);}
    • 前のページの補足● ページの指定がなければhomeを表示● 指定のページがなければ404を表示● タイトルの先頭を大文字に● ヘッダを表示● 指定ページを表示● フッタを表示
    • Routingここまでの作業でページへのアクセス可能http://example.com/index.php/pages/view/about おー!! エッ 文字化け しとるやん...
    • 文字化け...orz Tutorialでは言語を意識していない いきなり日本語を使うと文字化け template(header)を修正<html lang=”ja”><head><meta charset=”utf-8”> <title><?php echo $title ?> - CodeIgniter 2 Tutorial</title></head><body> <h1>CodeIgniter 2 Tutorial</h1>
    • 文字化け対策後● headerを修正して確認 おー!! 最初から やっとけー まぁまぁ、 こんなもん 次、はよっ
    • さて、Routingの続き● application/config/routes.php Routingを編集することで、 $route[default_controller] = pages/view; $route[(:any)] = pages/view/$1;
    • Routingの続きの続きhttp://example.com/index.php/pages/view/aboutを次のように短くできます。http://bit.ly/SvEOQ8ではなくて、http://example.com/index.php/about
    • http://bit.ly/ObpOBdちなみに、このタイトルはexample.com/Routingの続きの続きの続きを短くしてみました。 すみまs(ry
    • http://bit.ly/ObpOBdちなみに、このタイトルはexample.com/Routingの続きの続きの続きを短くしてみました。 すみまs(ry
    • Coffee Break(CodeIgniterよりもInkScapeのチュートリアルが...)
    • Newsセクション Newsモデルを作ります。● application/models/news_model.php <?php class News_model extends CI_Model { public function __construct() { $this->load->database(); } }
    • その前にDB環境● application/config/database.php 適宜編集。 $db[default][hostname] = "localhost"; $db[default][username] = "root"; $db[default][password] = ""; $db[default][database] = "database_name"; $db[default][dbdriver] = "mysql"; $db[default][dbprefix] = ""; $db[default][pconnect] = TRUE; $db[default][db_debug] = FALSE; $db[default][cache_on] = FALSE; $db[default][cachedir] = ""; $db[default][char_set] = "utf8"; $db[default][dbcollat] = "utf8_general_ci"; $db[default][swap_pre] = ""; $db[default][autoinit] = TRUE; $db[default][stricton] = FALSE;
    • スキーマ(テーブル)● SQLでテーブルを作成 CREATE TABLE news ( id int(11) NOT NULL AUTO_INCREMENT, title varchar(128) NOT NULL, slug varchar(128) NOT NULL, text text NOT NULL, PRIMARY KEY (id), KEY slug (slug) );
    • phpMyAdmin● SQLを実行
    • DB参照(クエリ)● newsを取得するメソッドを追加 public function get_news($slug = FALSE) { if ($slug === FALSE) { $query = $this->db->get(news); return $query->result_array(); } $query = $this->db->get_where(news, array(slug => $slug)); return $query->row_array(); }
    • Newsの表示 Newsを表示するためのコントローラを記述● application/controllers/news.php <?php class News extends CI_Controller { public function __construct() { parent::__construct(); $this->load->model(news_model); } public function index() { $data[news] = $this->news_model->get_news(); } public function view($slug) { $data[news] = $this->news_model->get_news($slug); } }
    • 前のコントローラでは● データを取得しているだけ(表示なし)● ということで、Viewにデータを渡します。 public function index() { $data[news] = $this->news_model->get_news(); $data[title] = News archive; $this->load->view(templates/header, $data); $this->load->view(news/index, $data); $this->load->view(templates/footer); }
    • NewsのViewを作成 コントローラから渡されるデータを展開して 表示● application/views/news/index.php を作成<?php foreach ($news as $news_item): ?> <h2><?php echo $news_item[title] ?></h2> <div id="main"> <?php echo $news_item[text] ?> </div> <p><a href="news/<?php echo $news_item[slug] ?>">View article</a></p><?php endforeach ?>
    • 個別のNews表示 スラッグで個別のNewsを取得(Controller)public function view($slug){ $data[news_item] = $this->news_model->get_news($slug); if (empty($data[news_item])) { show_404(); } $data[title] = $data[news_item][title]; $this->load->view(templates/header, $data); $this->load->view(news/view, $data); $this->load->view(templates/footer);}
    • 個別のNews表示(View)● application/views/news/view.php <?php echo <h2>.$news_item[title].</h2>; echo $news_item[text];
    • News用のRouting● application/config/routes.php $route[news/(:any)] = news/view/$1; $route[news] = news; $route[(:any)] = pages/view/$1; $route[default_controller] = pages/view; http://example.com/index.php/news でアクセス可能に。
    • Newsの投稿 フォームを作ります。● application/views/news/create.php <h2>Create a news item</h2> <?php echo validation_errors(); ?> <?php echo form_open(news/create) ?> <label for="title">Title</label> <input type="input" name="title" /><br /> <label for="text">Text</label> <textarea name="text"></textarea><br /> <input type="submit" name="submit" value="Create news item" /> </form>
    • Controllerにcreate()を追加● application/controllers/news.php public function create() { $this->load->helper(form); $this->load->library(form_validation); $data[title] = Create a news item; $this->form_validation->set_rules(title, Title, required); $this->form_validation->set_rules(text, text, required); if ($this->form_validation->run() === FALSE) { $this->load->view(templates/header, $data); $this->load->view(news/create); $this->load->view(templates/footer); } else { $this->news_model->set_news(); $this->load->view(news/success); } }
    • Controllerにcreate()を追加● application/controllers/news.php public function create() { $this->load->helper(form); $this->load->library(form_validation); $data[title] = Create a news item; $this->form_validation->set_rules(title, Title, required); $this->form_validation->set_rules(text, text, required); if ($this->form_validation->run() === FALSE) { $this->load->view(templates/header, $data); $this->load->view(news/create); $this->load->view(templates/footer); } else { $this->news_model->set_news(); $this->load->view(news/success); } }
    • Successメッセージ● application/view/news/success.php 「ニュースの登録が完了しまし た。」 みたいなコンテンツ(HTML)を作成。
    • DBに登録(Modelの処理)● application/models/news_model.phpを編集 public function set_news() { $this->load->helper(url); $slug = url_title($this->input->post(title), dash, TRUE); $data = array( title => $this->input->post(title), slug => $slug, text => $this->input->post(text) ); return $this->db->insert(news, $data); }
    • ちなみに、前のhelper()● URL Helper いろいろ助けてくれます。 ここで使っているのは、● url_title() Newsのタイトルから URLに適した文字列を生成 例) This is the Title this_is_the_title
    • Routing● config/routes.php $route[news/create] = news/create; $route[news/(:any)] = news/view/$1; $route[news] = news; $route[(:any)] = pages/view/$1; $route[default_controller] = pages/view;
    • newsを表示してみる● http://mydomain/site1/index.php/news 中身はまだない
    • newsを登録● http://mydomain/site1/index.php/news/create
    • 登録結果● successのメッセージ
    • ニュースの一覧表示Backボタンで戻ったらブラウザの再読み込みで...
    • 記事が重複...
    • しかもslugが空タイトルを全角文字にしたのがよろしくなかったようで
    • タイトルを半角に● 一覧はOK
    • View article● /site1/index.php/news/news-title-test slugは機能していた
    • 作業環境
    • お世話になりました
    • 以上ですご清聴に感謝します。 m(__)m