Single Page Apps with HTML5, Web API, Knockout and jQuery
Learn how to create rich user experiences by building Single Page Applications with HTML5, jQuery, Knockout, and the ASP.NET Web API.
Authored by:
John Papa
Duration: 6h 25m
Level: Intermediate
Released: 8/29/2012
Features:
Duration: 6h 25m
Level: Intermediate
Released: 8/29/2012
Features:
Course Rating:
You are currently not signed in. Please sign in to access subscriber-only content.
Currently using: {{getCurrentPlayerName()}} [Change]
| expand all | collapse all | remove highlights | Progress | Duration | |
|---|---|---|---|
Getting Started with the Code Camper SPA |
|
00:24:06 | |
|
Course Overview
|
|
00:49 | |
|
The Code Camper User Story
|
|
02:36 | |
|
What is a SPA?
|
|
03:59 | |
|
First Look at the Code Camper Application
|
|
08:21 | |
|
Architecture
|
|
01:42 | |
|
Server Technologies
|
|
01:59 | |
|
Client Technologies
|
|
03:59 | |
|
Summary
|
|
00:41 | |
Technologies and Patterns of the Code Camper SPA |
|
00:16:26 | |
|
Introduction
|
|
00:32 | |
|
Exploring the Solution Structure
|
|
03:00 | |
|
Creating the Projects from Scratch
|
|
07:00 | |
|
Helpful Tools
|
|
02:16 | |
|
Responsive Design Tools
|
|
02:52 | |
|
Summary
|
|
00:46 | |
Data Models, Entity Framework, and Data Patterns |
|
00:49:47 | |
|
Introduction
|
|
01:00 | |
|
Data Layer Technologies
|
|
03:52 | |
|
Models and POCO
|
|
03:34 | |
|
Creating Models: Demo
|
|
04:43 | |
|
Entity Framework, DbContext, and Magical Unicorns
|
|
04:37 | |
|
Creating and customizing a DbContext: Demo
|
|
07:34 | |
|
Why Use the Repository Pattern
|
|
03:31 | |
|
Implementing the Repository Pattern: Demo
|
|
05:40 | |
|
Advanced Repositories: Demo
|
|
04:41 | |
|
Putting it Together in a Unit of Work
|
|
03:06 | |
|
Implementing the Unit of Work Pattern: Demo
|
|
06:25 | |
|
Summary
|
|
01:04 | |
Surfacing JSON Data with ASP.NET Web API |
|
00:45:32 | |
|
Introduction
|
|
01:19 | |
|
Why Use the ASP.NET Web API?
|
|
03:41 | |
|
Understanding Routes
|
|
01:48 | |
|
Creating Convention Based Controllers
|
|
06:35 | |
|
Using Inversion of Control with ASP.NET Web API
|
|
06:22 | |
|
Creating Custom Controller Actions and Routes
|
|
06:04 | |
|
Saving JSON Data from Fiddler
|
|
06:00 | |
|
Testing Web API Requests with QUnit
|
|
07:35 | |
|
Testing Model Validation and Other Customization
|
|
05:08 | |
|
Summary and Resources
|
|
01:00 | |
Optimizing the Single Page |
|
00:30:15 | |
|
Introduction
|
|
00:55 | |
|
Preparing the Page for HTML5
|
|
04:37 | |
|
Building the Page
|
|
06:50 | |
|
ASP.NET Web Optimization
|
|
02:44 | |
|
Optimizing the JavaScript
|
|
08:14 | |
|
Optimizing the CSS and LESS
|
|
05:55 | |
|
Summary
|
|
01:00 | |
SPA Basics: Separating the Ravioli |
|
00:33:39 | |
|
Introduction
|
|
01:20 | |
|
Modularity and Separating the Ravioli
|
|
04:41 | |
|
Bootstrapping the SPA with modules
|
|
09:38 | |
|
Managing Many Small Modules
|
|
01:14 | |
|
Defining the Module Dependency Problem
|
|
02:43 | |
|
How RequireJS Helps Modularity
|
|
02:07 | |
|
RequireJS Basics
|
|
04:12 | |
|
Applying RequireJS to a SPA
|
|
06:07 | |
|
Summary
|
|
01:37 | |
Loading Views with MVVM and Knockout |
|
00:36:46 | |
|
Introduction
|
|
01:18 | |
|
MVVM, Knockout, and Data Binding in a Nutshell
|
|
04:46 | |
|
Binding the Event Dates with Knockout
|
|
05:56 | |
|
Templates, Filters and Throttling
|
|
06:29 | |
|
Presenting Arrays in a Template
|
|
03:37 | |
|
Custom Binding Handler
|
|
05:40 | |
|
Activating the ViewModel
|
|
03:31 | |
|
Knockout Debugging Tips
|
|
02:48 | |
|
Summary
|
|
02:41 | |
Data Services on the Client |
|
00:46:05 | |
|
Introduction
|
|
02:15 | |
|
Why Use Data Services?
|
|
02:21 | |
|
AJAX and Model Mapping
|
|
05:06 | |
|
Creating A Data Service
|
|
03:38 | |
|
AmplifyJS
|
|
02:38 | |
|
Refactoring for AmplifyJS and Caching
|
|
05:32 | |
|
Mock Data and Testing the Data Services
|
|
07:24 | |
|
Role of the Data Context
|
|
01:21 | |
|
Creating a Data Context
|
|
08:48 | |
|
Navigating Models
|
|
04:46 | |
|
Recap and Future Options
|
|
02:16 | |
Navigation, Transitions, Storage, and Messaging |
|
00:40:43 | |
|
Introduction
|
|
01:06 | |
|
SPA Navigation Fundamentals
|
|
03:18 | |
|
Defining Routes
|
|
02:16 | |
|
Catching Routes
|
|
02:42 | |
|
Passing Parameters
|
|
04:24 | |
|
Event Delegation
|
|
05:05 | |
|
Transitions and the Presenter
|
|
01:24 | |
|
Animating Transitions
|
|
06:10 | |
|
Asynchronous Commands
|
|
03:44 | |
|
Adding Storage and Cancelation Features
|
|
01:26 | |
|
Canceling Navigation and Pub/Sub
|
|
04:24 | |
|
Local Storage
|
|
03:37 | |
|
Going Further with Navigation
|
|
01:07 | |
Saving, Change Tracking and Validation |
|
00:32:54 | |
|
Introduction
|
|
01:36 | |
|
Benefits of Change Tracking
|
|
00:57 | |
|
Applying and Testing Change Tracking
|
|
06:50 | |
|
Async Commands and Activity
|
|
02:48 | |
|
Async Updates via Commands and DataContext
|
|
02:26 | |
|
Implicit Saves
|
|
06:23 | |
|
Validation Overview
|
|
02:22 | |
|
Validating Data
|
|
08:38 | |
|
Recap and Resources
|
|
00:54 | |
Mobility and Responsive Design with CSS and LESS |
|
00:29:23 | |
|
The Drawing Board
|
|
02:35 | |
|
Debugging CSS in the Browser
|
|
06:54 | |
|
LESS Fundamentals
|
|
04:00 | |
|
Applying LESS to the SPA
|
|
05:21 | |
|
Responsive Web Design
|
|
02:32 | |
|
Media Queries and Tools
|
|
06:42 | |
|
Resources
|
|
01:19 |
Getting Started with the Code Camper SPA