More Related Content
What's hot (20)
Viewers also liked (20)
Similar to Web開発の最新トレンド ～１から知るASP.NET～ (20)
![[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介](https://cdn.slidesharecdn.com/ss_thumbnails/net20122asp-netmvc4beta-120225025400-phpapp01-thumbnail.jpg?width=560&fit=bounds)
Web開発の最新トレンド ～１から知るASP.NET～
- 2. アジェンダ １．Web 開発の魅力 ２．Web 開発の最新トレンド ３．ASP.NET とは Web のキソ
- 3. セッションのゴール Web 開発の最新トレンドを知る ASP.NET について知る 今日、家に帰ったら、 Visual Studio（or WebMatrix）で ASP.NET を触る ★
- 5. １． Web 開発の魅力 ～Web といえば？～
- 7. １．Web 開発の魅力 そんな Web を利用したアプリケーション開発の魅力 ? デバイスとネットがあれば、誰でもすぐにアクセスできる ? Web は、登場から20年経った今もなお、必須の技術である ? 数人のコミュニティから、世界規模まで サービスを展開できる ? HTML5、CSS3、JavaScript 等、数多くの技術に触れられ る 特に SignalR はおもしろい！
- 8. １．Web 開発の魅力 SignalR を使った HTML プレゼン
- 9. アジェンダ １．Web 開発の魅力 ２．Web 開発の最新トレンド ３．ASP.NET とは Web のキソ
- 11. 1.5 Web のキソ 1/3 Web を構成する３つの規格 ? URI（情報の名前） ? HTTP（通信方法の約束） ? HTML（情報を表すための書式） これらの３つが、Web の普及に大きく貢献している
- 12. 1.5 Web のキソ 2/3 クライアントとサーバー ? 実行環境は、クライアントとサーバーの２つに分かれる。 ? 基本、クライアントからのリクエストを受けて、 サーバーはレスポンスを返す。 クライアント サーバー
- 13. 1.5 Web のキソ 3/3 クライアント側とサーバー側で動作する技術の区別 ? JavaScript ? CSS ? HTML ? … ? ASP.NET ? PHP ? … クライアント サーバー
- 14. アジェンダ １．Web 開発の魅力 ２．Web 開発の最新トレンド ３．ASP.NET とは Web のキソ
- 15. ２． Web 開発の最新トレンド
- 16. 2．Web 開発の最新トレンド 昔は ? 一般が利用する Web といえば、 パソコンを使って、ブラウザより Web サイトを閲覧する。 が大半だった。 http://homepage3.nifty.com/abe-hiroshi/阿部寛さんのHP
- 17. 2．Web 開発の最新トレンド Web の進化 需要に合わせて、Web が進化 http://evolutionofweb.appspot.com/ウェブの進化
- 18. 2．Web 開発の最新のトレンド ブラウザ ▼iOS ▼Windows ストアアプリ ▼Android アプリ ▼Desktop アプリ サーバー HTML5 CSS3 JavaScript ネイティブアプリ 今
- 19. 2．Web 開発の最新のトレンド ブラウザ ▼iOS ▼Windows ストアアプリ ▼Android アプリ ▼Desktop アプリ サーバー HTML5 CSS3 JavaScript Web 標準技術 （Web API） デバイスが数多く 登場 ブラウザの進化 ネイティブアプリ プラットフォーム の多様化 今
- 20. 2．Web 開発の最新トレンド デバイスが数多く登場 ? デバイス毎の対応が必要となる ? タッチとマウスとキーボード ? 異なる画面サイズ ? レスポンシブデザイン ? Windows http://windows.microsoft.com/ja-jp/windows/home ? サーバー側でビュー（表示するHTML）の切り替え
- 21. 2．Web 開発の最新トレンド ネイティブアプリのオンラインコンテンツ化 ? Web API の普及 ? マルチプラットフォームの対応 ? Web 標準技術の活用（RESTful Web API）
- 22. 2．Web 開発の最新トレンド ブラウザ、Web の進化 ? ブラウザでもデバイス毎に違う ? リッチな UI ? HTML5, CSS3, JavaScript（Ajax） ? 位置情報、カメラ、傾き等の情報 ? リアルタイム性 ブラウザに対して、あらゆる機能が求められるように。 →ブラウザの進化 →ブラウザも、数あるデバイスの内の１つに。
- 23. 2．Web 開発の最新トレンド 益々重要になる Web 標準技術 ? Web 標準技術を生かした Web API ? → REST ? RIA（Flash, Silverlight 等） の対応が遅れる ? HTML5, CSS3 の登場 ? JavaScript への注目 ? Web 開発では、Web の知識が益々重要に
- 24. 2．Web 開発の最新トレンド つまり… ? 様々な環境に対応する必要がある。 ? 多くの技術が登場。 ? それでもなお、必要不可欠な Web 標準技術。 取捨選択で、各技術を組み合わせた Web開発を 行う必要がある
- 26. アジェンダ １．Web 開発の魅力 ２．Web 開発の最新トレンド ３．ASP.NET とは Web のキソ
- 27. ３．ASP.NET とは
- 28. ３．ASP.NET とは ? 動的なWebアプリケーションを構築するための フレームワーク、実行基盤。 ? Webアプリケーション（またはサービス）に必要な機能を 備える。 ? Visual Studio、または WebMatrix を用いて開発を行う。 ? .NET Framework に対応。 ? 開発言語は、主にC#, Visual Basic ? Azure 対応 Microsoft が提供する Web 開発技術
- 29. ３．ASP.NET とは ASP.NET も昔は一枚岩だった HTML, JavaScript まで すべてカバー Web 技術や他ライブラリと 併用できる Web 开発へ
- 30. ３．ASP.NET とは ASP.NET の今 ～One ASP.NET～ Web Forms Web Pages Single Page Apps MVC Web API SignalR ASP.NET Web サイト サービス 主に６つのフレームワークがある。
- 31. ３．ASP.NET とは ASP.NET の今 ～One ASP.NET～ Web Forms Web Pages Single Page Apps MVC Web API SignalR ASP.NET Web サイト サービス 同じ目的(Webサイト構築)を 果たすためのフレームワーク
- 32. ３．ASP.NET とは ? Web サイト構築のためのフレームワーク ? Web Forms ? MVC ? Web Pages ? Web Pages は、WebMatrix でのみ開発可能 ? Web Forms, MVC は、Visual Studio のみ開発可能。 Web サイト
- 33. ３．ASP.NET とは ? サービスを構築するためのフレームワーク ? （※サービス…Web 通信を利用して、なんらかの処理を行う。） ? Web API ? SignalR サービス 例 ?Web API を利用して、サーバーと通信するモバイルアプリを開発する。 ?Web API を利用して、Ajax を使ってリッチな Web サイトを構築する。 ?SignalR を利用して、リアルタイム機能を備えた Web サイトを構築する
- 34. ３．ASP.NET とは ? ASP.NET とクライアントサイドの技術を生かした Web アプリケーションを構築するためのパターンやサンプ ルのことを表す。 ? フレームワークというよりも、サンプル的な位置付け。 Single Page Application
- 35. ３．ASP.NET とは ? 開発を行うための統合開発環境 ? WebMatrix http://www.microsoft.com/japan/web/webmatrix/ ? 無償 ? Webサイト構築ツール ? ASP.NET 以外にも対応 Visual Studio と WebMatrix
- 36. ３．ASP.NET とは ? Visual Studio http://www.microsoft.com/visualstudio/jpn/downloads ? 無償版と有償版（試用版）がある。 ? Visual Studio 2012 ? 有償、90日間試用版がある ? 学生の場合、DreamSpark に登録することで無償 ? Visual Studio Express 2012 for Web ? 無償 ? Visual Studio の Web 関連機能限定。最初はこれでOK. Visual Studio と WebMatrix
- 37. ３．ASP.NET とは ? Webアプリケーションを作成?勉強したい ? ASP.NET MVC がおすすめ。言語は C#。 ? Web の基礎を学ぶことができる。 ? HTML 等の制御が行いやすく、クライアントサイドと相性が良い。 ? Webアプリケーションと、iOS等、モバイルに対応したアプリを作 成したい。 ? ASP.NET MVC と、ASP.NET Web API を利用。 ASP.NET 選択例
- 38. ３．ASP.NET とは ? なんでもいいので面白いことを試したい！ ? SignalR!! と、ASP.NET Web Forms（または Web Pages） ? クライアントサイドである HTML5 や CSS3 等を試したい ? ASP.NET Web Forms（または Web Pages） ASP.NET 選択例
- 39. ３．ASP.NET とは Web Pages 動的にページを生成するための 軽量なフレームワーク Web Forms コントロールを用いて、 イベント駆動型の開発を行う MVC MVCスタイルを用いて、 Web標準技術を意識して開発を行う Single Page Application ASP.NET MVC, ASP.NET Web API, JavaScript フレームワークを組み合わせ、 クライアントサイドの技術を生かした アプリのサンプル。 Web サイト
- 40. ３．ASP.NET とは Web API RESTful な HTTPサービスを 提供する SignalR リアルタイムかつ双方向通信を 提供する サービス
- 41. Web 開発の最新トレンドを知る ASP.NET について知る 今日、家に帰ったら、 Visual Studio（or WebMatrix）で ASP.NET を触る ★
- 42. ありがとうございました
- 43. とりあえず触ってみる方法 ? Web Pages の場合 ? →WebMatrix を起動 ? →「新規」→「テンプレートギャラリー」 ? →「ASP.NET」の「フォト ギャラリー」 ? →用意されたら、左上の「実行」ボタン
- 44. とりあえず触ってみる方法 ? Web Forms の場合 ? →Visual Studio (2012) を起動 ? →「ファイル」→「新しいプロジェクト」 ? →「ASP.NET Web フォームアプリケーション」で「OK」ボタン ? → 「デバッグ」→「実行」 ? ログイン機能と、他数ページが用意されている。
- 45. とりあえず触ってみる方法 ? MVC の場合 ? →Visual Studio (2012) を起動 ? →「ファイル」→「新しいプロジェクト」 ? →「ASP.NET MVC 4 Web アプリケーション」で「OK」ボタン ? →「インターネット アプリケーション」 ? → 「デバッグ」→「実行」 ? Web Forms と同じ、ログイン機能と、他数ページが用意されている。
- 46. とりあえず触ってみる方法 ? Single Page Application の場合 ? →Visual Studio (2012) を起動 ? →「ファイル」→「新しいプロジェクト」 ? →「ASP.NET MVC 4 Web アプリケーション」で「OK」ボタン ? →「シングルページ アプリケーション」 ? → 「デバッグ」→「実行」 ? ログイン機能と、Todo機能が用意されている。
- 47. とりあえず触ってみる方法 ? Web API の場合 ? Web API は、体感し辛いので省略。 ? SignalR の場合 ? ASP.NET SignalRを知る http://www.atmarkit.co.jp/ait/articles/1303/19/news099.html の「サンプル?アプリを実行してみる」の章を参考。