Develop Fullstack Instagram Clone with MERN JWT & Bootstrap5
Description:
In this course you will learn to develop production ready fullstack application and get ready for your job.
Following are the topics you will learn in this course:
learn about React JS
learn about MongoDB and Mongoose
learn about NodeJS and ExpressJS
learn about Middleware in ExpressJS
learn about securing application using tokens - JWT (Json Web Token)
learn to design frontend using Bootstrap5
learn to design mobile responsive application
learn about state management using Redux
learn to upload and download images
learn about routing using React Router Dom
learn about different types of React Hooks
learn to handle user session and hide show menu items based on user session
learn to develop a production ready end to end application using MERN stack
Below are the topics that will be covered while developing the application:
Environment Setup & React Introduction
Installing VS Code Editor
VS Code Settings
Difference between Javascript and ReactJS
Creating the React Project
Running the React Application
Exploring the React Project Folder Structure
Understanding React JS Application lifecycle
Creating First React Component
Integrating Bootstrap with React Project
Designing Login Page Layout
Styling Left Image Section of Login Page
Styling Layout of Login Form
Using Bootstrap form for email and password
Input boxes styling
Styling Login Button
Adding and using Google fonts
Styling signup section in Login page
Styling the Signup white button
Making Login Page Responsive for Mobile-Part-1
Making Login Page Responsive for Mobile-Part-2
Making Login Page Responsive for Mobile-Part-3
Creating Signup Page React Component
Designing Signup Page for Mobile and Desktop view
Understanding Routing and Installing React Router Dom
Adding Router Routes and Route in App.js component
Navigating From Login to Signup and Vice Versa
NavBar Layout and Solving warning messages
Integrating Bootstrap NavBar
Adding logo to NavBar
Styling searchbox
Integrating FontAwesome icons
Styling the right icon section on NavBar
Creating PostOverview page and Added Routing