Beginning jQuery
Course Description Overview
jQuery is a cross-browser JavaScript library used to create dynamic web pages. It was written to make DOM manipulation (moving things around a web page) easier for developers. It uses JavaScript to assign HTML elements these attributes. Because it is a library of predefined functions, all you need to start using jQuery is a working knowledge of the syntax and a reference for the functions available to you.
jQuery has numerous advantages over other JavaScript libraries; some of them being that it is easy to start with, is cross browser-friendly, uses shorter code, has a considerable number of available plugins, and most of all, is easy to use with Ajax.
This means there is a considerable market of developers wanting to get into the world of jQuery.
This course will show how you can integrate jQuery 3.0 into your web pages, avoid complex JavaScript code, create brilliant animation effects for your web applications, and create a flawless app.
Begin with configuring and customizing the jQuery environment and get hands-on with DOM manipulation. Learn to integrate jQuery with your favorite backend framework. Learn how the ECMAScript 6 features affect web development with jQuery. Discover how to use the newly introduced JavaScript promises and the new animation API in jQuery 3.0, along with sample code and examples.
By the end of the course, you will be able to successfully create a fully-featured and efficient single-page web application and leverage all the new features of jQuery 3.0 effectively.
This course is ideal for client-side JavaScript developers. You do not need to have any previous experience with jQuery.
You do not need to have any previous experience with jQuery, although basic JavaScript programming knowledge is necessary. You should know the basics of JavaScript, including variables, functions, and selecting DOM elements. You should also have a basic knowledge of HTML5 and CSS3 syntax.
For this course, we will use the following software:
- 64-bit Windows 8
- Atom
- The latest versions of Google Chrome and Mozilla Firefox
- Node.js (8.3.x-see https://nodejs.org/en/)
- Yarn (0.27.5-see https://github.com/yarnpkg/yarn/releases/tag/v0.27.5)
Installation and Setup
- Download and install Atom from: https://atom.io/
This course will require a computer system for the instructor and one for each student. The minimum hardware requirements are as follows:
- Processor: i3
- Memory: 2 GB RAM
- Hard disk: 10 GB
- Internet connection
Lesson 1: Beginning with jQuery 3
- Making our First jQuery-Powered Web Page
- Using jQuery with Developer Tools
Lesson 2: Selecting Elements
- Understanding the DOM
- Exploring CSS Selectors
- DOM Traversal Methods
Lesson 3: Handling Events
- Performing Tasks on Page Load
- Handling Simple Events
- Event Propagation
- Altering the Journey – The Event Object
Lesson 4: Styling and Animating
- Modifying CSS with Inline Properties
- Built-in Animation Effects
- Creating Custom Animations
- Simultaneous Versus Queued Effects
Lesson 5: Manipulating the DOM
- Manipulating Attributes and Properties
- DOM Tree Manipulation
Lesson 6: Working with Ajax
- Loading Data on Demand
- Passing Data to the Server
- Deferreds and Promises
Lesson 7 jQuery Plugins
- Using a Plugin
- jQuery UI
- jQuery Mobile
Lesson 8: Advanced Selectors, Traversing, and DOM Manipulation
- Selecting and Traversing Revisited
- Writing a Custom Selector Plugin
- Using HTML5 Data Attributes
- Revisiting Attribute Manipulation
Lesson 9: Advanced Events and Effects
- Event Delegation
- Defining Custom Events
- Interrupting Animations
- Multi-property Easing and Deferred Objects
Lesson 10: Advanced Ajax
- Fetching Data with CORS
- Using the jqXHR Object
- Extending Ajax Capabilities