uCertify

Modern Full-Stack React Projects

Learn both front-end and back-end development with our modern full-stack react course.

(MERN.AJ1) / ISBN : 978-1-64459-612-8
Lessons
Lab
TestPrep
AI Tutor (Add-on)
Get A Free Trial

About This Course

Our Full-Stack React web development course polishes your web app development skills. From the fundamentals of JavaScript and React to backend development with Node.js and MongoDB, this course covers everything you need to know. With hands-on projects, you'll learn how to create dynamic, interactive websites and web apps that meet the demands of today's digital landscape. By the end of this course, you'll be well-prepared to launch your career as a full-stack developer.

Skills You’ll Get

  • Master full-stack development, combining front-end and back-end expertise 
  • Use React and frameworks to build responsive web apps 
  • Build robust backends with Node.js and MongoDB
  • Implement data management and retrieval using SQL and NoSQL databases 
  • Create user-friendly interfaces that deliver exceptional user experience 
  • Optimize website performance for speed and scalability
  • Secure apps against vulnerabilities and protect sensitive data 
  • Collaborate with teams and contribute to Agile development methodologies
  • Solve complex problems and find creative solution
Download Course Outline

1

Introduction

  • Who this course is for
  • What this course covers
  • To get the most out of this course
  • Conventions used
2

Preparing for Full-Stack Development

  • Motivation to become a full-stack developer
  • What is new in this release of Full-Stack React Projects?
  • Getting the most out of this course
  • Setting up the development environment
  • Summary
3

Getting to Know Node.js and MongoDB

  • Writing and running scripts with Node.js
  • Introducing Docker, a platform for containers
  • Introducing MongoDB, a document database
  • Accessing the MongoDB database via Node.js
  • Summary
4

Implementing a Backend Using Express, Mongoose ODM, and Jest

  • Designing a backend service
  • Creating database schemas using Mongoose
  • Developing and testing service functions
  • Providing a REST API using Express
  • Summary
5

Integrating a Frontend Using React and TanStack Query

  • Principles of React
  • Setting up a full-stack React project
  • Creating the user interface for our application
  • Integrating the backend service using TanStack Query
  • Summary
6

Deploying the Application with Docker and CI/CD

  • Creating Docker images
  • Deploying our full-stack application to the cloud
  • Configuring CI to automate testing
  • Configuring CD to automate the deployment
  • Summary
7

Adding Authentication with JWT

  • What is JWT?
  • Implementing login, signup, and authenticated routes in the backend using JWTs
  • Integrating login and signup in the frontend using React Router and JWT
  • Advanced token handling
  • Summary
8

Improving the Load Time Using Server-Side Rendering

  • Benchmarking the load time of our application
  • Rendering React components on the server
  • Server-side data fetching
  • Advanced server-side rendering
  • Summary
9

Making Sure Customers Find You with Search Engine Optimization

  • Optimizing an application for search engines
  • Improving social media embeds
  • Summary
10

Implementing End-to-End Tests Using Playwright

  • Setting up Playwright for end-to-end testing
  • Writing and running end-to-end tests
  • Reusable test setups using fixtures
  • Viewing test reports and running in CI
  • Summary
11

Aggregating and Visualizing Statistics Using MongoDB and Victory

  • Collecting and simulating events
  • Aggregating data with MongoDB
  • Implementing data aggregation in the backend
  • Integrating and visualizing data on the frontend using Victory
  • Summary
12

Building a Backend with a GraphQL API

  • What is GraphQL?
  • Implementing a GraphQL API in a backend
  • Implementing GraphQL authentication and mutations
  • Overview of advanced GraphQL concepts
  • Summary
13

Interfacing with GraphQL on the Frontend Using Apollo Client

  • Setting up Apollo Client and making our first query
  • Using variables in GraphQL queries
  • Using mutations on the frontend
  • Summary
14

Building an Event-Based Backend Using Express and Socket.IO

  • What are event-based applications?
  • Setting up Socket.IO
  • Creating a backend for a chat app using Socket.IO
  • Adding authentication by integrating JWT with Socket.IO
  • Summary
