1. jQuery Mobile
PHP
MySQL
WebMatrix
ExpressWeb
で作成・公開する
勉強会申し込みサイト

2. すみません。
時間がないので、
どんどんいきます！
※質問は後日、または懇親会にて。

3. About atend form.
勉強会申し込みサイト

4. 背景
• これまでは Google フォームで作成。

5. 背景
• 参加申し込みしたかどうかの確認問い合わせがち
らほら。
• @sandinist さんが Ruby on Rails で作成、
heroku に配置して運用。
– 申し込み完了後、登録完了メールが自動送信され
るようになった。

6. ほかのプラットフォームで
作るとどうなるだろう?

7. Requirements
要件

8. 要件
• Webフォーム上からの参加申し込み
– 氏名、e-mail、LT登壇有無...
• 自分が参加申し込みしたか確認できること。
– 一解決策として、登録完了のメール自動送信
• 参加者名簿が作れること。
– CSV形式でのエクスポートとか

9. Platform and Tools
プラットフォームと開発ツール

10. jQuery
1.6.4
jQuery Mobile 1.0.1
jQuery Validation 1.9.0

11. Ver.5.3.5

12. MySQL
Ver.5.1

13. ちなみに自分は
PHP も
MySQL も
初心者 です。

14. WebMatrix Ver.2 β
作画: Paese (http://paese.sblo.jp/)

15. 開発ツール - WebMatrix 2 (β)
• Ver.1 からさらに進化
• PHP でもインテリセンス強化
• MySQL のテーブル作成やデータ編集も GUI で
できる
– それで初めてのPHP & MySQL で作ってみようと思い
立った。

16. ExpressWeb
Windows Server2008R2 / IIS7.5

17. 公開・運用 - ExpressWeb
• データジャパン(株)のホスティングサービス。
• 有料とはいえ、十二分に安価。
• ASP.NET アプリの配置先としては最強!?
– MVC3 も使える。
– SQL Server も使える。
• そのほかにも盛りだくさん。
– PHP、Perl、MySQL、サブドメイン無制限 etc.

18. • 14日間無料のお試しアカウントもあります。
• 最短3分で発行。

19. Building Development Environment
開発環境の構築

20. Web PI
Web Platform Installer / Ver.4.0 β

21. 開発環境の構築
• Web Platform Installer のおかげで、あきれるほ
ど簡単。
– WebMatrix と MySQL を選ぶ
• 今回はさらに MySQL Connector/NET のインス
トールが必要だが、検索しないと出てこないので
注意！

22. http://www.microsoft.com/web/webmatrix/
を開いて、右上の「Try the latest Beta」をクリック。

23. Design
構想

24. 参加申し込みフォーム

25. 参加者一覧

26. 手順
1. 申し込みフォーム、入力のバリデーション
2. データベースの構築、申し込み内容の保存
3. 参加者一覧
4. インターネットに公開

27. お断り

28. スニペット
使いまくります。
http://blogs.msdn.com/b/osamum/archive/2011/12/2
6/10251004.aspx
物江さん、ありがとうございます。

29. インテリセンスもカ
リカリにカスタマイ
ズ、チューニング
してます。

30. メール送信機能
は実装しません。

31. Live Coding.
開発開始！

33. 参加者一覧は
スタッフのみ
アクセス可

34. 認証
承認

35. 認証と承認
• 実直に PHP で組んでもよし。
– PEAR:Auth とかあるそうで。
• 今時代なら OAuth とか?
– Twitter アカウントでログイン、みたいな。

36. しかし

37. 今回は

38. Digest
認証

39. なぜ?

40. ExpressWebでは
SSLが使えない!

41. パスワード
が
平文
で流れてしまう...orz

42. ダイジェスト認証なら大丈夫
• パスワードが平文で流れることがありません。
• リプレイ攻撃にも強い。
• そして HTTP 標準な仕組みなので、さらなる特
典が... どんな特典かは、いまはヒミツ。

43. どうやってダイジェスト認証?
• Apache なら簡単だけど、ExpressWeb = IIS で
はどうやるの?
• 「あ、オレ、IISのダイジェスト認証の設定、知って
るよ！Active Directory のユーザーで認証する
んだよな」
• あのー、ExpressWeb = ホスティングサービスなん
ですけど...orz

44. 大丈夫。

45. ASP.NET の
モジュールを
使います!

46. Http Authentication Module
• 基本認証ないしはダイジェスト認証を、ASP.NET
のレイヤで提供。
• Web.config に書いたユーザー情報で認証。

47. あのー、
PHP
なんですけど?

48. IIS7 の統合パイプラインモード
• ASP.NET なページへの要求に限らず、すべての
要求を、ASP.NET のライフサイクルとして扱う。
• .php に対する要求に対しても、ASP.NET HTTP
モジュールが処理。
• これで、.php なページも、Http Authentication
Module による認証が機能する！

49. NuGet
Package Manager ページを有効にする手順の動画
http://youtu.be/asKDyXzaT0g

50. Live Coding.
認証の実装、承認の構成

52. 参加者一覧は当日の受付に使う。
• 申し込み一覧は、なぜ素の HTML、素の TABLE
要素で組んだか?
• 独自のフォーム認証や、OAuth ではなく、なぜ
HTTP 標準の認証（今回は SSL は使えなかっ
たのでダイジェスト認証）を採用したか?

53. Excel の
Webクエリ

54. Demo
実際にやってみよう

56. (アリスも知らなかった)
Excel の Web クエリ
• エクスポート/インポートとは違います！
• Excel表とWebページが関連付けされます！
• F9 押すだけで、最新情報になる！

57. Publish
インターネットに公開

59. Conclusion
まとめ

60. まとめ
• WebMatrix
– PHP + MySQL のスクラッチ開発、ExpressWeb への発
行、リモートビューによる保守（これは Visual Studio に
もできない芸当）はかなり便利。
• IIS 統合パイプラインモード
– PHP なサイトでも ASP.NET 技術の恩恵にあずかれる。
• ExcelのWebクエリ
– HTML 中の TABLE 要素は、CSV エクスポート/インポー
トとかしなくてもExcelに取込・更新可能。
HTTP 認証ならスタッフ専用ページでも大丈夫！

61. ほかのプラットフォームで
作るとどうなるだろう?

62. 運用費¥0で
Windows Azure上
に作ってみる！

63. to be continue!