Complete JSON AJAX API Course - Beginner to Professional
4.5 (465 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
6,449 students enrolled

Complete JSON AJAX API Course - Beginner to Professional

Learn how to use JSON and get JSON data using AJAX Course includes practice exercises and examples using JSON & AJAX
Bestseller
4.5 (465 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
6,448 students enrolled
Created by Laurence Svekis
Last updated 5/2020
English
English [Auto-generated]
Current price: $129.99 Original price: $199.99 Discount: 35% off
12 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 20 hours on-demand video
  • 83 articles
  • 64 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Use JSON data within web applications
  • Make AJAX requests across the web
  • Build more dynamic and interactive applications
Course content
Expand all 279 lectures 20:24:45
+ JSON JavaScript Object Notation Introduction
21 lectures 01:37:18
JSON in JavaScript
07:18
Source Code
00:07
JSON Overview.
09:53
JavaScript Objects
06:20
Creating JSON
04:28
Source Code
00:09
More complex nesting JSON
09:12
Source Code
00:12
Back to JavaScript
07:17
Source Code
00:09
Multiple Values in Object
07:16
Source Code
00:13
Use JavaScript with JSON
06:34
Source Code
00:15
JSON on the web
12:54
Source Code
00:12
Session storage JSON
12:07
Store Values as String
06:28
Source Code
00:22
Section Resources JSON
00:00
+ JSON exercise Task List
19 lectures 01:38:36
JSON exercise getting to know JSON
02:56
MYJSON website not working anymore
00:26
JSON Exercise Setup Data
07:00
JSON Exercise Use String Values as Data.
11:15
JSON Exercise Make it Interactive
09:33
Source Code JSON exercise
00:20
JSON Exercise JSON better structure
05:45
JSON Exercise Use the new Data with JavaScript
08:58
JSON Exercise Store Current Data Instance
08:10
Source Code Lesson 6
00:27
JSON Exercise Add new items to the list
07:37
JSON Exercise Tweaks and Bug Fixes
12:00
JSON Exercise sessionStorage ready data.
03:46
Source Code JSON application
00:35
JSON Exercise Delete a Task
09:01
JSON exercise AJAX and JSON
09:17
Source Code Completed Project
00:40
Updated Source Code with new endpoint and json data
00:46
Exercise Resources
00:01
+ AJAX various AJAX options in JavaScript
19 lectures 01:28:10
AJAX introduction for Fetch and XHR
07:47
XHR requests across the web
11:52
Exercise Random User XHR options
06:23
Exercise Random User AJAX Load Data
05:38
Source Code Exercise AJAX
00:16
More XHR practice
04:26
XHR Request Data
09:34
Source Code Joke Exercise
00:12
JavaScript Fetch
05:23
Source Code Fetch
00:14
Fetch Promise Response.
08:22
Fetch Options
05:17
Source Code Fetch Jokes
00:13
Post with Fetch
05:06
Fetch Form Submit Data
10:34
Source Code form submit
00:27
AJAX section Overview
01:57
Resources for section
00:01
+ AJAX libraries jQuery and Axios
25 lectures 01:19:23
Introduction to jQuery
03:11
AJAX with jQuery
07:51
jQuery AJAX output to element
06:38
Source Code JQuery Get
00:11
jQuery in Codepen
07:38
Source Code 4
00:04
jQuery AJAX shorthand
03:08
Source Code 5
00:10
jQuery Mulitple Items API
04:19
Source Code Get JSON
00:11
jQuery Post example
08:22
Source Code POST jQuery
00:14
jQuery post with AJAX
04:17
Source Code jQuery Post
00:15
JQuery Exercise Overview.
03:30
JavaScript libraries for AJAX
08:10
AXIOS Get Data Update HTML
01:55
Source Code Axios Form
00:15
Loop Multiple Items in Object
03:32
Source Code Axios Exercise
00:16
Axios AJAX post
04:46
Source Code Exercise Axios
00:16
Axios Exercise Overview
04:23
Section Resources
00:29
+ JSON Server Exercise Practice JSON and AJAX locally
20 lectures 01:39:35
How to Setup Local JSON Database
09:48
Postman Tool for AJAX
04:10
Create your HTML elements
04:37
Interactive Button
07:26
XHR request data
06:59
Source Code JSON server
00:19
XHR post data to json DB
05:22
Exercise JSON server interface
14:17
Exercise Build Page Comments
06:34
Source Code JSON database
00:51
Post create new posts
06:02
Source Code Posts
00:58
Search JSON server
05:45
List Comments
05:45
Add Post Comments
07:35
Source Code Post to JSON db
01:18
Code Review JSON server
05:29
Source Code GET POST content
01:26
Section Resources
00:06
+ Google Sheet API data GET POST with jQuery
19 lectures 01:29:56
Setup Sheet Data
05:28
Google Sheet Get Sheet Data as JSON
05:42
Source Code Google Script
00:02
JSON Output Sheet Data
06:38
Source Lesson 3 GS data
00:14
Apps Script Google Scripting Server Side
08:36
Use Google Script to Create Output
15:36
Google Script Source Lesson 5
00:10
Create JSON feed from Google Sheets
06:07
Source Code lesson 6
00:13
Google Script POST data
12:02
Google Script Lesson 7
00:22
Form Setup to Post on webpage
04:22
Post data to Google Sheets
05:58
Random User Data API
06:30
Project Overview and Review.
08:25
Final Application Source Code
00:39
Resources
00:02
+ AJAX request tester using GET and POST exercise
14 lectures 01:05:54
Setup Page Elements
03:55
Make first AJAX Request
02:54
Dynamic Input data
11:02
AJAX Add jQuery
08:33
Add Axios AJAX
04:54
Add Fetch AJAX
04:51
Source Code GET
00:54
Add Post Data Option
08:15
Update for POST
03:32
Update post for Fetch and Axios
04:20
AJAX tester Code Review
07:58
Source Code completed
01:18
Section resources
00:03
+ JavaScript AJAX API exercise YouTube and Wikipedia API
11 lectures 56:10
Page and Element Setup
04:16
Bring in the XHR Object
09:20
Connect to Wikipedia AP
06:29
Output Data into web Page
08:10
YouTube API with JavaScript
05:28
Add YouTube API search
05:58
Style data output
08:17
Information app source code review
04:41
Source Code Final Application
00:51
Section resources
00:02
+ More APIs Trivia API and more
16 lectures 53:47
Element and Page Setup
03:34
AJAX Make Request Callback
03:28
Connect Get API content
04:18
Output Question format
04:58
Source Code 4
00:23
Dynamic Build Buttons JavaScript
06:19
JavaScript Dynamically Build Elements
04:25
Source Code 6
00:31
Tweak Quiz and add Scoring
06:05
Show correct answer
06:59
Source Code Quiz
00:45
More fun with APIs
07:10
AJAX API section conclusion
02:40
Source Code 10
00:17
Section resources
00:02
Requirements
  • Basic HTML and JavaScript
  • Web development experience
  • Coding experience is required
Description

Prefect course for beginners to learn AJAX and JSON!!! Step by step learning with all steps included

Perfect for API Beginners to learn more about connecting to web apis with JavaScript

Please note this course is designed for students with prior coding experience and objective of the course is to present how to connect to APIs and endpoints using JavaScript.  The course does have prerequisites - JavaScript knowledge is an absolute prerequisite to the course - DO NOT TAKE THE COURSE without prior Coding experience.

Loaded full of examples and code snippets that can be used to build upon, practice and get comfortable with AJAX.  Top developer resources, helpful tips and many many open APIs to practice with all included.   

Source Code also included so you can jump right in and start building applications.

JSON is the preferred format for data being transferred between coding languages.  Its easy to read, create and work with.   Learn about JSON how it works and how you can use it within your own applications.

AJAX provides the ability for your JavaScript code to make http requests to get data and update your page content with the new data.  The data is commonly in JSON format which makes it ideal for use within JavaScript applications.

Together AJAX and JSON are used everywhere and go hand in hand powering many of the top web applications and providing users what they expect from modern websites.

Technologies used within this course : JavaScript, HTML, CSS, Nodejs, AJAX, jQuery, SQLite, plus several npm packages

JSON - JavaScript Object Notation

A lightweight data-interchange format which is easy for humans to read and write

  • Learn what JSON is and how to use it with JavaScript.  

  • Explore how to read and write JSON objects.  

  • Iterate thru JSON data and output data contents into your web page HTML elements.   

  • Build JSON in a dynamic format for better versatility and management.  

  • Event Triggers : How to trigger event listeners to use JSON data within JavaScript. Saving JavaScript data as JSON formatted content.   

  • JSON objects and Strings in JavaScript, conversion and manipulation.

  • Getting JSON using HTTP XML request object.  

  • Exercise : practice JSON by building out several mini projects including a task list from scratch which stores content into local storage and retrieves local string content converted back in usable JavaScript objects.

AJAX - Asynchronous JavaScript and XML

AJAX  for building web based interactive applications that process user requests immediately.  No page reload bring data into your application.

  • Explore how AJAX works and how it is used in web applications

  • See what Fetch and XHR are and how they work to get data

  • Connect to external content and data, load it into you application and output the data for the user.

  • Exercise : Using AJAX to connect to a web API and retrieve random user information.

  • Learn how to use AJAX to get a txt file content

  • Exercise : Use AJAX to retrieve jokes from an API and output the response data into your website.

  • Find out how to use Fetch and make AJAX requests using Fetch

  • Exercise : Simple POST and GET to server using Fetch and xHR AJAX. Posting form data to a server using Fetch

AJAX made easy with Libraries

Explore AJAX using two of the most popular libraries online. They solve the problem of cross browser differences in XHR requests and provide a seamless easy to apply experience when using AJAX

  • Using jQuery or Axios for AJAX

  • The easy way to AJAX with options

  • jQuery AJAX and shorthand ajax methods.

  • Exercise : Connect to various web APIs using jQuery and Axios - Build simple AJAX mini applications

  • jQuery Explore how you can use this most popular JavaScript library to do more with less coding.

  • Lightweight library option : Axios provides a seamless AJAX approach that works off promises.

JSON Server for AJAX practice Locally

Often when using AJAX locally we run into CORS errors or others, JSON server provides the perfect resource to easy setup and practice running a local JSON ready server.  Send POST and GET requests and a whole lot more.

  • Learn how to set JSON server locally

  • Top resources to practice AJAX requests during development like Postman

  • Exercise : Create a front end application to connect to your JSON server and send data.  JavaScript and HTML to setup user interface

  • Practice making an AJAX request to the local server.  Posting to JSON server using JavaScript AJAX

  • Exercise : Practice exercise to build interactive application driven by local json DB data.

  • Add more options and even search the local database. Amazing easy to use JSON server options like search

  • Exercise : Mini application to store user info into the database.

Google Sheets as a data source for AJAX requests

Explore using Google Script along with Google Sheets to output data from your sheet.  Learn how to connect that data to your applications.  Apps Script is a scripting language for light-weight application development in the G Suite platform

  • Step by step instruction on how to setup Google Sheets with a web app outputting data as JSON

  • Use AJAX from your web application to get that data into your JavaScript code.

  • Extend this even further using Google Apps Script.  GET and POST to the Google Script web app adding and retrieving data in JSON format.

  • Exercise : Send and retrieve data from Google Sheets.  Create a user list as Google Sheets used as a data source.

  • Exercise : Connect to a web API for user data and add it easily into your form to send to your Google Sheet.

AJAX using xHR request, Fetch, jQuery and Axios

Different options for AJAX requests are explored and presented for comparison.  

  • Step by step lessons to help you learn AJAX.  

  • Explore the various ways to make AJAX request while building and learning about the 4 different methods presented within the course.  

  • Exercise : fully functional mini tester application where you can input a URI and make AJAX requests.  

AJAX retrieving JSON data from popular end points

Using AJAX request data for your applications from popular APIs like YouTube and Wikipedia.  Learn how to navigate web APIs and use the data within your projects.

  • Exercise : Connecting to Wikipedia API and exporting response data from API

  • Exercise : Connecting to YouTube and Wikipedia using search to query and return JSON data to use within your webpage.

JavaScript AJAX based trivia application exercise

Explore using popular APIs to build interactive and dynamic applications.

  • Exercise : Connecting to trivia API and sorting response data

  • Exercise : Using response JSON to output and build dynamic content for users to interact with.

RESTful API setup and development

Using Node, jQuery, JavaScript, SQLite, learn how to setup and connect a database to a RESTful API.

  • Explore how to setup a Restful API!  GET, POST, PUT, DELETE

  • Explore how the terminal can be used to setup a backend server using Node.js.  Command line interface simple commands will be used to navigate and seutp folders.

  • Learn how to setup an http server using node ready for localhost

  • Using web resources like postman test your routes and endpoint responses.  API web resources Postman CRUD

  • Setup your routes for a  Restful API GET POST PUT DELETE

  • Updating with adding a SQLite Database to hold data

  • Exercise : Mini application to send and retrieve user information from server database.

RealTime Push messaging Exercise

Using pusher setup a real time messaging application that pushes data to open pages.  Send and retrieve data in real time instantly.

  • Explore how to integrate web services into applications.

  • Use AJAX requests to send data to web services

  • Exercise : Build a simple real time messaging application from scratch

AJAX fetch request API Exercise

Explore how to build a simple Crypto Currency web application from scratch.  Perfect exercise to learn more and practice different request options as well as explore how to customize data for frontend output.

  • Setup a local server using Express and practice AJAX requests locally

  • Avoid local CORS errors and sending requests from the backend

  • Use request to connect to web APIs 

  • Multiple ways to make AJAX requests including fetch and jQuery

  • Explore retrieving and updating API data on the backend before it comes to the frontend

  • Exercise : Build a custom Crypto currency information application

AJAX Twitter API Exercise

Explore the Twitter Developer API connect from your local machine.  Use AJAX JavaScript and Node to setup twitter search.

  • Learn to setup a local server request web content

  • Connect to the Twitter API return MASSIVE amounts of data Search and explore

  • Access Tweet objects and get JSON data to your webpage

  • POST to Twitter from your webpage

  • GET tweet objects

  • Exercise : Build a mini application to search tweets and post to twitter.

This course covers everything you need to learn about JSON and AJAX, including practice exercises, loads of examples, source code and step by step training.  Along with friendly support in the Q&A to help you learn and answer any questions you may have.

Try it now you have nothing to lose, comes with a 30 day money back guarantee.  

See what you can build with AJAX and JSON!!!!

Who this course is for:
  • Anyone who wants to learn more about APIs
  • Web developers
  • Web application developers
  • Beginners to JSON and AJAX
  • Developers who want to practice getting JSON data