Download - Moderni web-kehitys ASP.NETillä
![Page 1: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/1.jpg)
Jouni Heikniemi
Offbeat Solutions
18.1.2012
MODERNI WEB-KEHITYS ASP.NETILLÄ
![Page 2: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/2.jpg)
AGENDA
ASP.NET-kehittäjät, webin osaajat
Kenelle?
Modernien web-tekniikoideneri osa-alueiden palvelintoteutusta
Sisältö?
Niksejä, linkkejä,yleiskäsitys toteutustavoista
Mitä jää käteen?
![Page 3: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/3.jpg)
ASP.NET
<asp:HyperLink ID="hyperLinkBack" runat="server"/>
<asp:GridView id="MyGridView" DataSourceID="MyDataSource1" Runat="Server"/>
<asp:SqlDataSource ID="MyDataSource1" runat="server" ConnectionString="Server=YourServer;uid=YourUID;pwd=YourPWD;database=YourDB" ProviderName="System.Data.SqlClient" SelectCommand="SELECT ID, Name FROM Customer"></asp:SqlDataSource>
<asp:GridView id="MyGridView"DataSourceID="MyDataSource1"AllowSorting="True"AllowPaging="True"Runat="Server"/>
<input type="submit" nam
e="ctl00$body$ctl00$navi
gation$ctl00$buttonFormS
ubmit"
value="Hae" id="ctl00_
body_ctl00_navigation_ct
l00_buttonFormSubmit" />
<input type="hidden" nam
e="__VIEWSTATE" id="__VI
EWSTATE"
value="/wEPZCgpWFN5c3R
lbS5H...” />
<a href="javascript:__do
PostBack('ctl00$body$ctl
00$main$ctl00$listAnnou
ncements$repeaterPagi
ng$ctl06$linkButtonPage'
,'')" ... </a>
![Page 4: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/4.jpg)
ASP.NET
2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012
1.0 1.1 2.0 3.5 4.0 4.5
![Page 5: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/5.jpg)
ASP.NET
2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012
1.0 1.1 2.0 3.5 4.0 4.5
ASP.NET MVC
1.0 2.0 3.0 4.0
![Page 6: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/6.jpg)
ASP.NET MVC
• Perussiisti toteutus Model-View-Controller –mallista
• Erittäin hyvin laajennettavissa
• Lähdekoodi saatavilla
![Page 7: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/7.jpg)
HTML5, CSS3
![Page 8: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/8.jpg)
Öö, se HTML:hän menee sinne clientille?Mitä siellä serverillä nyt oikein tarvitaan?
![Page 9: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/9.jpg)
![Page 10: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/10.jpg)
![Page 11: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/11.jpg)
MODERNIZR• JavaScript-kirjasto
• Saatavilla NuGetilla
• ... Tai www.modernizr.com
• Mahdollistaa HTML5- ja CSS3-ominaisuuksien tuen tunnistamisen tehokkaasti
• Sekä CSS:ssä että JavaScriptissä
• Mahdollistaa puuttuvien ominaisuuksien korvaamisen muilla ratkaisuilla
![Page 12: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/12.jpg)
DATANKÄSITTELY
![Page 13: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/13.jpg)
DEMO: JSON-RAJAPINTA
![Page 14: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/14.jpg)
DEMO: ODATA
![Page 15: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/15.jpg)
ODATA• REST-pohjainen tietolähde, jossa monipuolinen kyselykieli
• www.odata.org
• Serveripää
• .NET-ympäristössä WCF Data Services
• Helpoiten edmx:stä tai omista olioista
• Muille alustoille omia implementaatioitaan
• Client-pää
• JavaScriptissä helposti ihan vain JSONilla
• SDK:t saatavilla useimmille merkittäville alustoille
![Page 16: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/16.jpg)
WEBSOCKETIT
![Page 17: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/17.jpg)
REAALIAIKAINEN KOMMUNIKOINTI
![Page 18: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/18.jpg)
PERINTEINEN POLLAUSTEKNIIKKA
Selain tekee pyynnönaina määrätyin väliajoin
Selain
Palvelin
Latenssi!
![Page 19: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/19.jpg)
”LONG POLLING”
Selain
Palvelin
Palvelin vastaa pyyntöönvasta kun dataa on tullut.Selain tekee heti uuden pyynnön.
![Page 20: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/20.jpg)
WEBSOCKETS
Palvelin
Selain
GET /ws HTTP/1.1 Upgrade: websocket Connection: Upgrade
HTTP/1.1 101 Switching Protocols Upgrade: websocket Connection: Upgrade
![Page 21: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/21.jpg)
WEBSOCKETS
Palvelin
Selain
![Page 22: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/22.jpg)
WEBSOCKETS – STANDARDOINNIN TILA
Palvelin
Selain
RFC 6455
W3C API
![Page 23: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/23.jpg)
WEBSOCKETS - SELAINTUKI
caniuse.com
+ Flash 10!
![Page 24: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/24.jpg)
WEBSOCKETIT MICROSOFT-ALUSTALLA
IIS 8
Windows 8
WCF 4.5 ASP.NET 4.5
IE 10 tai muu hyvin uusi selain
Oma rajapinta Oma rajapinta
![Page 25: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/25.jpg)
... VAI VIELÄ VÄHÄN KORKEAMMALLA TASOLLA?
IIS 8
Windows 8
WCF 4.5 ASP.NET 4.5
IE 10 tai muu hyvin uusi selain vanhempikin käy
Oma rajapinta Oma rajapintaSignalR
SignalR / JS
WebSocketsWebSockets /long polling
![Page 26: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/26.jpg)
WEBSOCKETS-YHTEENVETO• Uusi, standardi kommunikaatiotapa webin yli
• Nopea
• Käyttää http/https-yhteyksiä
• Ei tietoliikenteellisesti täysin ongelmaton, mutta pieksee perussocketit 6-0
• Microsoftin palvelinpäässä kolme toteutusarkkitehtuuria:
• WCF (matalamman tai korkeamman tason)
• ASP.NET (matalamman tai korkeamman tason)
• SignalR (kaikkein korkeimman tason)
![Page 27: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/27.jpg)
WEBIN UUSI AIKA?
![Page 28: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/28.jpg)
Microsoft on avautunut. Avaudu nyt sinäkin.
![Page 29: Moderni web-kehitys ASP.NETillä](https://reader033.vdocuments.site/reader033/viewer/2022051821/5681661e550346895dd96fb4/html5/thumbnails/29.jpg)
OPETTELE...
• JavaScript-ohjelmointi
• DOM
• jQuery
• Tiedon välittäminen (JSON, OData)
• HTTP
• Avoimen lähdekoodin projektien käyttö: GitHub, CodePlex, NuGet ym.