浪江町タブレットで採用した、 Cordovaで作るHTML5のAndroidアプリのしくみ
3 likes1,643 views
2016/01/31に行われた、HTML5fun福島で話したときの資料です。 CordovaとBackbone.jsの紹介をしました。
浪江町タブレットで採用した、 Cordovaで作るHTML5のAndroidアプリのしくみ
- 2. アジェンダ • 自己紹介 • 浪江町とタブレット事業の紹介 • Cordovaとは • Backbone.js入門 • なみえアプリでのCordovaとBackbone.js
- 3. 自己紹介 山田 直行（やまだ なおゆき） 2015年7月から浪江町役場勤務。 復興推進課 情報統計係 復興庁 福島復興局 所属 市町村応援職員 Code for Japanフェロー • 2007年に社会復帰し、メルティングドッツ、イストピカ、サイバーエージェントと勤め、浪江町役場 は４つ目の勤務先。 • 政治・行政の世界でのITの今後の可能性にかけて現場から取り組むことを決意し、Code for Japanフェ ローに。 • 浪江町タブレット配布プロジェクトの開発・運用を担当する職員として役場でフルタイムで働く。 • ソフトウェアエンジニアとしては、クラウドの運用・サーバーサイドの開発を得意とするが基本的に何 でも屋 • AWS認定ソリューションアーキテクト- アソシエイト • 福島県郡山市在住
- 5. タブレット端末を利用した「きずなの維持」 • 全国に分散避難する町民と町、あるいは町民同士 をつなぐ • 「ふるさとなみえ」への愛着を持ち続けて欲しい • 町の近況を身近に感じてもらい、将来の帰還へつな げたい
- 6. アプリの開発と、Code for Namie プロジェクト • 浪江町タブレット 最後の挑戦 -プロジェクト参加 者募集 より • http://www.slideshare.net/codeforjapan/ ss-51373165
- 12. Apache Cordova
- 13. Cordovaとは(1/3) • オープンソースのモバイルアプリ開発フレームワーク • Apacheソフトウェア財団に寄贈されたため 「Apache」とついている • もともとはPhoneGapという名称だったが、Adobe 社が買収したことによりPhoneGapはAdobeのプロ ダクト名になり、フレームワーク自体はCordovaと 呼ばれるようになった
- 16. 浪江町のアプリでのCordova • なみえ新聞 • なみえ写真投稿 • なみえタブレット道場 • なみえ放射線情報 • 記事管理などの管理画面（ウェブサイトから利用） →これら5つは、全てCordovaフレームワークで作られています
- 18. Backbone.js
- 19. Backbone.jsとは • クライアントサイドのJavaScript MVCフ レームワーク • JavaScriptのソースコードを役割別に分割 して、見通しをよくする • 大規模開発に効果を発揮
- 20. Backbone.jsの部品 • View・・・ビュー（見た目の制御） • Model・・・データの取得・保存・更新・削除 • Collection・・・Modelの集合 • Router・・・URLの制御・監視 • History・・・Routeの履歴監視 http://www.slideshare.net/otoyo0122/backbonejs-16753352
- 23. DEMO
- 27. DEMO