1 / 10

philly.NET Hands-On MVC Razor, HTML5, CSS3

philly.NET Hands-On MVC Razor, HTML5, CSS3. Rob Keiser, Bill Wolff. March 13 Razor, HTML5, CSS3, MVC Controllers April 10 jQuery , plug-ins May 8? Templating , jsRender , Knockout June 12 Page fragments, User controls, Scaffolding July 10

rodd
Download Presentation

philly.NET Hands-On MVC Razor, HTML5, CSS3

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. philly.NET Hands-OnMVC Razor, HTML5, CSS3 Rob Keiser, Bill Wolff

  2. March 13 • Razor, HTML5, CSS3, MVC Controllers April 10 • jQuery, plug-ins May 8? • Templating, jsRender, Knockout June 12 • Page fragments, User controls, Scaffolding July 10 • REST (consuming data), webAPI (providing data) August 14 • Single Page Applications September 11 • SignalR Hands-on LabsWeb DevelopmentSeries

  3. Model • Contains the data to display • Represent as classes • Connect to database as needed • View • Display logic to render content • Render only, no data storage or logic • Controller • Associated with URL structure • Logic determines which view to display using a model MVC

  4. Application • Properties • References • Project Folders • App_Data • Content • Controllers • Models • Scripts • Views • Configuration • Global.asax • Packages.config • Web.config MVC Project

  5. Shared Layouts • Stores pages across all • _layout.cshtml is like a master page • _ViewStart.cshtml code added to each page • HTML Helpers • Render links and other tricky markup • Pass information from master to content • @ViewBag • Content Placeholder • @RenderBody() • Partial Pages • @RenderPage(“somepage.cshtml”) Razor

  6. Syntax • Code blocks enclosed in @{ … } • Inline expressions start with @ • End statements with semi-colon; • Declare variables with var or type • Enclose strings in quotes • C# is case sensitive • Views • One folder per controller, multiple views • Typically cshtml files • Home folder stores home (Index.cshtml) and about pages Razor

  7. 100+ specifications in W3C provides device independence • IE9+, Chrome 6+, Firefox 3.6+, Safari 5+, most mobile devices • Simplified declaration • <!DOCTYPE html> • Less need for plug-ins • <canvas> for 2d drawing and inline SVG for vector graphics • <audio> and <source> audio playback • <video> and <source> media playback • Drag and drop support • HTML5 applications • Local data storage without cookies, file access, SQL • Cache provides offline browsing, faster load times • XHTMLHttpRequest2 • Javascript workers run in background • Server-side events • Geolocation can determine latitude and longitude HTML5

  8. Semantic layout • <header> <footer> <hgroup> <nav> <progress> • <section> <article> <aside> <summary> <details> <figure> <figcaption> <time> <command> <dialog> • Forms • <input> color, date, datetime, datetime-local, email, month, number, range, search, tel, time, url, week • <datalist> for <input> values with autocomplete • <keygen> for authentication and certificates • <output> for calculations • <form> and <input> autocomplete • <input> autofocus, formaction, list, min, max, multiple, pattern, placeholder, required, step HTML5

  9. Selectors are most important to learn • Many new styles are not supported yet • animation with @keyframes • border-radius • box-shadow • Overflow • Rotation • Opacity • Bookmark CSS3

  10. Hyphens • Grid • Target • Columns • voice • Text-shadow • Transform • Perspective • Transition • nav CSS3

More Related