15

Creating a Frontend to Consume and Send Events

  • Integrating the Socket.IO client with React
  • Implementing chat functionality
  • Implementing chat commands with acknowledgments
  • Summary
16

Adding Persistence to Socket.IO Using MongoDB

  • Storing and replaying messages using MongoDB
  • Refactoring the app to be more extensible
  • Implementing commands to join and switch rooms
  • Summary
17

Getting Started with Next.js

  • What is Next.js?
  • Setting up Next.js
  • Introducing the App Router
  • Creating static components and pages
  • Summary
18

Introducing React Server Components

  • What are RSCs?
  • Adding a data layer to our Next.js app
  • Using RSCs to fetch data from the database
  • Using Server Actions to sign up, log in, and create new posts
  • Summary
19

Advanced Next.js Concepts and Optimizations

  • Defining API routes in Next.js
  • Caching in Next.js
  • SEO with Next.js
  • Optimized image and font loading in Next.js
  • Summary
20

Deploying a Next.js App

  • Deploying a Next.js app with Vercel
  • Creating a custom deployment setup for Next.js apps
  • Summary
21

Diving Deeper into Full-Stack Development

  • Overview of other full-stack frameworks
  • Overview of UI libraries
  • Overview of advanced state management solutions
  • Pointers on maintaining large-scale projects
  • Summary

1

Getting to Know Node.js and MongoDB

  • Executing a Node.js Script
  • Creating a Web Server
  • Creating a Collection, and Inserting and Listing Documents
2

Implementing a Backend Using Express, Mongoose ODM, and Jest

  • Creating a Schema Using Mongoose
  • Building a Basic Express Server
3

Integrating a Frontend Using React and TanStack Query

  • Creating a REST API with Node.js and Express
4

Deploying the Application with Docker and CI/CD

  • Creating an Image Upload Server
5

Adding Authentication with JWT

  • Building a Simple Login/Signup System
6

Improving the Load Time Using Server-Side Rendering

  • Benchmarking the Load Time of an Application
7

Making Sure Customers Find You with Search Engine Optimization

  • Implementing Open Graph Meta Tags
8

Implementing End-to-End Tests Using Playwright

  • Setting Up Playwright for End-to-End Testing
9

Aggregating and Visualizing Statistics Using MongoDB and Victory

  • Defining the Event Model and the Service Function to Track Events
  • Aggregating Data with MongoDB
10

Building a Backend with a GraphQL API

  • Building a Simple GraphQL Server with Node.js and Express
11

Interfacing with GraphQL on the Frontend Using Apollo Client

  • Using Mutations on the Frontend
12

Building an Event-Based Backend Using Express and Socket.IO

  • Building a Real-Time Chat Application Using Socket.IO
13

Creating a Frontend to Consume and Send Events

  • Styling a Real-Time Chat Application with Socket.IO
14

Adding Persistence to Socket.IO Using MongoDB

  • Storing and Replaying Messages Using MongoDB
15

Getting Started with Next.js

  • Setting Up Next.js
16

Introducing React Server Components

  • Using React Server Components
17

Advanced Next.js Concepts and Optimizations

  • Defining API Routes in Next.js

Any questions?
Check out the FAQs

Still have questions? Find out more about our full-stack web development with React course.

Contact Us Now

This Modern React Applications course is designed for anyone interested in learning full-stack web development. Whether you’re a beginner or have some programming experience, this course will develop your web app development skills.

You’ll learn a wide range of technologies, including: 

  • Front-end: React, JavaScript, HTML, CSS
  • Back-end: Node.js, Express.js, MongoDB 
  • Tools: Git, Docker, CI/CD pipelines

No prior experience with React is required. The full-stack react development course will start with the basics and gradually build up to more complex concepts.

Learning full-stack development can open up various career opportunities. This course can help you: 

  • Learn both backend and frontend development in one package 
  • Land a job 
  • Advance your career
  • Start your own business 

Build Modern Web Apps

  Acquire the skills to create web applications that captivate users, drive results, and gain new career opportunities.

$279.99

Buy Now

Related Courses

All Course