Contenu connexe
Similaire à 20130412 titanium meetupvol7
Similaire à 20130412 titanium meetupvol7 (20)
Plus de Hiroshi Oyamada (20)
20130412 titanium meetupvol7
- 1. TiQiita作ったら結果的にオレオレフ
レームワークも出来た
photo by Ars Electronica
http://www.flickr.com/photos/arselectronica/4950684667/
13年4月12日金曜日
- 2. 自己紹介
photo by poluz!
http://www.flickr.com/photos/poluz
13年4月12日金曜日
- 3. 小山田 浩(@h5y1m141)
エンジニアではありませんが JavaScript
趣味でTitaniumいじっていて (JScript,Titanium Mobileな
勉強したことをブログ書いて ど)経験2年程度
います ※最近はCoffeeScript好き
13年4月12日金曜日
- 4. Agenda
• これから話すこと
• 最近作ったTiQiitaを簡単に紹介
• 自分の中の設計方針
• お世話になったライブラリ
• 今日話さないこと
• ソースコードの細かい解説
※気になる方はLT終了後お声がけ下さい
13年4月12日金曜日
- 5. 作ったアプリ
Photo By fotologic
http://www.flickr.com/photos/fotologic/
13年4月12日金曜日
- 7. 自分の中の設計方針
・MVCモデルを意識して分割
・1メソッド1画面を心がける
・ 先人の知恵を活用してスパゲッ
ティコード化を防ぐ
photo by aagius
http://www.flickr.com/photos/aagius/
13年4月12日金曜日
- 8. ディレクトリ構成
Resources
├── controller
├── test はてなAPI 利用する際の
ConsumerKey等の情報を
├── config JSON形式のファイルで格納
├── model {"consumerKey":
"S0=xxx","consumerSecret":
└── ui "xxxxx"}
coffee
├── controller
├── test
├── model
└── ui
13年4月12日金曜日
- 9. MVCモデル
Model ui
├── baseCommand.coffee ├── activityIndicator.coffee
├── configCommand.coffee ├── alertView.coffee
├── getFeedByTagCommand.coffee ├── configMenu.coffee
├── getFollowingTagsCommand.coffee ├── mainTable.coffee
├── getMyStocksCommand.coffee ├── menuTable.coffee
├── getOldEntryCommand.coffee ├── progressBar.coffee
├── getStocksCommand.coffee ├── statusView.coffee
├── hatena.coffee ├── webView.coffee
├── loginCommand.coffee └── window.coffee
└── qiita.coffee
Controller
├── commandController.coffee
├── mainContoroller.coffee
└── menu.coffee
13年4月12日金曜日
- 10. Model概要①
メニューに対応する処理を実装
(GoFのCommandパターン適用)
loginCommand
_showStatusView()
_hideStatusView()
baseCommand
_showStatusView()
_hideStatusView()
getMyStocksCommand
getMyStocks()
execute()
_showStatusView()
_hideStatusView()
13年4月12日金曜日
- 11. Model概要②
WebAPIと連携する
qiita
_auth()
_mergeItems()
_mockObject() Tiplatform
_storedStocks() Connect
_request()
_convertLinkHeaderToJSON()
を利用
_mergeItems()
_parsedResponseHeader()
isConnected()
hatena
login()
getStocks() postBookmark()
getFollowingTags()
getFeed()
getNextFeed()
getMyStocks()
putStock()
:
∼以下略∼
13年4月12日金曜日
- 12. View概要
progress
mainTable
alertView Bar configMenu
configWindow
webView
menuTable
mainWindow
WebViewWindow
13年4月12日金曜日
- 13. Controller概要
• mainController
• 基本的にはModelとViewの橋
渡しはこのControllerが担う
• commandController
• mainControllerに集約しても
よかったが、Commandパ
ターンで実装してるModelが増
えたので別に切り出した
13年4月12日金曜日
- 14. 先人の知恵:
menuTableの各項目をクリック後の
処理はCommandパターン
getMyStocksCommand()
1.qiita.getMyStocks()実行
2.次ページのURL情報が後々必要
になるためTi.App.Properties
で格納
3. ActivityIndicatorの制御
4.その他・・
13年4月12日金曜日
- 15. お世話になったライブラリ
moment.js TiPlatform NappSlide
momentja.js Connect Menu Module
「xx時間前」みたいな Kosuke Isobe スライドメニューは
やつを実現する @k0sukey ネイティブモジュー
CommonJSなもの ル活用
https://github.com/viezel/NappSlideMenu
13年4月12日金曜日
- 17. またまた宣伝を・・
これじゃなくって、ストリー
トアカデミーで告知してる
Titaniumの勉強会を宣伝さ
せてください
13年4月12日金曜日
- 19. サイトで告知してる内容
• <こんな事を教えます>
• Titanium Mobileを使ったスマフォアプリの作り方
• <こんな事が出来るようになります>
• RSSリーダー風アプリのようにサーバーサイドと連携するスマー
トフォンアプリが作れるようになります。
• <所要時間と当日の流れ>
• 1回あたり60分程度。数回のシリーズものとして実施予定
• 開催場所は高田馬場にある10 cafeというお店でごはんでも食べ
ながらカジュアルな雰囲気で進めていこうと思ってます
• <想定参加者>
• 「こんなスマートフォンのアプリが欲しい」と具体的なアイデア
を持っててHTML/CSSのコーディング程度は可能なレベル
13年4月12日金曜日