• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Web開発の最新トレンド ~1から知るASP.NET~
 

Web開発の最新トレンド ~1から知るASP.NET~

on

  • 3,346 views

Webのトレンドを知ろう!

Webのトレンドを知ろう!
http://atnd.org/event/webtrend

Statistics

Views

Total Views
3,346
Views on SlideShare
3,337
Embed Views
9

Actions

Likes
4
Downloads
12
Comments
0

2 Embeds 9

https://twitter.com 8
http://s.deeeki.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Web開発の最新トレンド ~1から知るASP.NET~ Web開発の最新トレンド ~1から知るASP.NET~ Presentation Transcript

    • Web開発の最新トレンド ~1から知るASP.NET~ 矢後 比呂加 2013/09/07 13:00~
    • アジェンダ 1.Web 開発の魅力 2.Web 開発の最新トレンド 3.ASP.NET とは Web のキソ
    • セッションのゴール Web 開発の最新トレンドを知る ASP.NET について知る 今日、家に帰ったら、 Visual Studio(or WebMatrix)で ASP.NET を触る ★
    • 対象者 ・Web 開発を初めてみたい方 ・ASP.NET を初めて知る方
    • 1. Web 開発の魅力 ~Web といえば?~
    • 1.Web 開発の魅力 Web とは 世界に広がる情報の網
    • 1.Web 開発の魅力 そんな Web を利用したアプリケーション開発の魅力 • デバイスとネットがあれば、誰でもすぐにアクセスできる • Web は、登場から20年経った今もなお、必須の技術である • 数人のコミュニティから、世界規模まで サービスを展開できる • HTML5、CSS3、JavaScript 等、数多くの技術に触れられ る 特に SignalR はおもしろい!
    • 1.Web 開発の魅力 SignalR を使った HTML プレゼン
    • アジェンダ 1.Web 開発の魅力 2.Web 開発の最新トレンド 3.ASP.NET とは Web のキソ
    • 1.5 Web のキソ ~学習タイム~ 最新トレンドへ移る前に 知っておきたいこと
    • 1.5 Web のキソ 1/3 Web を構成する3つの規格 • URI(情報の名前) • HTTP(通信方法の約束) • HTML(情報を表すための書式) これらの3つが、Web の普及に大きく貢献している
    • 1.5 Web のキソ 2/3 クライアントとサーバー • 実行環境は、クライアントとサーバーの2つに分かれる。 • 基本、クライアントからのリクエストを受けて、 サーバーはレスポンスを返す。 クライアント サーバー
    • 1.5 Web のキソ 3/3 クライアント側とサーバー側で動作する技術の区別 • JavaScript • CSS • HTML • … • ASP.NET • PHP • … クライアント サーバー
    • アジェンダ 1.Web 開発の魅力 2.Web 開発の最新トレンド 3.ASP.NET とは Web のキソ
    • 2. Web 開発の最新トレンド
    • 2.Web 開発の最新トレンド 昔は • 一般が利用する Web といえば、 パソコンを使って、ブラウザより Web サイトを閲覧する。 が大半だった。 http://homepage3.nifty.com/abe-hiroshi/阿部寛さんのHP
    • 2.Web 開発の最新トレンド Web の進化 需要に合わせて、Web が進化 http://evolutionofweb.appspot.com/ウェブの進化
    • 2.Web 開発の最新のトレンド ブラウザ ▼iOS ▼Windows ストアアプリ ▼Android アプリ ▼Desktop アプリ サーバー HTML5 CSS3 JavaScript ネイティブアプリ 今
    • 2.Web 開発の最新のトレンド ブラウザ ▼iOS ▼Windows ストアアプリ ▼Android アプリ ▼Desktop アプリ サーバー HTML5 CSS3 JavaScript Web 標準技術 (Web API) デバイスが数多く 登場 ブラウザの進化 ネイティブアプリ プラットフォーム の多様化 今
    • 2.Web 開発の最新トレンド デバイスが数多く登場 • デバイス毎の対応が必要となる • タッチとマウスとキーボード • 異なる画面サイズ • レスポンシブデザイン • Windows http://windows.microsoft.com/ja-jp/windows/home • サーバー側でビュー(表示するHTML)の切り替え
    • 2.Web 開発の最新トレンド ネイティブアプリのオンラインコンテンツ化 • Web API の普及 • マルチプラットフォームの対応 • Web 標準技術の活用(RESTful Web API)
    • 2.Web 開発の最新トレンド ブラウザ、Web の進化 • ブラウザでもデバイス毎に違う • リッチな UI • HTML5, CSS3, JavaScript(Ajax) • 位置情報、カメラ、傾き等の情報 • リアルタイム性 ブラウザに対して、あらゆる機能が求められるように。 →ブラウザの進化 →ブラウザも、数あるデバイスの内の1つに。
    • 2.Web 開発の最新トレンド 益々重要になる Web 標準技術 • Web 標準技術を生かした Web API • → REST • RIA(Flash, Silverlight 等) の対応が遅れる • HTML5, CSS3 の登場 • JavaScript への注目 • Web 開発では、Web の知識が益々重要に
    • 2.Web 開発の最新トレンド つまり… • 様々な環境に対応する必要がある。 • 多くの技術が登場。 • それでもなお、必要不可欠な Web 標準技術。 取捨選択で、各技術を組み合わせた Web開発を 行う必要がある
    • 2.Web 開発の最新トレンド 一枚岩から、 各技術と併用する Web 開発へ
    • アジェンダ 1.Web 開発の魅力 2.Web 開発の最新トレンド 3.ASP.NET とは Web のキソ
    • 3.ASP.NET とは
    • 3.ASP.NET とは • 動的なWebアプリケーションを構築するための フレームワーク、実行基盤。 • Webアプリケーション(またはサービス)に必要な機能を 備える。 • Visual Studio、または WebMatrix を用いて開発を行う。 • .NET Framework に対応。 • 開発言語は、主にC#, Visual Basic • Azure 対応 Microsoft が提供する Web 開発技術
    • 3.ASP.NET とは ASP.NET も昔は一枚岩だった HTML, JavaScript まで すべてカバー Web 技術や他ライブラリと 併用できる Web 開発へ
    • 3.ASP.NET とは ASP.NET の今 ~One ASP.NET~ Web Forms Web Pages Single Page Apps MVC Web API SignalR ASP.NET Web サイト サービス 主に6つのフレームワークがある。
    • 3.ASP.NET とは ASP.NET の今 ~One ASP.NET~ Web Forms Web Pages Single Page Apps MVC Web API SignalR ASP.NET Web サイト サービス 同じ目的(Webサイト構築)を 果たすためのフレームワーク
    • 3.ASP.NET とは • Web サイト構築のためのフレームワーク • Web Forms • MVC • Web Pages • Web Pages は、WebMatrix でのみ開発可能 • Web Forms, MVC は、Visual Studio のみ開発可能。 Web サイト
    • 3.ASP.NET とは • サービスを構築するためのフレームワーク • (※サービス…Web 通信を利用して、なんらかの処理を行う。) • Web API • SignalR サービス 例 ・Web API を利用して、サーバーと通信するモバイルアプリを開発する。 ・Web API を利用して、Ajax を使ってリッチな Web サイトを構築する。 ・SignalR を利用して、リアルタイム機能を備えた Web サイトを構築する
    • 3.ASP.NET とは • ASP.NET とクライアントサイドの技術を生かした Web アプリケーションを構築するためのパターンやサンプ ルのことを表す。 • フレームワークというよりも、サンプル的な位置付け。 Single Page Application
    • 3.ASP.NET とは • 開発を行うための統合開発環境 • WebMatrix http://www.microsoft.com/japan/web/webmatrix/ • 無償 • Webサイト構築ツール • ASP.NET 以外にも対応 Visual Studio と WebMatrix
    • 3.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
    • 3.ASP.NET とは • Webアプリケーションを作成・勉強したい • ASP.NET MVC がおすすめ。言語は C#。 • Web の基礎を学ぶことができる。 • HTML 等の制御が行いやすく、クライアントサイドと相性が良い。 • Webアプリケーションと、iOS等、モバイルに対応したアプリを作 成したい。 • ASP.NET MVC と、ASP.NET Web API を利用。 ASP.NET 選択例
    • 3.ASP.NET とは • なんでもいいので面白いことを試したい! • SignalR!! と、ASP.NET Web Forms(または Web Pages) • クライアントサイドである HTML5 や CSS3 等を試したい • ASP.NET Web Forms(または Web Pages) ASP.NET 選択例
    • 3.ASP.NET とは Web Pages 動的にページを生成するための 軽量なフレームワーク Web Forms コントロールを用いて、 イベント駆動型の開発を行う MVC MVCスタイルを用いて、 Web標準技術を意識して開発を行う Single Page Application ASP.NET MVC, ASP.NET Web API, JavaScript フレームワークを組み合わせ、 クライアントサイドの技術を生かした アプリのサンプル。 Web サイト
    • 3.ASP.NET とは Web API RESTful な HTTPサービスを 提供する SignalR リアルタイムかつ双方向通信を 提供する サービス
    • Web 開発の最新トレンドを知る ASP.NET について知る 今日、家に帰ったら、 Visual Studio(or WebMatrix)で ASP.NET を触る ★
    • ありがとうございました
    • とりあえず触ってみる方法 • Web Pages の場合 • →WebMatrix を起動 • →「新規」→「テンプレートギャラリー」 • →「ASP.NET」の「フォト ギャラリー」 • →用意されたら、左上の「実行」ボタン
    • とりあえず触ってみる方法 • Web Forms の場合 • →Visual Studio (2012) を起動 • →「ファイル」→「新しいプロジェクト」 • →「ASP.NET Web フォームアプリケーション」で「OK」ボタン • → 「デバッグ」→「実行」 • ログイン機能と、他数ページが用意されている。
    • とりあえず触ってみる方法 • MVC の場合 • →Visual Studio (2012) を起動 • →「ファイル」→「新しいプロジェクト」 • →「ASP.NET MVC 4 Web アプリケーション」で「OK」ボタン • →「インターネット アプリケーション」 • → 「デバッグ」→「実行」 • Web Forms と同じ、ログイン機能と、他数ページが用意されている。
    • とりあえず触ってみる方法 • Single Page Application の場合 • →Visual Studio (2012) を起動 • →「ファイル」→「新しいプロジェクト」 • →「ASP.NET MVC 4 Web アプリケーション」で「OK」ボタン • →「シングルページ アプリケーション」 • → 「デバッグ」→「実行」 • ログイン機能と、Todo機能が用意されている。
    • とりあえず触ってみる方法 • Web API の場合 • Web API は、体感し辛いので省略。 • SignalR の場合 • ASP.NET SignalRを知る http://www.atmarkit.co.jp/ait/articles/1303/19/news099.html の「サンプル・アプリを実行してみる」の章を参考。