JavaScript and HTML5: Develop Web Applications (D84842) – Outline

Detailed Course Outline

Introduction

• Knowing the objectives of the course
• Setting up the Environment

Web Application Essentials

• Creating HTML5 Applications in NetBeans
• Running HTML pages and analizing them by using the browser's development tools
• Separating CSS and JavaScript content from HTML pages
• Running HTML5 Applications in NetBeans
• Practice: Creating HTML5 Web Applications with NetBeans 8
• Practice: Separating JavaScript and CSS Resources

JavaScript Fundamentals

• Writing JavaScript code to declare variables, objects, functions and arrays
• Writing JavaScript Arrays to store data
• Defining JavaScript Objects as a key-value store
• Accessing the properties of an object
• Practice: Writing JavaScript code to pass tests in Jasmine

Combining HTML5 and JavaScript in Web Applications

• Creating HTML5 Documents
• Creating HTML5 Forms to request information and process it
• Validating HTML5 form input
• Writing JavaScript functions for HTML5 events
• Manipulating HTML5 elements through DOM
• Practice: Writing JavaScript code to modify document elements

The JavaScript API

• Validating user input with JavaScript and Regular Expressions
• Handling multiple values with JavaScript Collections
• Manipulating Dates with the JavaScript Date API
• Practice: Creating a meal-divider application
• Practice: Calculating the total based on the age

Web Application Data

• Converting Objects to JSON Strings
• Parsing JSON Strings into JavaScript Objects
• Storing Objects by using the JSON API, Cookies, and Local Storage
• Practice: Saving user input using JSON and Local Storage
• Practice: Restoring saved data when page loads

Style Applications using CSS3 and JavaScript

• Applying CSS styles to HTML documents
• Using CSS3 features to add dynamic styles to elements with events
• Using Media Queries and media data to adapt to different screens
• Using JavaScript to add and remove styles from elements
• Practice: Writing CSS rules to style elements in the document

Advanced JavaScript

• Defining Functions
• Creating Closures and explaining Variable Scope
• Writing JavaScript functions as modules
• Creating Prototypes
• Creating Drag-and-Drop interactions with JavaScript
• Creating JavaScript Timers and Delays to create animations in HTML
• Using the HTML5 Canvas Object to draw in pages
• Practices: Creating a Canvas, intervals, Drag and Drop, and implementing Mouse Gestures

AJAX and WebSocket

• Using AJAX with JavaScript to request data from an Application Server
• Using AJAX to consume RESTful Web Services
• Using AJAX calls to create "Server Push" interactions
• Identifying alternatives to AJAX used in legacy code
• Understanding AJAX Security
• Using WebSocket to create Real-time Client/Server interactions
• Identifying the required Back-End technologies for REST and WebSocket with Java EE7
• Practices: Creating a Single-Page Application using RESTand a Tic-Tac-Toe Game Client with WebSocket

Developing Applications with jQuery

• Adding jQuery and jQuery UI libraries to your projects
• Using Selectors and DOM manipulators to handle documents
• Handling Events with jQuery
• Animating elements and Applying effects in the document
• Handling AJAX server responses