<<

Visual Studio • Course - 20480 Microsoft Official Course 20480 - Programming in HTML5 with JavaScript and CSS3

Length This course provides an introduction to HTML5, CSS3, and JavaScript. This course helps students gain basic HTML5/ • 5 days CSS3/JavaScript programming skills. This course is an entry point into both the Web application and Windows Store apps training paths. The course focuses on using HTML5/ CSS3/JavaScript to implement programming logic, define Audience and use variables, perform looping and branching, develop user interfaces, capture and validate user input, store data, The course is intended for developers and create well-structured applications. who have at least six months of professional experience and who are The lab scenarios in this course are selected to support and interested in developing applications demonstrate the structure of various application scenarios. using HTML5 with JavaScript and CSS3 They are intended to focus on the principals and coding (either Windows Store apps or IE10 apps components/structures that are used to establish an HTML5 for the Web). While the students may have software application. little or no HTML5 coding experience, they should have some experience with This course uses Visual Studio 2012, running on Windows 8. HTML4.

Students choosing to attend this course without a developer background should pay special attention to the training prerequisites. Developers who have more than 5 years programming experience Course Outline may find that portions of this training are fundamental in nature when presenting Module 1: Overview of HTML and CSS. the syntax associated with certain This module provides an overview of HTML and CSS, and describes how to use Visual programming tasks. Studio 2012 to build a Web application.

Individuals who are interested in taking Lessons exam 70-480: Programming in HTML5 1. Overview of HTML with JavaScript and CSS3, can also attend 2. Overview of CSS this course. 3. Creating a Web Application by Using Visual Studio 2012

www.dynamicsedge.com | (800) 453-5961 1 Module 2: Creating and Styling HTML5 Pages. Labs This module describes the new features of HTML5, and explains how to create and style HTML5 pages.

• Lab: Exploring the Contoso Lessons Conference Application 1. Creating an HTML5 Page • Lab: Creating and Styling HTML5 2. Styling an HTML5 Page Pages • Lab: Displaying Data and Handling Events by Using JavaScript Module 3: Introduction to JavaScript. • Lab: Creating a Form and Validating This module provides an introduction to the JavaScript language, and shows how to use JavaScript to add interactivity to HTML5 pages. User Input Lessons • Lab: Communicating with a Remote 1. Overview of JavaScript Syntax Data Source 2. Programming the HTML DOM with JavaScript • Lab: Styling Text and Block Elements 3. Introduction to jQuery using CSS3 • Lab: Refining Code for Maintainability and Extensibility Module 4: Creating Forms to Collect Data and Validate User Input. • Lab: Creating Interactive Pages by This module describes the new input types available with HTML5, and explains how to Using HTML5 APIs create forms to collect and validate user input by using the new HTML5 attributes and • Lab: Adding Offline Support to a Web JavaScript code. Lessons Application 1. Overview of Forms and Input Types • Lab: Implementing an Adaptive User 2. Validating User Input by Using HTML5 Attributes Interface 3. Validating User Input by Using JavaScript • Lab: Creating Advanced Graphics • Lab: Animating User Interface Elements Module 5: Communicating with a Remote Data Source • Lab: Implementing Real-Time This module describes how to send and receive data to and from a remote data source Communications by Using Web Sockets by using an XMLHTTPRequest object and by performing jQuery operations. • Lab: Creating a Web Worker Process Lessons 1. Sending and Receiving Data by Using XMLHTTPRequest 2. Sending and Receiving Data by Using jQuery AJAX operations

www.dynamicsedge.com | (800) 453-5961 2 Module 6: Styling HTML5 by Using CSS3 What You'll Learn This module describes how to style HTML5 pages and elements by using the new After completing this course, students will features available in CSS3. be able to: Lessons • Explain how to use Visual Studio 2012 1. Styling Text to create and run a Web application. 2. Styling Block Elements • Describe the new features of HTML5, 3. CSS3 Selectors and create and style HTML5 pages. 4. Enhancing Graphical Effects by Using CSS3 • Add interactivity to an HTML5 page by using JavaScript. • Create HTML5 forms by using different Module 7: Creating Objects and Methods by Using JavaScript input types, and validate user input by This module explains how to write well-structured and easily-maintainable JavaScript using HTML5 attributes and JavaScript code, and how to apply object-oriented principles to JavaScript code in a Web code. application. • Send and receive data to and Lessons from a remote data source by using 1. Writing Well-Structured JavaScript XMLHTTPRequest objects and jQuery 2. Creating Custom Objects AJAX operations. 3. Extending Objects • Style HTML5 pages by using CSS3. • Create well-structured and easily- maintainable JavaScript code. Module 8: Creating Interactive Pages using HTML5 APIs • Use common HTML5 APIs in interactive This module describes how to use some common HTML5 APIs to add interactive Web applications. features to a Web application. This module also explains how to debug and profile a • Create Web applications that support Web application. offline operations. Lessons • Create HTML5 Web pages that can 1. Interacting with Files adapt to different devices and form 2. Incorporating Multimedia factors. 3. Reacting to Browser Location and Context • Add advanced graphics to an HTML5 4. Debugging and Profiling a Web Application page by using Canvas elements, and by using and Scalable Vector Graphics. • Enhance the user experience by Module 9: Adding Offline Support to Web Applications adding animations to an HTML5 page. This module describes how to add offline support to a Web application, to enable • Use Web Sockets to send and receive the application to continue functioning in a user's browser even if the browser is data between a Web application and a disconnected from the network. server. Lessons • Improve the responsiveness of a 1. Reading and Writing Data Locally Web application that performs long- 2. Adding Offline Support by Using the Application Cache running operations by using Web Worker processes.

www.dynamicsedge.com | (800) 453-5961 3 Module 10: Implementing an Adaptive User Interface This module describes how to create HTML5 pages that can dynamically detect and adapt to different devices and form factors.

Lessons 1. Supporting Multiple Form Factors 2. Creating an Adaptive User Interface

Module 11: Creating Advanced Graphics This module describes how to create advanced graphics for an HTML5 Web application by using a Canvas element, and by using Scalable Vector Graphics.

Lessons 1. Creating Interactive Graphics by Using Scalable Vector Graphics 2. Programmatically Drawing Graphics by Using a Canvas

Module 12: Animating the User Interface This module describes how to enhance the user experience in an HTML5 Web application by adding animations.

Lessons 1. Applying CSS Transitions 2. Transforming Elements 3. Applying CSS Key-frame Animations

Module 13: Implementing Real-Time Communications by Using Web Sockets This module explains how to use Web Sockets to transmit and receive data between an HTML5 Web application and a server.

Lessons 1. Introduction to Web Sockets 2. Sending and Receiving Data by Using Web Sockets

Module 14: Creating a Web Worker Process This module describes how to use Web Worker Processes to perform long-running operations asynchronously and improve the responsiveness of an HTML5 Web application.

Lessons 1. Introduction to Web Workers 2. Performing Asynchronous Processing by Using a Web Worker

www.dynamicsedge.com | (800) 453-5961 4