1. @mikage014 2011.07.23 山口県WEB勉強会スピンオフ 3回目 マッシュアップサービスをつくろうin 山口 1

2. インフラエンジニア 5年->転職 Linux, Solarisでインターネットシステムの設計・構築 プログラマ 3年目 PHP + Postgresqlで業務系Webシステムの設計・構築 ブログ http://d.hatena.ne.jp/mikage014/ Twitter: @mikage014 ←このアイコンが目印です About Me

3. １．マッシュアップサービスって何？ ２．APIの使い方を調べる方法 ３．API利用のデモ ATND, Twitter, Google Map 今日のお題

4. 4 マッシュアップサービスって何？

5. マッシュアップサービスって何？ 5 WebAPIを組み合わせて作るサービス API＝Application Program Interface WebAPIを提供しているWebサービス Twitter, Foursquare, ロケタッチ,GoogleMap, Frickr, Instagram, ATND, etc. これらを組み合わせて便利なものを作る 作ったらMashup Awards 7に出してみたらいいんじゃない？

6. 例えば・・・位置座標を活用 6 Twitter １．位置情報を集めて… ３．地図上に表示！ ２．加工して Instagram GoogleMap Foursquare

7. 例えば・・・画像認識を活用 7 １．画像データを取り出して… ３．美女写真だけを一覧表示！ ２．美女を抽出 Instagram Bijostagram OpenCV 猫画像を集めたNekostagram 犬画像を集めたInustagram リスト表示に特化したListagram

8. マッシュアップサービス作りのポイント 8 ・APIを徹底的に活用して高速開発 データはころがすだけ ・APIとAPIを組み合わせる Ex. 地図上につぶやきを表示 ・サービス単体で持っていない機能を追加する Ex.ATND検索 ・特定ジャンルの情報を集める Ex. 猫好き、犬好き、美女好き向け写真一覧

9. 9 APIの使い方を調べる方法

10. 参考サイト 10 今どきのWebディレクターなら避けては通れないAPIの勘どころ http://blog.livedoor.jp/ld_directors/archives/51684623.html TwitterAPIViewer http://twitool-box.net/api-viewer/ ATNDAPI リファレンス http://api.atnd.org/ GoogleMapAPI チュートリアル http://code.google.com/intl/ja/apis/maps/documentation/javascript/tutorial.html

11. 11 ATNDAPI

12. ATNDAPI 12 ATNDAPI リファレンス http://api.atnd.org/ １．ブラウザから直接APIのURLを叩いてみる ２．プログラムからAPIを呼び出してみる ３．データを加工して表示 （デモ）

13. 13 TwitterAPI

14. TwitterAPI 14 TwitterAPIViewer http://twitool-box.net/api-viewer/ １．欲しいデータのAPIを叩いてみる ２．プログラムからAPIを呼び出してみる ３．データを加工して表示 （デモ）

15. 15 GoogleMapAPI

16. GoogleMapAPI 16 GoogleMapAPI チュートリアル http://code.google.com/intl/ja/apis/maps/documentation/javascript/tutorial.html １．チュートリアルをコピペ ２．他のAPIから取ってきた位置情報にマーカーとかInfoWindowを表示してみる （デモ）

17. 17 ご静聴ありがとうございました @mikage014 2011.07.23 山口県WEB勉強会スピンオフ 3回目 使用画像 http://piapro.jp/t/bvvK