Full Stack Development with React and Express Js API

Name: Full Stack Development with React and Express Js API
Rating: 3.8 (62 reviews)

Step by Step Restful API development with Node JS, Express, Sequelize ORM, UUID, MySql, React JS and Bootstrap.

Created bySelvi Infotech pvt ltd

Last updated 5/2025

English

What you'll learn

Working with more demanded technology in the industry
REST API development from the scratch
Working with MySQL database with Node JS and Express
Will learn about the most popular Sequelize ORM
You will learn to work with React and Bootstrap as well

Course content

2 sections • 26 lectures • 3h 18m total length

Introduction2:01
Learn to build a full stack API with Express, connect to a Sequelize database, and secure credentials using environment files while implementing token-based login with hashed passwords.
Environment Setup3:00
Install Norges on your Windows machine, set up Visual Studio Code, and configure MySQL Workbench and Postman (or a REST client extension) to design and test the API.
Environment Setup0:21
Node JS Project Setup18:47
Set up a Node.js project with Express, install nodemon, body-parser, and cookie-parser, create index.js, and implement registration and login routes with express-validator.
Database Design8:45
Explore database design for a React and Express app by building a MySQL database named YouTube with a registration table and backend endpoints for registration and login.
Creating Controller for Registration5:50
Develop a registration controller to handle post requests and read the username and password from the request body. Validate input and return appropriate status codes and error messages.
Setting up Sequelize ORM12:28
Set up the Sequelize ORM by building a DB helper to configure and authenticate a MySQL connection, export the engine, test with a simple query, and prepare models integration.
Connecting Sequelize with Express9:42
Build a Sequelize-based registration model in Express, update the registration table with username, password, and salt, and add a create method to insert users.
Starting with Registration API9:05
Learn to implement a registration api by passing username and password from the controller, encrypting the password, invoking the model, and handling success and error responses.
Fixing Registration Route Issue4:34
Fix the registration route by exporting the router correctly, handling a post request with a JSON body (username and password), and confirming successful database insertion on port 8082.
Starting with Login API11:04
Create a login endpoint using a post route, validate username and password with Express Validator, hash and compare credentials, and handle login flow in the controller.
Continue with Login API10:36
validate the username and password against the database, encrypt the password, and generate a simple token (jwt) to return with a 200 response or a 401 unauthorized on failure.
Fixing Database Issue9:23
Fix a database issue by widening the password field and validating user data in an Express.js API. Learn table creation, registration and login endpoints, MVC structure, and token-based authentication.
Source Files0:01

Project Setup8:56
Create a fresh React app and explore the boilerplate in Visual Studio Code. Set up the front-end project with npm and create-react-app, run npm start, and inspect the project structure.
Route9:21
Learn to implement routing in a React app using a BrowserRouter, define routes for home, register, and log in, and wire components via links in a menu bar.
Register Form Design12:26
Develop a registration form in a React class-based component, manage username, email, password, and confirm password in state, wire onChange handlers, and prepare data submission to the Node.js API.
Register API Interaction6:28
Handle a register form submission by preventing the default action, validating passwords, and sending data to a backend with fetch or axios. Manage responses using then and catch.
Register API Continuation7:00
Set up a post request to the backend register endpoint on port 8082, send username and password in a JSON body with content-type application/json, and note the cross-origin issue.
Handling CORS Error6:02
Resolve the CORS error by configuring the backend to allow cross-origin requests, including handling preflight requests and enabling the frontend registration flow.
Login Form Design9:45
design a login page in a react app by adapting the registration form, using use state to manage username and password, and implementing handle submit and handle change.
Login API Integration with Fetch8:51
Learn to implement login API integration in a React app by sending username and password with fetch, posting JSON data to the backend, handling responses, and managing errors.
Login API Integration with Axios3:53
Learn to use axios to send a login post request in a react app, including installation, import, sending username and password, and handling response data and headers.
Bootstrap - Login Page Design12:17
Incorporate Bootstrap into a full stack app to design a login page and responsive navbar, using form controls, container layout, and navbar collapse for mobile.
Bootstrap - Registration Page Design7:32
Designs a Bootstrap registration page using a responsive two-column grid, with a left form and a right image, leveraging container, row, and column classes.
Final Source Code0:26

Requirements

Installed Node JS and a editor of your choice

Description

Are you about to start with Node JS API development? then, you have landed in the right place. This course is designed for those who are starting with Restful API development using Node and Express. We expect you to have some basic knowledge of Node and JavaScript.

We are going to develop an application that takes care of user registration and login functionality. The code that we are going to develop is ended to end working code. The course is designed to start from absolute scratch and whatever the error we are facing while developing, those error gets explained and fixed properly. I expect you to raise queries you’re getting or the issue you're facing while setting up the development environment or any other related to the course. Whatever may the queries, don't ever hesitate to ask. I'm here to help you guys get comfortable with Node and React JS.

At the end of the course, you will have a good base knowledge of setting up the Node JS application from absolute scratch, you will come to know to create tables, secure the database credentials, Salt generation and also you will also come to know the standards of making the user registration functionality and login functionality. We are going to use Sequelize ORM to connect to the MySQL database.

That's it from my side hope you enjoy the course. Let's meet in the course.

Prerequisites

Expected to have basic knowledge of JavaScript

Expected to have Node js and an editor of your choice installed on your machine.

Who this course is for:

This course is for the beginner who started with Node JS REST API development using Express
Developers who wanted to have basic knowledge of Sequelize ORM, React, Bootstrap. Node and Express

Full Stack Development with React and Express Js API

What you'll learn

Explore related topics

Course content

Backend API Development14 lectures • 1hr 46min

React Frontend12 lectures • 1hr 33min

Requirements

Description

Who this course is for: