20110121 netcommons developer

33
2011121日 アズテック 大和田健一 ネットコモンズ モジュール開発 入門編

Upload: kenichi-ohwada

Post on 12-Nov-2014

737 views

Category:

Technology


1 download

DESCRIPTION

ネットコモンズ モジュール開発 入門編 2011年1月12日 コモンズネット研究会 @ 浜松町 アドクリエイション

TRANSCRIPT

Page 1: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ネットコモンズ

モジュール開発入門編

Page 2: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

今日の内容

1.自己紹介(1) 開発したモジュールの紹介

2.モジュール開発 入門編(1) 開発者向けチュートリアル(2) 実習+解説(3) 自由討論

Page 3: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

自己紹介

@ohwada

大和田 健一ITコンサルタントYN150プロジェクト日本アンドロイドの会 横浜支部スキューバー・ダイビング

Page 4: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

Y 横浜で

N ネットコモンズを使って

150 のウエブサイトを作ろう

YN150 プロジュクト

Page 5: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

YN150の活動

・初級講座概要、操作方法

・構築運営支援何を載せるのかどう運営するのか

(協力:市民団体)

Page 6: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

・ 無償 レンタルサーバーネットコモンズインストール済

(協力:東京都市大学 )

YN150の活動

Page 7: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

YN150 事例横浜コミニュティデザイン・ラボ シニアSOHO横浜・神奈川

I Love つづき 日本ナポリタン学会

Page 8: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

開発したモジュール

Page 9: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

開発したモジュール

1.グーグル・マップ

2.ヘッダ・チェンジャー

3.ツイッター

http://ohwada.yn150.jp/

Page 10: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

グーグル・マップ・モジュール

Page 11: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ヘッダ・チェンジャーモジュール標準ヘッダカラム、左カラム、右カラム(青色)全てのページで共通

ヘッダカラム(桃色)左カラム(緑色)右カラム(黄色)ページ毎に異なるものに

Page 12: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ツイッター・モジュール

1.標準のログインの代わりにTwitter でログイン出来ます

2.ログインユーザのTwitter のタイムラインを表示する

http://ohwada.yn150.jp/

Page 13: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

モジュールの概要

Page 14: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

モジュールとは

プラットホーム

日記

掲示板

アルバム

地図

標準機能

その他

機能の拡張

Page 15: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ページとモジュール

多くのCMSでは

サイトモジュールAモジュールBモジュールCコンテンツ1コンテンツ2

ページと呼ぶ

Page 16: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ページとモジュールネットコモンズでは

サイト

ページ1モジュールA

ページ2モジュールAモジュールBコンテンツ1

モジュールB

モジュールA

実体投影

Page 17: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

登録(post)処理多くのCMSでは、URL遷移あり

登録フォーム 登録

処理結果表示

ボタン

POST リダイレクト

Page 18: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

登録(post)処理

ネットコモンズは、URL遷移なし

登録フォーム 登録

処理結果表示

ボタン

POST

JavaScript

部分再描画

利点: 反応 速い欠点: モジュール作成・デバック 難しい

Page 19: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

開発者向けチュートリアル

Page 20: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

必要な知識

1.HTML + CSS

2.PHP / Smarty

3.MySQL

4.JavaScript / prototype.js

Page 21: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

チュートリアル

1.generate (ツール)2.雛型モジュール3.テンプレート4.View プログラム5.スタイルシート6.データベース 読出し7.データベース 書込み

Page 22: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

雛型モジュール

何も表示していないが、プログラムは動いている

Page 23: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ハローワールド

ハローワールド を表示する

2つファイルを修正する・ テンプレート・ファイル・ 言語ファイル

Page 24: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ハローワールド

<{$lang.helloworld_helloworld_1}>

テンプレートの修正

templates/default/helloworld_view_main_init.html

Page 25: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ハローワールド

[Helloworld_View_Main_Init]

; Smartyにassignするhelloworld_helloworld_1=

"ハローワールド by テンプレート"

language/japanese/main.ini

言語ファイルの修正

Page 26: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

ハローワールド

結 果

Page 27: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

実習テキスト

ありません。WEB に公開しています。http://ohwada.yn150.jp/tutorial/

Page 28: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

WARP

(Web Application Rapid Package)WAMP 環境(Windows Apache MySQL PHP) コピーするだけです。面倒なインストールが不要です。http://sourceforge.jp/projects/xoops4u/releases/50657

実習環境 (1)

Page 29: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

XAMPP Lite

利点: 高速動作欠点: 設定が必要

WAMPの知識が必要http://opensource-workshop.jp/download/netcommons_develop/

実習環境 (2)

Page 30: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

Skype などで80番ポートを使っていると、動作しません。

注 意

確認方法> netstat -anTCP 0.0.0.0:80 0.0.0.0:0 LISTENING

Page 31: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

実習内容チュートリアル を実習する1.generate (ツール)2.雛型モジュール3.テンプレート4.View プログラム5.スタイルシート6.データベース 読出し7.データベース 書込み

Page 32: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

自由討論

モジュール開発者を増やすには

(1) 講習会

(2) wiki: 不足している情報

(3) デバックのコツ

(4) ご意見・ご感想

Page 33: 20110121 NetCommons Developer

2011年1月21日 アズテック 大和田健一

質疑応答