Transcript day3day4
Day3 Day4
小山健一郎
Fusic Co.,Ltd.
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
1
Day3
第1回の宿題の発表
前回のおさらい
CakePHPについて
最近のWebアプリケーションの開発方
法
Webアプリケーションフレームワーク
(以下Webフレームワーク)とは
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
2
第1回宿題発表
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
3
第1回宿題
複数のテーブルに対するSQL言語の
演習（ものまね）を行ってください
複数のテーブルを使ったＷｅｂアプ
リケーションをペアで作成してくだ
さい
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
4
前回おさらい
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
5
前回のおさらい
WebとWebアプリケーション
HTML
PHP
データベースとSQL
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
6
World Wide Webとは
ブラウザから「http://www.～」と入
力することでいろいろなWebページ
を見せているしくみ。
World Wide Web
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
7
Webページの表示の仕組み
1
“http://www.yahoo.co.jp/index.html”で
指定されるファイルをリクエスト
index.html
Webサーバ
2
“index.html”ファイルを
レスポンスとして返す
3
“index.html”ファイルを
整形（レンダリング）して
表示
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
8
HTML
Webページを作成するためのマーク
アップ言語。
index.htmlはHTMLで書かれたテキス
トファイル。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
9
Webアプリケーションとは
(Webページをただ表示するだけでな
い)Webの機能や特徴を利用したアプリ
ケーション。
例えば、、、
データを登録していつでも参照できるように
できる。
Blog
ログイン機能を持たせて会員しか表示しない
ようにする。
SNS
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
10
Webアプリケーションの
処理の仕組み
1
“http://www.yahoo.co.jp/index.php”の
ページ内容をリクエスト
リクエストを元に処理をする
（データの登録、編集、閲覧、削除）
Webサーバ
2
処理の結果をindex.phpとして
レスポンスとして返す
3
“index.php”ファイルを
整形（レンダリング）して
表示
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
11
PHP
Webアプリケーションの処理の部分
を書くことができるプログラム言語
の1つ。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
12
Webアプリケーションを作成するには
リクエストとレンダリングはブラウザが担当
します。
レスポンスはWebサーバが担当します。
処理をプログラムとして書く必要があります。
今回は
プログラミング言語としてPHPを選択し、
実際にWebアプリケーションを作成しています。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
13
データを保存するには
データベースサーバと呼ばれるデータを格納す
ることに特化したシステムを使用します。
今回はMySQLを使用しています。
データベースサーバを管理するデータベース管
理システム(DBMS)へ命令するための言語がSQL
です。
データベースサーバ
データベースmydb
の中のテーブル
booksの中からカラ
ムisbnが
98284795825の
データを取得せよ。
SQL
DBMS
データベース
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
14
CakePHPについて
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
15
CakePHPとは
CakePHPとはPHPで書かれたWebフ
レームワークです。
CakePHPのようなWebフレームワー
クを使いこなせると、より高速に、
より直感的に、より抽象的に、Web
アプリケーションの開発ができます。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
16
ハンズオン
「実際にCakePHPでブログを作成して
みましょう」
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
17
CakePHPチュートリアル
The Cookbookにあるブログチュート
リアルをbakeを使用して実際にこな
してみる。
bake:データベーステーブルを利用した
ソースコード自動生成スクリプト
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
18
ブログシステム仕様 [10.1]
エントリーを投稿できて(Create)表示
できて(Read)編集できて(Update)削
除できる(Delete)システム。
使用言語:PHP
フレームワーク:CakePHP
データベースサーバ:MySQL
Webサーバ:Apache
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
19
Cakeをダウンロード[10.1.1]
あらかじめ各アカウントのディレク
トリにファイルは展開してあります。
WinSCPで実際にディレクトリが作成
されているか確認してください。
以下のURLにアクセスしてみましょ
う。
http://rd.lib.kyushu-u.ac.jp/~アカウント
/cakephp/
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
20
ブログデータベースの作成[10.1.2]
自分のアカウント名でデータベース
を作成します。
チュートリアルと同じテーブルと
データを作成/登録します。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
21
Cakeのデータベース設定[10.1.3]
チュートリアルにしたがって設定し
てみましょう。
再度ブラウザで見てみましょう。
http://rd.lib.kyushu-u.ac.jp/~アカウント
/cakephp/
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
22
追加の設定[10.1.4]
チュートリアルにしたがって設定し
てみましょう。
再度ブラウザで見てみましょう。
http://rd.lib.kyushu-u.ac.jp/~アカウント
/cakephp/
オールグリーンになっていたら成功で
す。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
23
Bakeでコードを生成する[9.1]
ここからチュートリアルから離れて一気
に進みます。
PuTTYで接続しcake/console/ディレクト
リまで移動してください。
MCVの順でソースコードを生成して行き
ます。
再度ブラウザで見てみましょう。
http://rd.lib.kyushu-u.ac.jp/~アカウント
/cakephp/posts/
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
24
Coffee Break
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
25
Coffee Break:プログラマの特性
プログラマは大抵面倒くさがり。
開発中、同じコードを何度も書きたく
ない。
(さらに)開発中、同じようなコードを何
度も書きたくない。
(それどころか)同じようなコードは一生
書きたくない。
面白そうなコードだけ書いて暮らしたい！
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
26
Coffee Break:プログラマの特性
じゃあどうする？
小さな同じ処理は関数化してしまおう。
わかりやすいように、意味的に近い処理をグループ
化してしまおう(文字に関する関数(メソッド)群、○○
を処理するための関数と変数(プロパティ)群)。
同じ処理は書かない。
ひとくくりにして意味的にもわかりやすく。呼び出しも楽に。
同じような処理も大体同じなのだから全体を継承し
て違う部分だけ上書きしよう。
同じようなコードも書かない。
構造化プログラミングやオブジェクト指
向プログラミングが誕生する理由
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
27
CakePHPについて(続き)
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
28
Webアプリケーションの特徴
データを登録して(Create)
データを参照して(Read)
データを編集して(Update)
データを削除して(Delete)
どんなアプリケーションも大抵こればかり
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
29
Webアプリケーションの特徴
他には、、、
データベースに接続して
SQLでデータベースを操作して
HTMLを生成して
画像を表示して
formがあってデータを入力させて
どんなアプリケーションも大抵こればかり
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
30
最近のWebアプリケーション開発
「データベースに対するCRUD」の特性に
収まりやすいWebアプリケーションの特
徴
汎用的な処理はまとめてずっと使いたい
コーディングのルールに一定の制約を持
たせて連携開発をしやすくしたい
Webフレームワークを
使用して開発するのが主流
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
31
Webフレームワーク
Webアプリケーション開発をサポー
トするための枠組み(プログラム)
データベースの操作
汎用的処理のライブラリ
HTMLページのテンプレート
セッション管理
セキュリティ
etc.
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
32
Webフレームワーク
PHP
CakePHP、Zend Framework、symfony
Ruby
Ruby on Rails
Perl
Catalyst、Sledge、Jifty、Mojo
Java
SAStruts、Seasar、Spring、Grails
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
33
CakePHP
CakePHP enables PHP users at all
levels to rapidly develop robust web
applications.
最近のWebフレームワークの先駆け
であるRuby on Railsの影響を多分に
受けている。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
34
Day4
CakePHPを利用するにあたっての有用な情報源
the cookbookの紹介と日本人翻訳チームの貢献について
CakePHP User Forumの紹介
MVCの概念
Webアプリケーションにおけるデータの流れ。(MVC)
モデルという考え方とデータベースのテーブル(MC)
処理と表示をわけることの大切さ。楽さ。(VC)
ブログチュートリアル＋
ソースレビュー
bakeだけでWebアプリケーションを作成(演習)
リレーションの大切さを理解する
debuglibによるデータ構造の理解(演習)
Webアプリケーションの作成
さらに機能を追加してみる(演習)
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
35
CakePHPを利用するにあたっての有用
な情報源
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
36
The Cookbook
http://book.cakephp.org/ja/
CakePHPのマニュアルサイト/システ
ム
マニュアルサイトであると同時にマ
ニュアル作成システム+多言語翻訳シス
テムでもあります。
日本語翻訳チームの貢献が全世界で1
位！
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
37
CakePHP Users in Japan
http://cakephp.jp/modules/newbb/
CakePHPに関する情報を収集したサ
イト/フォーラム
CakePHPの日本語情報が最も集まって
いるサイト
フォーラムの交流も非常に活発です。
検索すれば大抵の問題は解消します。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
38
MVCの概念
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
39
MVCの概念
MVCとはModel、View、Controllerの
頭文字をとったもの。
CRUDとは別の切り口でWebアプリ
ケーションを表している
データを操作し(Model)
ユーザの入力に応答し、処理をし
(Controller)
表示し、ユーザの入力を受け取る(View)
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
40
MVCの概念
V
C
M
データベース
どんな画面を
表示するか。
受け取った入
力からどんな
処理をするか。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
どのようにデー
タを処理するか。
41
MVCの概念(例:Blog)
V
C
M
データベース
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
42
MVCの概念(例:Blog)
V
C
アクセス
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
43
MVCの概念(例:Blog)
V
C
M
呼び出し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
データベース
44
MVCの概念(例:Blog)
V
C
M
データ
取得
データベース
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
45
MVCの概念(例:Blog)
V
C
M
データ
渡し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
データベース
46
MVCの概念(例:Blog)
V
C
データ
渡し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
47
MVCの概念(例:Blog)
V
C
表示
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
48
MVCの概念(例:Blog)
V
C
入力
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
49
MVCの概念(例:Blog)
V
C
データ
渡し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
50
MVCの概念(例:Blog)
V
C
M
データベース
処理
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
51
MVCの概念(例:Blog)
V
C
M
呼び出し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
データベース
52
MVCの概念(例:Blog)
V
C
M
処理
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
データベース
53
MVCの概念(例:Blog)
V
C
M
データ
登録/取得
データベース
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
54
MVCの概念(例:Blog)
V
C
M
データ
渡し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
データベース
55
MVCの概念(例:Blog)
V
C
データ
渡し
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
56
MVCの概念(例:Blog)
V
C
表示
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
データベース
57
Modelとデータベーステーブル
Modelはひとくくりのデータ群を扱う
ための処理のくくり。
データベースの1つテーブルは大抵ひ
とくくりのデータ群。
例外もあります。
2つのテーブルでひとくくりのデータ群に
扱えるものもあるし、1つのテーブルで複
数のデータ群になることもあります。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
58
Modelとデータベーステーブル
Postモデル
Categoryモデル
Userモデル
M
M
M
postsテーブル categoriesテーブル usersテーブル
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
59
ロジック(処理)とビュー(表示)
データの処理は主にPHP、データの表示
は主にHTML。
処理のコーディングのときはできるだけ
処理のことだけ考えていたいはず。
HTMLタグやCSSのことは頭から離したい。
表示のコーディングのときはできるだけ
表示のことだけ考えていたいはず。
データベースへの接続や操作などは頭から離
したい。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
60
ロジック(処理)とビュー(表示)
HTMLヘッダー
データベース接続
<h1>タイトル</h1>
データ取得
データ加工
データ表示処理
</html>
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
61
ロジック(処理)とビュー(表示)
HTMLヘッダー
データベース接続
<h1>タイトル</h1>
データ取得
データ表示処理
データ加工
</html>
データセット
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
62
MVC
データベース接続
HTMLヘッダー
<h1>タイトル</h1>
Model呼び出し
データ取得
データ表示処理
データセット
データ加工
</html>
V
C
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
M
63
ソースレビュー
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
64
ソースレビュー
Day3で実際に生成したソースをレ
ビューします。
app/models/post.php
app/controllers/posts_controller.php
app/views/posts/*.ctp
cake/lib/views/layouts/default.ctp
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
65
CakePHPのMVC(posts/index)
V
C
M
データベース
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
66
CakePHPのMVC(posts/index)
cake/lib/views
/layouts/default.ctp
V
C
M
データベース
app/views/index.ctp
app/controllers
/posts_controller.php
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
app/models
/post.php
67
ブログチュートリアル+
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
68
ブログシステムのバージョンアップ
bakeを使ってDay3で作成したブログ
システムをさらにバージョンアップ
させます。
投稿エントリーにカテゴリという属
性をつけてみましょう。
投稿エントリーに投稿ユーザという
属性をつけてみましょう。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
69
Modelとデータベーステーブル
Postモデル
Categoryモデル
Userモデル
M
M
M
postsテーブル categoriesテーブル usersテーブル
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
70
Modelとデータベーステーブル
id
title
bod
cotegory_ user_
d
d
postsテーブル
id
title
categoriesテーブル
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
id
name
usersテーブル
71
debuglib.phpによるデータ構造の理解
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
72
debuglib.php
phpの配列構造を分かりやすく表示す
るためのライブラリ
http://www.atomar.de/debuglib/
print_a()という関数が使えるようになる。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
73
debuglibの設定
debuglib.phpをダウンロードして以下の
ディレクトリに設置
app/vendors/debuglib.php
app/config/bootstrap.phpに以下の設定を
追記。
App::import('Vendor','debuglib');
何でもいいので配列を出力してみましょ
う。
print_a($array);
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
74
ハンズオン
さらにバージョンアップするための
演習
今まで作成したBlogをさらにバー
ジョンアップさせてください。
bakeを使ってでもいいですし、直に書
き加えても構いません。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
75
宿題(案)
CakePHPでアプリケーションを作成
しましょう。
Day3 Day4 Copyright (c) 2009 Fusic Co.,Ltd.
76