In this JavaScript & jQuery with JSON & Ajax training class, students learn ways to improve their web pages and make functionality more efficient. During this hands-on, self-paced training class, students will expand on their JavaScript and jQuery knowledge and learn how to use the features of JSON (JavaScript Object Notation) and Ajax (Asynchronous JavaScript And XML).
Learning Objectives
At the end of this course, you learn the following:
- The "Query" in jQuery
- Action/Reaction: Making Pages Come Alive with Events
- Animations and Effects
- Improving Your Images
- Improving Navigation
- Expanding Your Interface with jQuery and jQuery UI
- JSON and Ajax Client Side Applications
Topics and Subtopics
In this course, we cover the following topics and subtopics:
Quick JavaScript Programming Refresher
1. Lexical Structure
2. Expressions
3. Types
4. Variables
5. Functions
6. this
7. Arrow Functions
8. Loops
9. Scopes
10. Arrays
11. Template Literals
12.Semicolons
13.Strict Mode
1. Coding JavaScript Functions & Arrays
- Function Introduction
- Functions, Parameters, and Returns
- Calling Functions from Events
- Declaring Arrays
- Manipulating Arrays
2. Obtaining and Manipulating User Information
- Navigator Object
- Window Objects
- Screen Object
- User Information
3. JavaScript and jQuery Advanced
- About JavaScript Libraries
- Getting jQuery
- Adding jQuery to a Page
- Modifying Web Pages: An Overview
- Understanding the Document Object Model
- Selecting Page Elements: The jQuery Way
- Adding Content to a Page
- Setting and Reading Tag Attributes
- Reading, Setting, and Removing HTML Attributes
- Acting on Each Element in a Selection
4. The “Query” in jQuery
- Using jQuery selectors
- Wildcards
- Selecting by: Tag, Id, Class, Attribute, position
5. Action/Reaction: Making Pages Come Alive with Events
- What Are Events?
- Using Events the jQuery Way
- Introducing Events
- More jQuery Event Concepts
- Advanced Event Management
6. Animations and Effects
- jQuery Effects
- Login Slider
- Animations
- Performing an Action After an Effect Is Completed
- Animated Dashboard
7. Improving Your Images
- Swapping Images
- Cross Fading images
- Timer based animations
8. Improving Navigation
- Some Link Basics
- Opening External Links in a New Window
- Creating New Windows
- Opening Pages in a Window on the Page
- Basic, Animated Navigation Bar
9. Expanding Your Interface with jQuery and jQuery UI
- Organizing Information in Tabbed Panels
- Adding a Content Slider to Your Site
- Determining the Size and Position of Page Elements
- Adding Tooltips
10. JSON and AJAX Client Side Applications
- Calling JSON APIs
- Building DOM from Data and JQuery
- Adding Interactivity to dynamically created assets
11. Project 1: Image Swap Gallery
12. Project 2: Login Page
13. Project 3: COVID-19 Tracker
Requirements
Basic knowledge of HTML and CSS as well JavaScript is required.
Related Courses
- Web Design with WordPress
- Intro to Joomla CMS
- Introduction to Drupal CMS
- Web Design with Bootstrap
- User Experience Best Practices
- Intro to Search Engine Optimization
Complete Training Bundle
If you are serious about learning web design and development, you should enroll in our Web Design and Development Training Bundle. This bundle covers all essential and practical topics related to web development. For $290 monthly subscription, you can have access to 300+ hours of hands-on project-based training covering all courses related to web development like JavaScript, PHP, JavaScript frameworks like React or Angular and many more. Click here to learn more.
Private Tutoring Classes
To take skills you learn from this course to the next level, taking the Coding Bootcamps School tutoring classes are highly recommended. It is also a great opportunity to discuss your questions and problems related to this course with an experienced instructor:
- Web design and development tutoring sessions- Weekly and monthly plans
- JavaScript, jQuery, Node.JS, MongoDB, and Express.JS- Private tutoring sessions
What Is Next?
After finishing this course, you can enroll in any of following classes:
- Learn Node.JS, Express.JS and MongoDB
- Intro to Angular.JS Framework
- Intro to React.JS Framework
- Vue.JS Framework
Recommended Free Courses
If you are new to the IT or programming, we suggest the following free courses:
Kaustubh Ghadge- MBA, MS, and Senior MEAN Stack Developer
Kaustubh has over five years of technology consulting experience with focus on web development, cloud technologies. In his experience as a web developer and digital strategist, Kaustubh has worked with SaaS startups within the industries of marketing and mortgage technology.
He has an MBA and a master of Computer Science from Illinois Institute of Technology.
He is co-founder of Chicago based Indica Digital which focuses on mortgage digital strategy and Pune based Intelliflow Systems. As a senior instructor at High School Technology Services, Kaustubh has taught full-stack web development and cross-platform mobile App development to students from the U.S. and Canada.
Here are his two more courses:
Course Curriculum
- What you'll learn in this course (8:06)
- 1. JavaScript Programming Refresher (11:16)
- 2. Obtaining and Manipulating User Information (8:02)
- 3. Advanced JavaScript and jQuery (18:11)
- 4. jQuery Selectors and Wildcards (9:19)
- 5. Making Pages Come Alive with Events (9:04)
- 6. Animations and Effects (9:39)
- 7. Improving Images with JS (5:32)
- 8. Improving Navigation with JS (8:33)
- 9. Expanding Page Interface with jQuery and jQuery UI (10:13)
- 10. JSON and AJAX Client Side Applications (11:30)
- Next steps (5:08)
Master Vue.JS framework by hands-on examples
Learn how to build a complex web UI with Angular.JS
Develop advance web applications with React.JS