Course Duration & COST

Course Duration

Course will be 8 Month working days duration with real-time projects and covers both teaching and practical sessions.

Course Fee

Course fee will be 45000

MERN Full Stack Development

Full Stack website development with MERN Stack course is your greatest resource for learning the MERN Stack. It will take you from complete novice to full-stack expert, enabling you to create your own spectacular, fully-featured site from scratch .

You know how to use React to make incredible front-end interfaces. But, their deployment calls for more. You require logic and a location to apply it. You can create robust and engaging full-stack applications by integrating your front-end UI with a back-end solution, cloud hosting, and other components.

TOPICS YOU WILL COVER

  • The MERN Stack – Theory
  • Diving Into the Frontend
  • Understanding the Backend
  • REST vs GraphQL
  • Connecting Node & React
  • MERN – Essentials
  • Creating Development Environment & the Development Servers
  • Planning the App
  • Understanding the General App Idea
  • Sketching out the Frontend
  • Data & API Endpoints used in our App
  • Required SPA Pages for the Frontend
  • React.js – A Refresher
  • What is React?
  • A Note About The NodeJS Version
  • React 18
  • Setting Up a Starting Project
  • Understanding JSX
  • Understanding Components
  • Working with Multiple Components
  • Using Props to pass Data between Components
  • Rendering Lists of Data
  • Handling Events
  • Efficient Child<=>Parent Communication
  • Working with “State”
  • More on State
  • Fetching User Input (Two-way Binding)
  • React.js Basics
  • React.js – Building the Frontend
  • Important: Use React Script v5
  • Starting Setup, Pages & Routes
  • Adding a UsersList Page / Component
  • Adding a UserItem Component
  • Styling our App & More Components
  • Presentational vs Stateful Components
  • Adding a Main Header
  • Adding Navlinks
  • Implementing a Basic Desktop & Mobile Navigation
  • Understanding Portals
  • Handling the Drawer State
  • Animating the Sidedrawer
  • Rendering User Places & Using Dynamic Route Segments
  • Getting Route Params
  • Adding Custom Buttons
  • Adding a Modal
  • Rendering a Map with Google Maps
  • Continuing without a Credit Card
  • Optional: More on the useEffect() Hook
  • Adding a Custom Form Input Component
  • Managing State in the Input Component
  • Adding Input Validation
  • Sharing Input Values & Adding Multiple Inputs
  • Managing Form-wide State
  • Finishing the “Add Place” Form
  • Starting Work on the “Update Place” Page
  • Adjusting the Input Component
  • Creating a Custom Form Hook (useForm)
  • Optional: More on (Custom) React Hooks
  • Adjusting the Form Hook
  • Fixing Minor Issues
  • Showing a Deletion Warning
  • Adding an “Auth” Page & Login Form
  • Adding Signup + “Switch Mode” Button
  • Adding Auth Context for App-wide State Management
  • Listening to Context Changes
  • Adding Authenticated & Unauthenticated Routes
  • Node.js & Express.js
  • What is Node.js?
  • Writing our First Node.js Code
  • Sending Requests & Responses
  • What is Express.js?
  • Adding Express.js
  • Understanding the Advantages of Express.js
  • How Code Execution Works
  • Node & Express Basics
  • Node.js & Express.js – Building our REST API
  • Setting up our Project
  • Implementing Basic Routing
  • Adding Place-Specific Routes
  • Getting a Place By User ID
  • Handling Errors
  • Adding our own Error Model
  • Adding Controllers
  • Adding a POST Route & Using Postman
  • Handling Errors for Unsupported Routes
  • Adding Patch Routes to Update Places
  • Deleting Places
  • Finalizing the “Get Places by User ID” Resource
  • Setting Up the User Routes (Signup, Login, Get Users)
  • Validating API Input (Request Bodies)
  • Validating Patch Requests & User Routes
  • Using Google’s Geocoding API to Convert an Address Into Coordinates
  • Working with MongoDB & Mongoose – A Refresher
  • What is MongoDB?
  • SQL vs NoSQL
  • Connecting React to a Database?
  • Setting Up MongoDB
  • Creating a Simple Backend & Connecting it to the Database
  • Creating a Document with MongoDB
  • Getting Data from the Database
  • Installing Mongoose
  • Understanding Models & Schemas
  • Creating a Product
  • Connecting to the Database & Saving the Product
  • Getting Products
  • Understanding the ObjectID
  • Connecting the Backend to the Database – MongoDB & Mongoose
  • Installing Mongoose & Connecting our Backend to MongoDB
  • Creating the Place Schema & Model
  • Creating & Storing Documents in the Database
  • Getting Places by the PlaceID
  • Getting Places by the UserID
  • Updating Places
  • Deleting Places
  • How Users & Places are Related
  • Creating the User Model
  • Using the User Model for Signup
  • Adding the User Login
  • Getting Users
  • Adding the Relation between Places & Users
  • Creating Places & Adding it to a User
  • Deleting Places & Removing it From the User
  • Getting Places – An Alternative
  • Connecting the React.js Frontend to the Backend
  • Initial Setup
  • Sending a POST Request to the Backend
  • Optional: The fetch() API
  • Handling CORS Errors
  • Getting Started with Error Handling
  • Proper Error Handling in the Frontend
  • Sending a Login Request
  • Getting Users with a GET Request
  • Creating a Custom Http Hook
  • Improving the Custom Http Hook
  • Using the Http Hook to GET Users
  • Adding Places (POST)
  • Loading Places by User Id
  • Updating Places
  • Deleting Places
  • Fixing NavLinks & “My Places”
  • Final Adjustments

Interested In Course?

LET’S GET STARTED

Launch Your Career with Intechno Software’s Training + Internship Program!
Get certified, gain hands-on experience, and work on real projects in Web Development, Python, Digital Marketing, React, MERN, and more!

Contact Email: hr@intechnosoftware.com

Contact Phone:+91-9950348952