Agileへの発展について - AFFORDD8.ソースコード を変更しデプロ イを実施する ソースコード 担当者 ファーストダウン:スプリント1 :スプリント2
Gaiaのソースコードに見るちょっと未来のweb app開発
-
Upload
masakazu-muraoka -
Category
Technology
-
view
1.767 -
download
0
description
Transcript of Gaiaのソースコードに見るちょっと未来のweb app開発
![Page 1: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/1.jpg)
Gaiaのソースコードに観るちょっと未来のWebApp開発
Firefox Developers Conference 2014 Kyoto2014.4.19
Bathtimefish 村岡 正和
![Page 2: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/2.jpg)
HTML5-WEST.jp代表 / html5j マークアップ部 部長 / HTML5 Experts.jp メンバーGDG京都 / CSS Nite in OSAKA / 神戸ITフェスティバル実行委員など
むらおか まさかず
村岡正和
HTML5-WEST.jp
Webアプリケーション開発 IT業務システム設計/開発Webサービス導入/事業戦略コンサルティング
@bathtimefish
![Page 3: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/3.jpg)
監修しました。
実例ごとの実装例がたくさん書いてあります。ウェブサイト制作やCMSの運用時に便利です。
好評販売中!!
![Page 4: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/4.jpg)
Firefox OSの薄い本書きました。
http://goo.gl/mA8ebW
好評発売中!
開発に、「もえあがる」のはつきものだ
第一話 がいあハックス (Gaia開発環境の構築とデバッグ)
著
![Page 5: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/5.jpg)
Firefox OS
Gaia
Gecko
Gonk
UI
Render
Device
![Page 6: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/6.jpg)
https://github.com/mozilla-b2g/gaia
![Page 7: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/7.jpg)
GaiaをFirefoxで起動する
https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia/Hacking
![Page 8: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/8.jpg)
$ git clone -b v1.4 https://github.com/mozilla-b2g/gaia
$ cd gaia
$ DEBUG=1 make
$ /Applications/FirefoxNightly.app/Contents/MacOS/firefox -profile /work/gaia/profile-debug --no-remote
Firefox で Gaia をデバッグする
![Page 9: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/9.jpg)
DEMO
![Page 10: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/10.jpg)
http://goo.gl/mA8ebW
詳しくは、「狐物語」を読んでください
第一話 がいあハックス (Gaia開発環境の構築とデバッグ)
起動からデバッグまで、ぜんぶ書きました。
![Page 11: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/11.jpg)
Gaia Appsコードは大いにHTML5 WebApp開発の参考になる
さすがはJSのお膝元ですね :)
![Page 12: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/12.jpg)
中でもボクはSettingsがお気に入り。
![Page 13: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/13.jpg)
いろいろおもしろいコードあるけど、
LTなのでいっこだけ。
![Page 14: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/14.jpg)
apps/settings/index.html
Wifi, 機内モードなどの各メニューのUIが別々のhtmlファイルとして
部品化されている。
![Page 15: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/15.jpg)
http://www.w3.org/TR/html-imports/
![Page 16: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/16.jpg)
フラグ立てたChromeで動くwGoogleが書いてる仕様だから当たり前だけどね
![Page 17: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/17.jpg)
FxOSは?
![Page 18: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/18.jpg)
shared/js/html_imports.js
まだJSゴリゴリでしたwww
![Page 19: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/19.jpg)
いまはまだAPIの実装に先行してWebAppが設計されている。
Gecko側でAPI実装が完了したらJSも最適化されるはず。
![Page 20: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/20.jpg)
https://bugzilla.mozilla.org/show_bug.cgi?id=877072
っていうかやってます。
![Page 21: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/21.jpg)
ほかにもいろいろなテクニックが垣間みえるGaia Appsのコード。
一歩先のHTML, CSS, JSを参考にしてWebApp開発に役立ててはどうでしょうか?
![Page 22: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/22.jpg)
happy����������� ������������������ coding����������� ������������������ :)
![Page 23: Gaiaのソースコードに見るちょっと未来のweb app開発](https://reader034.fdocument.pub/reader034/viewer/2022052301/54b6e7f04a7959aa218b45e1/html5/thumbnails/23.jpg)
Thanks.