0% found this document useful (0 votes)
35 views14 pages

MERN Premium Brochure

Uploaded by

Nivedha S
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
35 views14 pages

MERN Premium Brochure

Uploaded by

Nivedha S
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 14

REVAMP ACADEMY

MERN STACK
(MONGO,EXPRESS,REACT,NODE)

The MERN stack is a popular choice for


full-stack development due to its ease of
use and efficiency. All components of
the stack are JavaScript-based,
allowing for a unified programming
environment.

Contact
SUGANTH PV
Welcome to

REVAMP ACADEMY!

🎓 Why Choose Revamp Academy?


✨ Comprehensive Curriculum
🚀 Hands-On Learning
👨‍🏫 Experienced Instructors
💼 Career Opportunities
🌟 Supportive Community
🌐 24/7 Support
💲 Affordable Fee Structures
📅 Live Sessions with Comfortable Timings
📽️ Recordings of Live Sessions
🚀 Lifetime Mentorship
🌐 Internship Opportunities
Whether you're a beginner or have prior experience,
our course will equip you with the knowledge and
practical skills needed to excel in the world of
STACK development.
MERN STACK

MERN stack is a powerful and versatile technology


stack that empowers developers to create modern,
efficient, and feature-rich web applications. It is an
excellent choice for those looking to advance their
career in web development or to embark on
entrepreneurial endeavors in the tech industry.

Benefits of Learning MERN Stack

MERN covers both the front-end (React)


and back-end (Node.js and Express),
allowing you to become a full-stack
developer capable of building end-to-end
web applications.
React's component-based architecture
makes it easy to build highly interactive
and visually appealing user interfaces.
Opportunities for Placement and
Internships
Strong job opportunities in a rapidly
evolving tech landscape
Enabling the creation of dynamic and
responsive web applications with efficient
development processes, scalable
architecture, real-time functionality
Version Control System

Basics of Git and Github


VCS & Git Repositories
Staging Area & Commits
Working with Branches
Push & Pull Requests

Static Website Design

HTML
HTML Elements
HTML Headings
HTML Paragraphs
HTML Button
HTML Attributes
HTML Images
HTML Hyperlinks
HTML Containers
HTML Lists

CSS
CSS Rulesets , CSS Properties
CSS Colors , CSS Units
CSS Box Model
CSS Margins
CSS Paddings
CSS Borders
Intermediate CSS
Block vs inline element
CSS Selectors
CSS Specificity
CSS Inheritance
CSS Cascading
Project : Basic Website by using HTML5,
CSS3 Like Blog Website

Responsive Web Design

Tailwind CSS

CSS Layout
CSS Flex box
Sizing Elements , Over flow
Box Sizing
Content Box
Border Box

CSS Media Queries


What is Media Query & Media Types
Media Features
Width, min-width, max-width
Height, min-height, max-height
Multiple Media Features in a single Media Query
Logical Operators (and)
Logical Operators (not)
Logical Operators (,)

CSS Framework : Tailwind


Tailwind Grid System
Tailwind Utilities

Project : Full Website with Tailwind Like


Food Store Website
Dynamic Web Applications

JavaScript

Introduction to JavaScript
Data Types
Variables
Basic Operators
Conditionals
Loops
Functions
Arrays
Objects
Control Flow
Comments
Math Functions

DOM Manipulation
Introduction to the DOM and Defining the DOM
Select and Manipulate
Important Selector Methods
Manipulating Style
Manipulating Text and Content
Manipulating Attributes
Local Storage

Rest parameters and spread syntax


Destructuring Arrays
Destructuring Objects

Asynchronous JavaScript
Async/Await
Promises
How to Make API Calls Using Fetch Method

Scope & Hoisting in JavaScript


Important Conpect For Interviews
Array Methods
map
filter
reduce

String Manipulations
trim & split Methods
toUpperCase & toLowerCase Methods,
includes Method

Forms
The form element
The label element
The input element
The option element
The option group element
The button element
The select element
The textarea element
Form validations and Input validations with
Regex

Front End Framework

React.js

Basic of React
Why React
What is Virtual DOM
What is React reconciliation

Bundlers & Packages: NPM, Parcel, Vite


what are Bunders
what is npm Packages
Config Vite Bunder
What is JSX & Props in React
What is JSX
What is JSX Expression
How Convert HTML to JSX
How Passing a prop to a component
How to Destruct Props on Fly
Conditional Rendering
React Fragments

