MyPage is a personalized page based on your interests.The page is customized to help you to find content that matters you the most.

I'm not curious

Single Page Apps with HTML5, Web API, Knockout and jQuery

Course Summary

Single Page Applications (SPA's) focus on delivering rich user experiences with significant client-side interactions using JavaScript, HTML5, and CSS. In this course I'll explore how to build end to end SPA solutions using data binding and MVVM on the cli

  • +

    Course Syllabus

    ● Getting Started with the Code Camper SPA
        ◦ Course Overview
        ◦ The Code Camper User Story
        ◦ What is a SPA?
        ◦ First Look at the Code Camper Application
        ◦ Architecture
        ◦ Server Technologies
        ◦ Client Technologies
        ◦ Summary
    ● Technologies and Patterns of the Code Camper SPA
        ◦ Introduction
        ◦ Exploring the Solution Structure
        ◦ Creating the Projects from Scratch
        ◦ Helpful Tools
        ◦ Responsive Design Tools
        ◦ Summary
    ● Data Models, Entity Framework, and Data Patterns
        ◦ Introduction
        ◦ Data Layer Technologies
        ◦ Models and POCO
        ◦ Entity Framework, DbContext, and Magical Unicorns
        ◦ Why Use the Repository Pattern
        ◦ Putting it Together in a Unit of Work
        ◦ Summary
    ● Surfacing JSON Data with ASP.NET Web API
        ◦ Introduction
        ◦ Why Use the ASP.NET Web API?
        ◦ Understanding Routes
        ◦ Creating Convention Based Controllers
        ◦ Using Inversion of Control with ASP.NET Web API
        ◦ Creating Custom Controller Actions and Routes
        ◦ Saving JSON Data from Fiddler
        ◦ Testing Web API Requests with QUnit
        ◦ Testing Model Validation and Other Customization
        ◦ Summary and Resources
    ● Optimizing the Single Page
        ◦ Introduction
        ◦ Preparing the Page for HTML5
        ◦ Building the Page
        ◦ ASP.NET Web Optimization
        ◦ Optimizing the JavaScript
        ◦ Optimizing the CSS and LESS
        ◦ Summary
    ● SPA Basics: Separating the Ravioli
        ◦ Introduction
        ◦ Modularity and Separating the Ravioli
        ◦ Bootstrapping the SPA with modules
        ◦ Managing Many Small Modules
        ◦ Defining the Module Dependency Problem
        ◦ How RequireJS Helps Modularity
        ◦ RequireJS Basics
        ◦ Applying RequireJS to a SPA
        ◦ Summary
    ● Loading Views with MVVM and Knockout
        ◦ Introduction
        ◦ MVVM, Knockout, and Data Binding in a Nutshell
        ◦ Binding the Event Dates with Knockout
        ◦ Templates, Filters and Throttling
        ◦ Presenting Arrays in a Template
        ◦ Custom Binding Handler
        ◦ Activating the ViewModel
        ◦ Knockout Debugging Tips
        ◦ Summary
    ● Data Services on the Client
        ◦ Introduction
        ◦ Why Use Data Services?
        ◦ AJAX and Model Mapping
        ◦ Creating A Data Service
        ◦ AmplifyJS
        ◦ Refactoring for AmplifyJS and Caching
        ◦ Mock Data and Testing the Data Services
        ◦ Role of the Data Context
        ◦ Creating a Data Context
        ◦ Navigating Models
        ◦ Recap and Future Options
    ● Navigation, Transitions, Storage, and Messaging
        ◦ Introduction
        ◦ SPA Navigation Fundamentals
        ◦ Defining Routes
        ◦ Catching Routes
        ◦ Passing Parameters
        ◦ Event Delegation
        ◦ Transitions and the Presenter
        ◦ Animating Transitions
        ◦ Asynchronous Commands
        ◦ Adding Storage and Cancelation Features
        ◦ Canceling Navigation and Pub/Sub
        ◦ Local Storage
        ◦ Going Further with Navigation
    ● Saving, Change Tracking and Validation
        ◦ Introduction
        ◦ Benefits of Change Tracking
        ◦ Applying and Testing Change Tracking
        ◦ Async Commands and Activity
        ◦ Async Updates via Commands and DataContext
        ◦ Implicit Saves
        ◦ Validation Overview
        ◦ Validating Data
        ◦ Recap and Resources
    ● Mobility and Responsive Design with CSS and LESS
        ◦ The Drawing Board
        ◦ Debugging CSS in the Browser
        ◦ LESS Fundamentals
        ◦ Applying LESS to the SPA
        ◦ Responsive Web Design
        ◦ Media Queries and Tools
        ◦ Resources

Course Fee:
USD 29

Course Type:


Course Status:



1 - 4 hours / week

This course is listed under Development & Implementations and Quality Assurance & Testing Community

Attended this course?

Back to Top

Awards & Accolades for MyTechLogy
Winner of
Top 100 Asia
Finalist at SiTF Awards 2014 under the category Best Social & Community Product
Finalist at HR Vendor of the Year 2015 Awards under the category Best Learning Management System
Finalist at HR Vendor of the Year 2015 Awards under the category Best Talent Management Software
Hidden Image Url

Back to Top