お気に入りの web stack mvc , jquery, html5
DESCRIPTION
お気に入りの Web Stack MVC , jQuery, HTML5. 竹原 貴司 ( たけはら たかし ) http://takepara.blogspot.com Twitter @ takepara [email protected]. Web Stack って 何？. クライアントサイドプラットフォーム サーバーサイドプラットフォーム サーバー OS ハードウェア ネットワーク お金. プラットフォーム？. サーバーサイド .NET Framework ASP.NET ASP.NET MVC クライアントサイド HTML ブラウザ - PowerPoint PPT PresentationTRANSCRIPT
mvcConf @:Japan～ ASP.NET MVC ブート キャンプ
～
お気に入りの Web StackMVC, jQuery, HTML5
竹原 貴司 ( たけはら たかし )http://takepara.blogspot.com
Twitter @[email protected]
Web Stack って何？ クライアントサイドプラットフォーム サーバーサイドプラットフォーム サーバー OS ハードウェア ネットワーク お金
2
プラットフォーム？ サーバーサイド
.NET Framework ASP.NET
ASP.NET MVC クライアントサイド
HTML ブラウザ HTML CSS JavaScript
3
開発言語
実行ランタイム
フレームワーク
プラットフォーム間連携 HTTP
REST GET,HEAD,POST,PUT,DELETE…
SOAP TDS
SQL Server CIFS
ファイル共有4
入力→処理→出力
5
出力
HTML XML JSON バイナリリソース
処理入力データ変換 データ操作
入力URL Request Body 外部リソース
出力
ブラウザへの表示
処理HTML(CSS) パース JavaScript 実行
入力HTML CSS JavaScript JSON,XML Silverlight
Excel/Word
サーバーサイド クライアントサイド
ASP.NET の仕組み ASP.NET
HttpApplication Pipeline Provider Model
Page Pipeline Page Controller Control Tree Postback View State
6
http://msdn.microsoft.com/ja-jp/library/bb470252.aspx http://msdn.microsoft.com/ja-jp/library/ms178472.aspx
HTML5 の定義“HTML5 は、プロプライエタリなプラグインとして提供されているリッチインターネットアプリケーションのプラットフォーム（ JavaFX、 Adobe Flash、 Silverlight 等）を置き換えることを標榜しており、ウェブアプリケーションのプラットフォームとしての機能やマルチメディア要素が実装されている。”
7
http://ja.wikipedia.org/wiki/HTML5
Approaching HTML5
8
W3CHTML
HTM
L5Canvas 2D
ContextM
icrodataH
TML+
RDFa
HTM
L5 Markup
HTM
L5 Diff
from H
TML4
Polyglot Markup
Text alternatives
CSS
CSS Snapshot 2007CSS N
amespaces
CSS Paged Media
CSS Print ProfileCSS Values and U
nitsCSS Cascading and Inheritance
CSS TextCSS W
riting Modes
CSS Line Grid
CSS RubyCSS G
enerated Content for Paged Media
CSS Backgrounds and BordersCSS Fonts
CSS Basic Box Model
CSS Multi-colum
n LayoutCSS Tem
plate LayoutCSS M
edia Queries
CSS SpeechCSS Color
CSS Basic User Interface
CSS ScopingCSS G
rid PositioningCSS Flexible Box Layout
CSS Image Values
CSS 2D Transform
ationsCSS 3D
Transformations
CSS TransitionsCSS Anim
ations
Web Apps
CORS
Element TraversalFile API
Index DB
Programm
able HTTP Caching and Serving
Progress EventsSelectors API
Selectors API L2Server-Sent Events
Uniform
Messaging Policy
Web D
OM
CoreW
eb SQL D
atabaseW
eb IDL
Web Sockets APIW
eb StorageW
eb Workers
XmlH
ttpRequestXm
lHttpRequest L2D
OM
L1D
OM
L2 CoreD
OM
L2 Views
DO
M L2 Events
DO
M L2 Style
DO
M L2 Traversal and Range
DO
M L2 H
TML
DO
M L3 Core
DO
M L3 Events
DO
M L3 Load and Save
DO
M L3 Validation
DO
M L3 XPath
DO
M L3 View
s and Formatting
DO
M L3 Abstract Schem
asSVG
Docum
ent StructureBasic Shapes
PathsText
Transforms
Painting, Filling, ColorScriptingStyling
Gradients and Patterns
SMIL
FontsFilters
Geoloc
ationG
eolocation API
ECMAECMA Script
262
ECMAScript 262
First Public Working Draft Working Draft Last Call Candidate
Recommendation Recommendation
http://channel9.msdn.com/events/MIX/MIX11/HTM05
HTML5 とは Element Forms 各種 Event と API パーサー Canvas Microdata Messaging
9
http://www.slideshare.net/dynamis/keypoints-html5-4920336
JavaScript とは ECMAScript の実装
など細かい話は Google で検索 フレームワーク
jQuery jQuery Mobile
Modernizr Prototype.js Mootools
10
サーバーサイド Stack
11
Windows Server
SQL Server IIS
.NET Framewor(C#,LINQ…)
ASP.NET
ASP.NET MVC Razor WebForm
Entity Framework
Code First
WCF
WCF Data Services(OData)
クライアントサイド Stack
12
Web Browser
HTML CSS JavaScriptJSON
jQuerydatajs
modernizrKnockout.j
s
Silverlight Flash
13Architecture Center - MSDN - http://msdn.microsoft.com/es-es/architecture/en/
14Architecture Center - MSDN - http://msdn.microsoft.com/es-es/architecture/en/
テストについて Unit Test
完璧を求めると疲れるね スタック , 機能は Mocks
Service Locator 大活躍 結合はシナリオ
Web システムなら Selenium とか 徐々に増やしていこう
継続的インテグレーション (CI)15
http://msdn.microsoft.com/ja-jp/magazine/cc163358.aspx
実行環境 オンプレミス クラウド
IaaS PaaS
ホスティング
16
http://www.datacenterknowledge.com/inside-microsofts-chicago-data-center/microsoft-chicago-center-aisle-container/
ASP.NET MVC3 について少し Razor DependencyResolver HTML5 Template
Mvc Html5 Template http://nuget.org/List/Packages/MvcHtml5Templates
MVC Html5 Toolkit http://mvchtml5.codeplex.com/
NuGet17
デモアプリケーション
18
IIS
Cloud Storage
ASP.NET MVC WCF Data Services HTML
CSSEntity Framework
SQL Server JavaScript
MVC RESTful MVVM
External Server Client
Windows Server
demo ...
19
© 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the
part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.