Advanced AJAX Techniques and Final Projects
Ends soon! Keep adding new skills with 10,000+ programs for $239 (usually $399). Save now.
Advanced AJAX Techniques and Final Projects
This course is part of AJAX Next Level: Authentication, Servers, Projects & More Specialization
Included with
Ask Coursera
Recommended experience
Recommended experience
What you'll learn
Explain how to define RESTful API endpoints using Express
Test API routes using Postman to ensure robust backend development
Develop a complete backend application using Node.js, Express, and NPM
Skills you'll gain
Details to know
See how employees at top companies are mastering in-demand skills
Build your subject-matter expertise
- Learn new concepts from industry experts
- Gain a foundational understanding of a subject or tool
- Develop job-relevant skills with hands-on projects
- Earn a shareable career certificate
There are 6 modules in this course
Updated in May 2025.
This course now features Coursera Coach! A smarter way to learn with interactive, real-time conversations that help you test your knowledge, challenge assumptions, and deepen your understanding as you progress through the course. In this comprehensive section, you will embark on a journey to master the essentials of server-side development using Node.js. Starting with an introduction to setting up your Node.js environment, you will learn how to use Express, a powerful and flexible framework, to create and manage servers effectively. This section emphasizes the importance of understanding the server's role in handling AJAX requests and the basics of RESTful API design. You will dive deep into defining RESTful API endpoints, exploring how different user actions, such as adding, updating, and deleting resources, are processed by the server. Each endpoint will be meticulously crafted to ensure REST compliance, providing you with a solid foundation in API design. Practical examples and detailed explanations will help you grasp the intricacies of route handling and server responses. To enhance your development workflow, you will also learn about essential tools like NPM and Postman. These tools will aid in installing necessary modules, managing dependencies, and testing your API routes. By the end of this section, you will have a robust Node.js server set up with well-defined RESTful API routes, ready to handle complex web applications. This course is ideal for web developers and backend engineers looking to enhance their skills in server-side development. A basic understanding of JavaScript and web development concepts is recommended. Familiarity with Node.js and Express will be helpful but not required.
In this module, we will focus on setting up the server-side of our course's final project. We will start by defining RESTful API endpoints, essential for handling user actions such as adding, updating, and deleting resources. Using Node.js and the Express framework, we will build and organize server-side code, ensuring our server can efficiently process and respond to AJAX requests. Additionally, we will utilize tools like Postman to test our routes, ensuring they function correctly before moving on to the front-end implementation.
What's included
27 videos2 readings
27 videos•Total 138 minutes
- Introduction to Section•3 minutes
- Defining RESTful API Endpoints•14 minutes
- First, We Will Build Server-Side Code and Then Only AJAX•1 minute
- Sneak Peek•2 minutes
- Using NPM to Install the Express Framework•6 minutes
- What is NPM and Node Modules•4 minutes
- Viewing the Express Source Code Inside the node_modules Folder•2 minutes
- Setting Up Our Node Server•7 minutes
- Difference Between res.send() Versus res.end()•6 minutes
- Defining Routes on Our Server•3 minutes
- Defining Our Routes in a Separate File•5 minutes
- Exporting Our Routes Through the module.exports Command•3 minutes
- JavaScript Modules (ES Modules) Versus Node Modules (CommonJS)•8 minutes
- Testing Our Router Object•4 minutes
- Creating the GET Route•10 minutes
- Installing Nodemon•5 minutes
- Postman Introduction•4 minutes
- Creating a POST Route•12 minutes
- Express.json() Versus Express.urlencoded()•4 minutes
- Creating a Unique ID Function•4 minutes
- Creating a PUT Route - Part 1 (Using the find Method)•8 minutes
- What is the Array.find() Method•2 minutes
- Creating a PUT Route - Part 2 (Using the splice Method)•3 minutes
- What is the Array.splice() Method•8 minutes
- Testing Our Routes in Postman•3 minutes
- Creating a DELETE Route•6 minutes
- Server Outro•2 minutes
2 readings•Total 20 minutes
- Introduction to the Course 'Advanced AJAX Techniques and Final Projects '•10 minutes
- Full Specialization Resources•10 minutes
In this module, we will build the AJAX API for our course project using the XMLHttpRequest object. Starting with a basic front-end setup, we will create GET, POST, PUT, and DELETE requests, integrating them into our project. We will address CORS issues by implementing custom middleware and using third-party modules like "cors". Additionally, we will focus on modularizing our AJAX functionality, making our code more readable and maintainable for future development.
What's included
18 videos
18 videos•Total 101 minutes
- Introduction to Section•2 minutes
- What Are We Going to Build Together?•4 minutes
- HTML and File Overview•6 minutes
- XHR AJAX GET Request•19 minutes
- Fixing CORS by Writing a Custom Middleware Function•6 minutes
- Fixing CORS by Installing the "cors" Module with NPM•4 minutes
- Adding Dynamic Text to the GET Request•3 minutes
- Creating an AJAX Library/Module•3 minutes
- Converting Our GET Request into a Module•10 minutes
- Overview of Our GET Request•3 minutes
- XHR AJAX POST Request•8 minutes
- Improving Our GET Request (Turning Our AJAX Call into a Synchronous One)•6 minutes
- Completing the POST Request by Initiating the Request in the app.js File•8 minutes
- Updating the POST Paragraph Text Dynamically•5 minutes
- Adding Some Error Handling•2 minutes
- Completing the PUT XHR Request•6 minutes
- Completing the DELETE XHR Request•5 minutes
- XHR Outro•1 minute
In this module, we will upgrade our AJAX API by transitioning from the XMLHttpRequest object to the modern Fetch API. We will rewrite our GET, POST, PUT, and DELETE requests using Fetch, leveraging Promises to handle asynchronous operations more effectively. This refactoring will not only modernize our code but also enhance its efficiency and readability, ensuring a more robust and maintainable codebase.
What's included
8 videos1 assignment
8 videos•Total 31 minutes
- Introduction to Section•1 minute
- GET Fetch Request - Setup•9 minutes
- Using a Callback Function to Write Our GET Fetch Request•4 minutes
- POST Fetch Request•5 minutes
- PUT Fetch Request•4 minutes
- DELETE Fetch Request•3 minutes
- Summary - Our AJAX Requests Are RESTful Compliant•4 minutes
- Fetch Outro•1 minute
1 assignment•Total 15 minutes
- Assessment 1•15 minutes
In this module, we will incorporate Axios, a popular third-party library, into our project for making AJAX requests. We will start by installing and configuring Axios, then proceed to implement our CRUD operations using this library. By using Axios, we will simplify our code and improve data handling through its intuitive response objects, making our AJAX API more efficient and easier to work with.
What's included
12 videos
12 videos•Total 42 minutes
- Section Introduction•2 minutes
- Basic Challenge - Introduction to What We Are Going to Build with Axios•2 minutes
- Installing AXIOS•4 minutes
- Fetching Text Data with AXIOS•5 minutes
- Fetching JSON Data with AXIOS•5 minutes
- Setting Up Our Main Course Project Files for Axios•3 minutes
- GET Request Using Axios•8 minutes
- Inspecting the Axios Response Object•3 minutes
- POST Request Using Axios•4 minutes
- PUT Request Using Axios•2 minutes
- DELETE Request Using Axios•5 minutes
- Axios Outro•1 minute
In this module, we will bring together all the components of our course project. We will develop the final front-end using HTML, CSS, and JavaScript, creating a cohesive and functional user interface. By connecting this front-end with our back-end server through AJAX APIs, we will enable dynamic interactions and real-time updates, providing a seamless user experience. This final integration will showcase the culmination of our skills in building a full-stack web application.
What's included
26 videos1 assignment
26 videos•Total 154 minutes
- Introduction to Section•1 minute
- What Are We Going to Build?•3 minutes
- HTML - Navbar and Add Dog Button•6 minutes
- What Are HTML Entities•6 minutes
- HTML - Add Dog Modal•11 minutes
- HTML - Update Dog Modal•8 minutes
- We Don't Need the Name Attributes•2 minutes
- CSS - Headings and Buttons•9 minutes
- CSS - Add Dog Modal•9 minutes
- CSS - Update Dog Modal•6 minutes
- Using JavaScript to Close Our Modals•4 minutes
- CSS - Tables•6 minutes
- AJAX GET Request - Perform a GET Request on the DOMContentLoaded Event•4 minutes
- Using JavaScript to Add an Update and Delete Button to Our Table•5 minutes
- POST Request•10 minutes
- Clearing Form Data When a User Hits 'Submit'•6 minutes
- Take a Step Back•5 minutes
- Using the reset() Method to Clear Form Values•6 minutes
- Populating the Update Modal - Part 1 - Traversing the DOM to Find the ID•11 minutes
- Take a Step Back: Traversing the DOM•4 minutes
- Populating the Update Modal - Part 2 - Using the find() Method to GET Our Dog•4 minutes
- Populating the Update Modal - Part 3 - Finishing•7 minutes
- Improving Our Code - Disabled and classList Properties•5 minutes
- PUT Request - Updating a Dog•8 minutes
- DELETE Request - Removing a Dog•7 minutes
- Recap - You Have Come a Long Way•5 minutes
1 assignment•Total 15 minutes
- Assessment 2•15 minutes
In this concluding module, we will review the key concepts and skills we've acquired throughout the course. We'll reflect on how these can be applied to future projects and discuss potential improvements. Finally, we'll celebrate the completion of this comprehensive journey, recognizing the readiness to tackle new web development challenges with confidence and expertise.
What's included
1 video1 reading2 assignments
1 video•Total 1 minute
- Outro•1 minute
1 reading•Total 10 minutes
- Conclusion to the Course 'Advanced AJAX Techniques and Final Projects '•10 minutes
2 assignments•Total 75 minutes
- Full Course Assessment•60 minutes
- Full Course Practice Assessment•15 minutes
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Instructor
Explore more from Software Development
- Status: Free Trial
- P
Packt
Course
- Status: Free Trial
Specialization
Why people choose Coursera for their career
Frequently asked questions
Yes, you can preview the first video and view the syllabus before you enroll. You must purchase the course to access content not included in the preview.
If you decide to enroll in the course before the session start date, you will have access to all of the lecture videos and readings for the course. You’ll be able to submit assignments once the session starts.
Once you enroll and your session begins, you will have access to all videos and other resources, including reading items and the course discussion forum. You’ll be able to view and submit practice assessments, and complete required graded assignments to earn a grade and a Course Certificate.
More questions
Financial aid available,