Component in React and Working with Lists


Types of Component
How to Work with Lists
What is Component Composition
2 types of Import & Export: named & multiple

Hooks in React useState()


How and Why to Work with Hooks
what is state
What is useState and why it used
Optional Chaining
Config Driven UI, Data layer, UI layer

What is Micro Service, useEffect() with Axios


What is Micro Service
How useEffect is used and Called on initial
Render
what is depentency array and Call Back
Function
Virtual DOM
Reconciliation Algorithm
Diff Algorithm
What is React Fiber
React Fiber Architecture

React Optimization
How to Create Custom Hooks
Lazy Load
Shimmer UI
React Router Dom V6 Related
React Router.
React-router-dom
useRouteError Hook
How to Create Nested Children Routes
Outlet Component.
Link Component
More about SPA's
UseParams Hook
useError Hook
Dynamic Routing
2 types of Routing : Client Side Routing & Server-side Routing.
How to Create Protected Routes

Way to Style and create Responsive Component


Styled Component ,
Ant Design and How to Step up Ant design
Emotion
State Management

React Context API


What is Prop Drill
What is HOC
Advanced Context for Production
Using Custom Hooks
Using Separate File Structure for Context
Hooks with Local Storage
Hooks with React Router
Data fetching using Hooks

Authentication & Authorization

Extra:
Class Based Component
Component Life Cycle
Formik with Yup for Forms

Project : Swiggy Clone or GYM Clone


Back End

Node and Express with Mongodb

Node Basics
Introduction to Node.js
First Node Program
The Global Object
Modules and modularity
Introduction to Node moduls
OS Module
Path Module
FS Module with Files
FS Module with Directories
How to Create First Http Server
Node Package Manager(NPM)
How to Install and use an NPM Package
All about .gitignore
Semantic versioning
Publish Your Own NPM Package

Getting Started with Express


Express Installation
what Express & How to use Express
Nodemon
Environment variables and PORT
Route Parameters
Handling Multiple Routes
Postman
HTTP GET method
HTTP Post method
Http Put Method
Http Delete Method
Express Router , Controller , Service
How MVC architecture Works
How to Create Route
How to Export Router
What is Controller
How to Connect Router to Controller
Now how to Connect Controller and
Service
Why Service and How Business Logic are
Written
Finally Connect MongoDB [ Moogose ] ORM
and Service

Express Curd with Postman


what is MongoDB and Setup MongoDB Atlas
How to Create a Cluster and Take the URL
What is Different B/w MongoDB Driver and
Mongoose
How the Data are Stored in Form of JSON [
BSON ] Format
How to Work with Schemas & Models ,
Instances , Queries
How to Connect to Mongodb using Mongoose
without MongoDB Driver
How to Create a Schema
How to Save Data Though Mongoose
How to Fetch All Data and Single Data [ GET ]
How to Update a Data [ UPDATE ]
How to Delete a Data [ DELETE ]
How to Add a Data [ POST ]

Mongoose with Express AND .env Setup


How to Using .env and Why .env in Node
How ADD Mongodb Cluster Endpoint in .env
How to use .env in node [ like to import ]
How to Integrate Back End With React Front End
How to Create Base API ENDPOINTS
How to Connect Backend and Frontend with
the API
How Test the API ENDPOINT IN POSTMAN

Extra
ORM : Prisma
Authentication & Authorization Using JWT
and Bcrypt
Express with Typescript
What is Typescript and What are Way to
declare a Types in Typescript in Express
How to Optimize your API Endpoints for
Production
How to Use Redis For Caching and Kafka in
Production Environment
Test Backend API with Jest
Swagger UI For Docs your API

Deployment

Basic Deployment
Front End : Vercel
Back End : Railway or Render
Database : Neon or Super base or MongoDB

Real Production Deployment


Docker Based Deployment
How to Deploy in AWS
AWS Services : S3 for Image Optimization and
Storage
CI/CD PIPELINE WITH AWS
Project : E-Commerce Website CRUD API

Final Project

💡 Project : Tourism Website [ 4 Pages Site ]


💡 Project : Responsive Portfolio Website
💡 Project : Wikipedia Search Application or Assignment
💡 Project : E-commerce Website
💡 Project : Modern Design Website
💡 Project : Theme Website With Dashboard
Learning Management System
Product Based Website
Product Selling Website
Join US ! Revamp your Career

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy