Mastering jQuery

Course Details
Code: TT4665
Tuition (USD): $2,495.00 • Classroom (4 days)

Mastering jQuery provides an introduction to and experience working with the JavaScript programming language in the environment it's used in the most: the browser. JavaScript is simple and elegant, but is often difficult to work with because it's so different from the programming languages most developers are used to working with. This course also covers jQuery and provides practical and hands-on experience with the preferred JavaScript library for building rich web applications. If you are building for the web, learning jQuery will change the way you write JavaScript, working across multiple browsers and platforms.

Skills Gained

This course provides indoctrination in the practical use of the umbrella of technologies that are on the leading edge of web development. This course is “skills-focused”, designed to train attendees in robust web development and design skills, coupling the most current, effective techniques with the soundest development and design practices. Throughout the course, students will be led through a series of progressively advanced topics, where each topic consists of lecture, group discussion, comprehensive hands-on lab exercises, and lab review.

  • Become both familiar with the language and confident enough to work with it in any context
  • Learn what jQuery is and how to add it to your applications
  • Use jQuery to select complex sets of elements from the DOM
  • Develop rich web pages that respond to user interaction
  • Interact with your server-side code using Ajax
  • Explore a wide variety of plugins and learn how to write your own
  • Test your applications to make sure your JavaScript is as solid as the rest of your code

Who Can Benefit

This is an introductory and beyond-level web development course, designed for experienced developers who need to extend their knowledge of web design and development.

Prerequisites

This is a hands-on programming class. Attendees should have previous experience or working knowledge of developing software applications. Real world programming experience is a must.

Course Details

jQuery

Lesson: Why jQuery?

  • JavaScript Evolution
  • Why jQuery?
  • jQuery Usage
  • Downloading jQuery

Lesson: Basic jQuery

  • jQuery: Operational Overview
  • jQuery Capability Overview
  • Basic Selectors
  • Multiple Selector
  • Selecting by Order

Lesson: Manipulating the DOM

  • Attributes vs. Properties
  • CSS Box Model Properties
  • Element Content
  • Manipulating Children
  • Wrapping and Unwrapping
  • Effects (Basic Animation)
  • Effects Queues

Lesson: More On Element Selection

  • Hierarchical Selectors (Combinators)
  • Attribute Selectors
  • Basic vs. Child Filters
  • Filtering Methods
  • Traversing Methods

Lesson: More on Attributes!

  • Selecting From Forms
  • Selecting Parent and Children
  • Automatic DOM Traversal
  • Manipulating DOM Elements
  • Getting and Setting Attribute Values
  • Removing Attributes

Lesson: More jQuery!

  • The jQuery Function
  • The jQuery Object
  • Some jQuery “Static” Methods
  • Utility Methods

Lesson: Event Handling

  • Binding Multiple Events to Same Handler
  • Multiple Events to Different Handlers
  • Event Targets
  • Triggering Events
  • Custom Events
  • Live Events

Lesson: More On Elements!

  • Changing HTML Content
  • Changing Text Content
  • Managing Elements
  • Introduction to Animations

jQuery Plugins

Lesson: jQuery Plugins

  • jQuery Validation Plugin
  • jQuery Form plugin
  • jQuery BBQ (Back Button & Query) Plugin
  • jQuery Hotkeys Plugin
  • jQuery Color Plugin

Lesson: jQuery UI

  • jQuery UI Effects
  • Advanced Easing
  • Interactions
  • Position Utility
  • Widgets
  • Icons

Lesson: Templates

  • Micro Templates
  • jQuery Template Plugin
  • Compiling Templates
  • Template Items

JavaScript Object Notation (JSON)

Lesson: JSON Objects

  • Arrays
  • Objects
  • Arrays in Objects
  • Objects in Arrays

Lesson: JSON Syntax and Processing

  • JSON Parsers
  • Sending Data
  • JSON vs XML

Lesson: jQuery, JSON, and AJAX

  • jQuery AJAX Utility Methods
  • jQuery and JSON
  • jQuery and Other Data Types
  • Serialization
  • Deferred Objects
  • Promises and Piping
  • Chaining Tasks

Web Application Performance

Lesson: Download Options

  • User Experience on Page Load
  • Multi-Stage Downloading
  • Predictive Fetching
  • On-Demand Downloading
  • JavaScript and CSS Minification

Lesson: Debugging

  • Internet Explorer Developer Tools
  • FireBug & FireBug Lite
  • Fiddler

Lesson: Optimization

  • DOM Management
  • Cyclic References
  • Reusing DOM Nodes
  • Code Optimization
  • CSS and Reflow Minimization

Lesson: JavaScript Best Practices

  • JavaScript Code Conventions
  • Formating and Structure
  • Variable and Function Declarations
  • Statement Conventions
  • Best Practices and Principles

Web App Design Patterns

Lesson: Responsive Design

  • Responsive and Adaptive
  • Viewports
  • Flexible Grids and Media
  • Media Queries

Lesson: UI Patterns Overview

  • User Interface/Interaction Design Patterns
  • Categories from Yahoo! Design Pattern Library
  • Web Application Design Principles

Lesson: Layout Patterns

  • Page Grids
  • Page Grids Solution

Lesson: Navigation Patterns

  • Accordion
  • Alphanumeric Filter Links
  • Breadcrumbs
  • Item Pagination
  • Search Pagination
  • Module Tabs
  • Navigation Tabs
  • Progress Bar

Lesson: Selection Patterns

  • AutoComplete
  • Calendar Picker
  • Carousel

Lesson: Rich Interaction Patterns

  • Invitations
  • Transitions
  • Drag and Drop
  • Rich Interaction