Course OutlineModule 1: Overview of HTML and CSSThis module provides an overview of HTML and CSS, and describes how to use Visual Studio 2012 to build a Web application.Lessons
- Overview of HTML
- Overview of CSS
- Creating a Web Application by Using Visual Studio 2012
Lab : Exploring the Contoso Conference ApplicationAfter completing this module, students will be able to:
- Describe basic HTML elements and attributes.
- Explain the structure of CSS.
- Describe the tools available in Visual Studio 2012 for building Web applications.
Module 2: Creating and Styling HTML5 PagesThis module describes the new features of HTML5, and explains how to create and style HTML5 pages.Lessons
- Creating an HTML5 Page
- Styling an HTML5 Page
Lab : Creating and Styling HTML5 PagesAfter completing this module, students will be able to:
- Create static pages using the new features available in HTML5.
- Use CSS3 to apply basic styling to the elements in an HTML5 page.
- Introduction to jQuery
- Overview of Forms and Input Types
- Validating User Input by Using HTML5 Attributes
Lab : Creating a Form and Validating User InputAfter completing this module, students will be able to:
- Create forms that use the new HTML5 input types.
- Validate user input and provide feedback by using the new HTML5 attributes.
Module 5: Communicating with a Remote Data SourceThis module describes how to send and receive data to and from a remote data source by using an XMLHTTPRequest object and by performing jQuery AJAX operations.Lessons
- Sending and Receiving Data by Using XMLHTTPRequest
- Sending and Receiving Data by Using jQuery AJAX operations
Lab : Communicating with a Remote Data SourceAfter completing this module, students will be able to:
- Serialize, deserialize, send, and receive data by using XMLHTTPRequest objects.
- Simplify code that serializes, deserializes, sends, and receives data by using the jQuery ajax method
Module 6: Styling HTML5 by Using CSS3This module describes how to style HTML5 pages and elements by using the new features available in CSS3.Lessons
- Styling Text
- Styling Block Elements
- CSS3 Selectors
- Enhancing Graphical Effects by Using CSS3
Lab : Styling Text and Block Elements using CSS3After completing this module, students will be able to:
- Style text elements on an HTML5 page by using CSS3.
- Apply styling to block elements by using CSS3.
- Use CSS3 selectors to specify the elements to be styled in a Web application.
- Implement graphical effects and transformations by using the new CSS3 properties.
- Creating Custom Objects
- Extending Objects
Lab : Refining Code for Maintainability and ExtensibilityAfter completing this module, students will be able to:
- Describe how to extend custom and native objects to add functionality.
Module 8: Creating Interactive Pages using HTML5 APIsThis module describes how to use some common HTML5 APIs to add interactive features to a Web application. This module also explains how to debug and profile a Web application.Lessons
- Interacting with Files
- Incorporating Multimedia
- Reacting to Browser Location and Context
- Debugging and Profiling a Web Application
Lab : Creating Interactive Pages by Using HTML5 APIsAfter completing this module, students will be able to:
- Use the Drag and Drop, and the File APIs to interact with files in a Web application.
- Incorporate audio and video into a Web application.
- Detect the location of the user running a Web application by using the Geolocation API.
- Explain how to debug and profile a Web application by using the Web Timing API and the Internet Explorer Developer Tools.
Module 9: Adding Offline Support to Web ApplicationsThis module describes how to add offline support to a Web application, to enable the application to continue functioning in a user's browser even if the browser is disconnected from the network.Lessons
- Reading and Writing Data Locally
- Adding Offline Support by Using the Application Cache
Lab : Adding Offline Support to a Web ApplicationAfter completing this module, students will be able to:
- Save and retrieve data locally on the user's computer by using the Local Storage API.
- Provide offline support for a Web application by using the Application Cache API.
Module 10: Implementing an Adaptive User InterfaceThis module describes how to create HTML5 pages that can dynamically detect and adapt to different devices and form factors.Lessons
- Supporting Multiple Form Factors
- Creating an Adaptive User Interface
Lab : Implementing an Adaptive User InterfaceAfter completing this module, students will be able to:
- Describe the need to detect device capabilities and react to different form factors in a Web application.
- Create a Web page that can dynamically adapt its layout to match different form factors.
Module 11: Creating Advanced GraphicsThis module describes how to create advanced graphics for an HTML5 Web application by using a Canvas element, and by using Scalable Vector Graphics.Lessons
- Creating Interactive Graphics by Using Scalable Vector Graphics
- Programmatically Drawing Graphics by Using a Canvas
Lab : Creating Advanced GraphicsAfter completing this module, students will be able to:
- Use Scalable Vector Graphics to add interactive graphics to an application.
Module 12: Animating the User InterfaceThis module describes how to enhance the user experience in an HTML5 Web application by adding animations.Lessons
- Applying CSS Transitions
- Transforming Elements
- Applying CSS Key-frame Animations
Lab : Animating User Interface ElementsAfter completing this module, students will be able to:
- Describe the different types of 2D and 3D transitions available with CSS3
Module 13: Implementing Real-Time Communications by Using Web SocketsThis module explains how to use Web Sockets to transmit and receive data between an HTML5 Web application and a server.Lessons
- Introduction to Web Sockets
- Sending and Receiving Data by Using Web Sockets
Lab : Implementing Real-Time Communications by Using Web SocketsAfter completing this module, students will be able to:
- Explain how Web Sockets work and describe how to send and receive data through a Web Socket.
Module 14: Creating a Web Worker ProcessThis module describes how to use Web Worker Processes to perform long-running operations asynchronously and improve the responsiveness of an HTML5 Web application.Lessons
- Introduction to Web Workers
- Performing Asynchronous Processing by Using a Web Worker
Lab : Creating a Web Worker ProcessAfter completing this module, students will be able to:
- Describe the purpose of a Web Worker process, and how it can be used to perform asynchronous processing as well as provide isolation for sensitive operations.