Course description
The MVC 4 framework has a lot of tools that makes web development powerful. In this course you will learn how to use JavaScript, jQuery UI and Partial Views to enhance MVC 4 Web Applications. Then you will continue use JavaScript with jQuery Mobile to detect mobile browsers in a MVC 4 web application.
Prerequisites
This course assumes that you are familiar and experienced with Microsoft’s .NET Framework and ASP.NET development tools. You should be familiar with Web development and understand how HTTP and HTML work to produce Web pages for the user. You should have experience writing applications with ASP.NET 4.0 or later Web forms, and be familiar with how ASP.NET processes page requests, and have strong experience with .NET Framework 4.0 or later programming. You should have experience with Visual Studio 2012 for building Web application projects. Experience with building database applications using these tools will be helpful, although not strictly necessary.
Learning Paths
This course will help you prepare for the following certifications and exams:
MCSD: SharePoint Applications
MCSD: Web Applications
70-486: Developing ASP.NET MVC Web Applications
This course is part of the following LearnNowOnline SuccessPaths™:
Building MVC Web Applications
Meet the expert
James Curtis is a .NET Developer that primarily works in the UX space. He has worked on and for several large projects alongside Microsoft Consulting. James has spoken at several code camps about UX development for ASP.NET and SharePoint. He is an active participant in the development community tweeting and blogging about several topics in the UX area. James is an active consultant and is also assisting in several Start-ups contributing his UX experience.
Course outline
UI Design
UI Basics (14:13)
- Introduction (00:19)
- MVC 4 UI Basics (02:03)
- Layouts (01:15)
- Views (00:31)
- Partial Views (00:40)
- Demo: UI Basics (02:39)
- Demo: Bundle Config (01:51)
- Demo: New to MVC 4 (02:18)
- Demo: Views (02:22)
- Summary (00:11)
JavaScript Reloaded (16:22)
- Introduction (00:20)
- JavaScript Reloaded (02:23)
- Modals, Tabs in MVC (01:25)
- Demo: Partial Views with Tabs (03:59)
- Demo: Tabs and JavaScript (04:06)
- Demo: Modals (03:53)
- Summary (00:14)
UI Layout (10:10)
- Introduction (00:20)
- Composing the UI Layout (01:48)
- Responsive Framework? (02:54)
- Layout Main Parts (03:40)
- Layout Sections (01:11)
- Summary (00:15)
Cascading Style Sheets (17:39)
- Introduction (00:21)
- Browser Detection (01:54)
- CSS (02:43)
- Mobile Phones and Tablets (02:48)
- Enhance Testing in Visual Studio (01:14)
- Demo: Detecting Browsers (05:08)
- Demo: Emulators (03:11)
- Summary (00:17)
Adaptive UI (08:48)
- Introduction (00:19)
- Adaptive User Interface (01:01)
- Adaptive Layouts (01:09)
- Responsive Framework Design (00:30)
- Demo: Adaptive UI (03:02)
- Demo: Using Foundation (02:28)
- Summary (00:15)
Mobile Development
Mobile Development (11:46)
- Introduction (00:23)
- Mobile Development in MVC 4 (01:31)
- Target Device (01:18)
- What's Displayed (01:54)
- Demo: Setting up for Mobile (03:00)
- Demo: Mobile Simulators (03:27)
- Summary (00:12)
HTML5 (15:03)
- Introduction (00:25)
- HTML 5 Viewport (04:19)
- Demo: HTML 5 Viewport (03:25)
- CSS Media Queries (01:03)
- Targeting Screen Size (00:49)
- Targeting Screen Orientation (00:50)
- Demo: CSS Media Queries (03:54)
- Summary (00:15)
Browser-Specific Views (15:32)
- Introduction (00:19)
- Browser-specific Views (01:54)
- Display Modes (02:07)
- Demo: iPhone View (05:00)
- Demo: iPad View (03:56)
- Demo: View Testing (02:00)
- Summary (00:12)
What is Mobile (13:45)
- Introduction (00:19)
- The Mobile Template (01:55)
- Demo: Mobile Template (04:24)
- Demo: Mobile Page (03:39)
- Demo: Mobile Page Index (03:14)
- Summary (00:12)