2013.11.28 マイナビさんでの「Movable Type 6 本格活用ナイトセミナー」のスライドです。

1. Data APIで広がるWebサイトの
オモテとウラ
Movable Type 6 本格活用ナイトセミナー
2013.11.28
bit part 合同会社 奥脇知宏・柳谷真志

2. bit part 紹介
• 柳谷真志（@mersy）、奥脇知宏（@tinybeans）
• 2013年1月結成のユニット
• 2013年8月「bit part 合同会社」設立
• Movable Typeやアルファサード株式会社の
PowerCMSを利用した構築がメイン業務

3. bit part 紹介 / mersy
• 柳谷真志
やなぎやまさし
• アイ・ペアーズ株式会社

4. bit part 紹介 / tinybeans
• 奥脇知宏
おくわきともひろ
• かたつむりくんのWWW
• Movable Type 5.1
プロの現場の仕事術
（毎日コミュニケーションズ）

5. bit part 紹介 / plugins
• flexibleSearch
• MTAppjQuery
• MTML Completions
• その他のMTプラグイン
ドキュメント販売中

6. Data API で何ができる？
Webサイトのオモテ側

7. サンプルサイト
Six Apart のごはんレシピ

8. サンプルサイトの構成
• Movable Type on Cloud（爆速MT）
• １つのウェブサイト
• ウェブサイトで記事を管理（MT6 new!）
• カテゴリ、タグによる分類

9. Data API をどこに使っているか
• 一覧ページ（トップページなど）で下までスクロー
ルすると追加で読み込む無限スクロール
• サイト内検索
• タグアーカイブ

10. サンプルサイトのデモ
• 実際に見てみましょう
http://makanai.sixapart.jp/

11. DEMOサイトの構成
< デザインについて >
Data API で
追加読み込み

12. Data API で
検索

14. サンプルサイトの解説
• Movable Type 6 本格活用ガイドブック
• Chapter 04 参照

15. 英単語帳スマホWebアプリ
bitword

16. Data API をどこに使っているか
• 一覧ページの表示・無限スクロール
• ユーザー認証
• 記事の新規投稿・編集
• 記事のステータスの変更、下書き記事の表示

17. bitword のデモ
• 実際に見てみましょう
• デモ（公開画面・管理画面）

18. Data API を PHP で利用した
ダイナミックページ

19. Data API を PHP で利用する
• デモ

20. Data API で何ができる？
Webサイトのウラ側

21. アイデア１
サンプル記事をまとめて作成
• Webサイト構築中のサンプル記事の投稿がとっても
楽に！
• Data API を使った記事の作成
• デモ

22. アイデア２
クイック編集ウィジェット
• ちょっとした記事の編集をサクッとやりたい！
• Data API を使ったインクリメントサーチ
• Data API を使った記事の更新・再構築
• ウィジェットの挿入は MTAppjQuery で
• デモ

23. アイデア３
マルチファイルアップロードウィジェット
• 複数の画像をまとめてアップロードしたい！
• Data API を使ったアイテムのアップロード
• ウィジェットの挿入は MTAppjQuery で
• デモ

24. アイデア４
公開サイトを見たまま編集
Chrome 拡張機能
• 公開サイトを見たまま編集したい！
• Google Chrome の拡張機能で Data API を使う
• Data API を使った記事の編集（リッチテキストエ
ディタも！）、新規投稿（複製）、削除
• デモ

25. このように Data API を使うと
Movable Type のデータを
Webサイトのオモテ側・ウラ側
で簡単・自由に扱える！

26. ご静聴ありがとう
ございました。
Update bit part everyday!!
MT::Lover::bitpart