ERROR MAKES CLEVER

MERN STACK WEB

DEVELOPMENT CURRICULAM
ERRORMAKESCLEVER

CONTENT
MODULE 1

HTML, CSS AND Tailwind CSS From Level 0

Build a Static Version of EMC Like Website
Interview Preparation Module 1 (HTML + CSS + Tailwind CSS)
Mini Project

MODULE 2

JavaScript
Making The Website Dynamic Using JavaScript
Interview Preparation Module 2 (JavaScript)
Mini Project

MODULE 3
ReactJS
Redux
Deployment
Interview Questions (ReactJS)
Mini Project

MODULE 4
NodeJS
ExpressJS
MongoDB
Building Website Using NodeJS, ExpressJs
Make Database For a Website Using Mongodb
Interview Preparation (Nodejs, Express js, MongoDB)
Mini Project
ERRORMAKESCLEVER

PROJECTS
PROJECT 1

How to create a portfolio using Html CSS

PROJECT 2

How to create a Reestar Restaurant project

using Html CSS

PROJECT 3

Perfume Project Using HTML and CSS for

Perfume Details and More

PROJECT 4

Udemy Clone using Html CSS and Tailwind CSS

Responsive Design

PROJECT 5

How to Create To-Do List for Your Daily

Activities

PROJECT 6
Tripe Adviser: Creating a Stylish Web
Interface with HTML, CSS, and Tailwind CSS
ERRORMAKESCLEVER

PROJECTS
PROJECT 7

Nostra E-Commerce Project Sale your Own

Products

PROJECT 8

Greenden Plants for your Interior Full

Responsive Designs

PROJECT 9

Create a login and signup functionality for a

React-based Actodo project.

PROJECT 10

Develop a weather application using

React and the Axios API.

PROJECT 11

A bulk mail application utilizing Nodemailer,

React, Node.js, MongoDB, and Express.

PROJECT 12

Create a Random Joke Generator utilizing

API, implemented with React, Redux Node.js,
Express, and styled with Tailwind CSS
ERRORMAKESCLEVER

Final Project Task

amazon like E-commerce

1. Secure Authentication: Firebase ensures safe

logins.
2. Robust Backend: MongoDB for efficient data
handling.
3. Admin Privileges: Add products easily.
4. User-Friendly: Effortlessly browse and buy.
5. Efficient Checkout: Razorpay integration for
smooth payments.
6. Dummy Razor API: Test transactions worry-free.

Join us for a top-notch shopping journey!

 ERRORMAKESCLEVER

Unlock Your Potential with Our Internship Opportunity

Upon successfully completing all assigned projects, students who stand

out in terms of performance will be eligible for a one-month internship,
complete with a stipend. This opportunity not only allows you to apply
what you've learned in a real-world setting but also emphasizes the
importance of timely project completion as a criterion for selection.

Completion of Projects: You must successfully complete all given

projects within the specified deadlines to qualify for the internship
opportunity.

Selection for Internship: Selection is based on your performance in the

course and the projects. It’s your chance to shine and show us what
you’ve got!

Internship Duration and Stipend: The internship lasts for one month.
It’s a paid opportunity, allowing you to earn while you learn and apply
your skills.

Job Placement Assistance: Post-internship, based on your performance

during the interview process, we will offer assistance with job
placements, leveraging our network to help you kickstart your career in
the IT industry.

Exclusive Community Access: Interns will gain access to a separate

community, creating a space for networking, collaboration, and shared
learning among peers and mentors.
ERRORMAKESCLEVER

HTML

Section 2: Let’s Dive into HTML

2.1. HTML Introduction

2.2. HTML in Action - Learning Basic tags

2.3. Building a simple portfolio website using only HTML

2.4. Browser Developer Tools

2.5. HTML Boilerplate

Section 3: HTML Forms and Tables

3.1. HTML Forms

3.2. HTML Tables

3.3. HTML Tables + Forms

3.4. Create a Contact form for my Portfolio Page

3.5. How to link Multiple HTML Pages?

3.6. Things you should know

ERRORMAKESCLEVER

CSS

Section 4: Introduction to CSS

4.1. What is CSS and its type?

4.2. CSS Basic Styles

4.3. CSS Selectors

4.4. CSS Box Model Explained

4.5. Display Property of CSS is everything you need

4.6. CSS hover Property

4.7. Creating a CSS Card Component

4.8. BEM Explained

4.9. The concept of Specificity

ERRORMAKESCLEVER

CSS Portfolio

Section 5: Upgrading Portfolio Website

5.1. Adding basic Styles

5.2. Working with Display Property

5.3. Styling Contact Page

5.4. Launch your first website on GitHub.

5.5. Reestar Project Task

ERRORMAKESCLEVER

CSS FlexBox

Section 6: Master Flexbox with a Project

6.1. Udemy Project Introduction

6.2. Introduction to Complete Flexbox with Exercise

6.3. Building Categories Section - Udemy

6.4. Sale Image Section - Udemy

6.5. Course Card - Udemy

6.6. Flex-grow and Flex-basis Explained.

6.7. Wrapping up Udemy Project

6.8. Time to Practice Flex

ERRORMAKESCLEVER

CSS & Git

Section 7: Git and GitHub - Introduction

7.1. What is Git and GitHub?

7.2. Setup your Git Environment

7.3. GitHub Push and Pull Demo

7.4. Let’s Push Udemy Project from the Terminal

Section 8: CSS Positioning with Examples

8.1. What is CSS Position

8.2. What are 5 Different Positions?

8.3. Create Components Using CSS Position

8.4. What is z-index?

8.5. Update Udemy Project and Git it.

ERRORMAKESCLEVER

CSS Animations & Media Queries

Section 9: CSS Animations - Learn Basics

9.1. What is CSS Animation

9.2. Opacity vs rgba

9.3. Transition Property

9.4. Advance Animation using Keyframes.

9.5 Animation in Practice.

9.6. Update Udemy Project and Git it.

Section 10: Responsive Websites Makes You Pro

10.1. What is a Responsive Website?

10.2. Introduction to Media Queries

10.3. Practice Questions on Responsive Design

10.4. Upgrading Udemy Project using MQ

ERRORMAKESCLEVER

Tailwind CSS

Section 11: Time to CSS all by yourself

11.1. You are going to create a TripAdvisor Clone

Section 12: Tailwind for Fast Development

12.1. What is Tailwind CSS?

12.2. Bootstrap vs Tailwind CSS

12.3. Introduction to Greenden Project

12.4. Building Responsive Navbar

12.5. Header Section

12.6. About Section

12.7. How grid differs from flex?

12.8. Building Best Seller Section Using Grid

12.9. Let’s Wrap it up with Reviews, Newsletter and Footer

12.10. Product Page Task

12.11 How you can easily Take Template from Internet

12.12 Time to Git it

ERRORMAKESCLEVER

Javascript

Section 13: JavaScript: It's time to code.

13.1. Why JavaScript?

13.2. What are Variables?

13.3. What ES6 means?

13.4. JavaScript Primitives

13.5. JavaScript Operators

13.6. Ternary Operators

13.7. Let’s Practice Basic JavaScript

ERRORMAKESCLEVER

JavaScript

Section 14: JavaScript: If-Else and Functions

14.1 If-Else in JavaScript

14.2 If-Else Practice Questions

14.3 What are functions in JavaScript?

14.4 Parameters Explained

14.5 Return Keyword in JavaScript

14.6 Function Practice Questions

Section 15: JavaScript: Guess the Number Game

15.1. How to generate a random Number?

15.2. Let’s create a Game.

Section 16: JavaScript: Loop is powerful.

16.1. Loops Explained!

16.2. Exercise Questions.

ERRORMAKESCLEVER

JavaScript

Section 17: JavaScript: Arrays

17.1. What is Array?

17.2. Push and Pop

17.3. Slice and Splice

17.4. indexOf, includes, Length.

17.5. const & Arrays

17.6. Combining Arrays with loop

17.7. Arrays Practice Question

Section 18: JavaScript: Object Literals

18.1. Introduction to Object Literals

18.2. Arrays + Objects

ERRORMAKESCLEVER

JavaScript DOM

Section 19: JavaScript: DOM Introduction

19.1. What is JavaScript DOM?

19.2. Selecting and Manipulating DOM using ID

19.3. Selecting and Manipulating DOM using querySelector

19.4. textContent vs InnerHTML

19.5. Exercise Questions with Id and querySelector

19.6. use of setAttribute?

19.7. How to Manipulate CSS?

ERRORMAKESCLEVER

JavaScript DOM

Section 20: All about Events

20.1 What are Events & Even handlers?

20.2. Event Object

20.3. Add 2 Numbers and Print Result

20.4. Exercise with Input Tag

20.5. Guess the Random Number 2.0

20.6. What are event Listeners with Example?

20.7. Create a PopUp Box on a Button Click - 1

20.8. Create a PopUp Box on a Button Click - 2

ERRORMAKESCLEVER

JavaScript DOM

Section 21: Let’s Create a TO-DO List

21.1. How to create a HTML Element?

21.2. Append vs Prepend.

21.3. How to Delete an Element

21.4. Let’s Create a TO-DO List from Scratch

21.5. Task for the Session

Section 22: Working with Forms

22.1. How to select value from Radio Buttons

22.2. How to select value from CheckBox

22.3. What is Regex and its Example

22.4 Form Validation

ERRORMAKESCLEVER

JavaScript DOM

Section 23: Upgrading Greenden Project with JS

23.1 Creating a Responsive Side Navbar
23.2. Search Functionality in Product Page
23.3. Deploy into GitHub
Section 24: E-commerce Task (HTML+CSS+JS)
24.1. Create an E-commerce Website called Nostra.
Section 25: ES6 in detail
25.1. Arrow Function
25.2. Template Literals
25.3. Destructuring Assignment
25.4. Spread and Rest Operator
25.5. Default Parameter
25.6. Classes
25.7. Callback
25.8. Promises
25.9. Async /Await
Section 26: JavaScript Array Methods
26.1. ForEach Method
26.2. Let’s Filter
26.3. Map is powerful
ERRORMAKESCLEVER

React JS

Section 27: This is what everyone is talking about - React JS

27.1. What and why is React?

27.2. Let’s Practice React - codesandbox

27.3. How to run React Application from VS Code

27.4. How to add Styles?

27.5. What are React Components?

27.6. Recreate Perfumy Project Using React.

27.7. Import and Export Components.

27.8. Upgrade Perfumy React

27.9. What are Fragments?

27.10. Push React Apps to Git

27.11. Using vercel to Deploy

27.12. Convert Udemy css Project to Udemy-react

ERRORMAKESCLEVER

React JS

Section 28: Props and Map

28.1. What are props?

28.2. Separation of Components

28.3. Statement vs Expression

28.4 How to Work with Maps

Section 29: Exercise Question: React Components,

Props & Map

29.1. Image Gallery Exercise.

Section 30: useState Explained.

30.1. What is state?

30.2. How to create a State

30.3. Counter App with State

30.4. State Exercise

ERRORMAKESCLEVER

React JS

Section 31: Form Controls

31.1. Controlled Components

31.2. Multiple Inputs

31.3. Multiple Inputs 2.0

31.4. Creating a Shopping List

Section 32: Conditional Rendering

32.1. Change Color on a Button Click

32.2. Check & Uncheck List

32.3. Before vs After Login

Section 33: Let’s Create a To-Do List

33.1. Complete To-Do List Tutorial

ERRORMAKESCLEVER

React JS

Section 33: Let’s Create a To-Do List

33.1. Complete To-Do List Tutorial

Section 34: Things you should know

34.1. React component Life Cycle

34.2. React Hooks and its Types.

34.3. UseEffects Hook Explained

34.4. List and key

Section 35: Actodo Project - Part 1

35.1. Actodo Project Overview

35.2. How to Integrate Tailwind with React

35.3. Project Folder Structure

35.4. Creating a Header Component

35.5. Creating a Card Component

35.6. Building TodoList

35.7. Adding TodoList Functionality

35.8. Building AddTodoForm

ERRORMAKESCLEVER

React JS

Section 36: React Router

36.1 React router Explained.

36.2. Link Tag in React Router

36.3. Create Login and Signup Page

36.4. Add Login Functionality

36.5. Add User via Sign Up

36.6. Fixing Login Logical Error

36.7. How to Navigate?

Section 37: Finishing up Actodo Project

37.1 Merge Router+Actodo Todo List

37.1 Let’s Deploy

Section 38: useContext Hook Explained

38.1. Why useContext?

38.2. Create your own context.

38.3. Add list with UseContext

ERRORMAKESCLEVER

React Router & Api & Node Js

Section 39: Task (Router + Context)

39.1 Favourite Student List Task

Section 40: Weather App using API

40.1. What is API?

40.2. What are Promises?

40.3. How to work with Axios?

40.4. Working with Weather API

40.5. React Weather App

Section 41: Backend Begins

41.1. Server vs Client

41.2. How to create your own server

41.3. Let’s Create an API

41.4. Practice Session

ERRORMAKESCLEVER

Api & Node & Database

Section 42: Integrate Backend and Frontend

42.1. Let’s Connect Backend with html.

42.2. What is Get and POST Method?

42.3. Simple Login Practice.

42.4. How to receive data from Post?

Section 43: Integrate React with Node

43.1. Create Login Functionality in React

43.2. What is Middleware?

43.3. Send and receive data from React and Node

43.4. Axios Post Method

Section 44: React + Node Exercise

44.1. Recreate Todo List with React + Node.

Section 45: Let’s Learn about Database

46.1. What is Database?

46.2. Relational vs non-relational

ERRORMAKESCLEVER

MongoDb

Section 46: MongoDB

46.1. What and why is MongoDB

46.2. Installation and Setup

46.3. MongoDB CRUD

46.4. MongoDB CRUD Exercise

Section 47: Integrate MongoDB with Node

47.1. How to use Mongoose?

47.2. Creating Todo with React + Node.

47.3. Connecting Todo with MongoDB

ERRORMAKESCLEVER

MERN

Section 48: Creating BulkMail App (MERN APP)

48.1. BulkMail App Overview

48.2. How to Send an Email from node?

48.3. How to read a file?

48.4. Building UI for BulkMail

48.5. Merge Frontend with Backend

48.6. Adding Bulk Mailing Feature

48.7. Fixing a Problem

48.8. Connecting to MongoDB

48.9. MongoDB Cloud

48.10 How to Deploy?

Section 49: Redux Tutorial

49.1. What and why is Redux?

49.2. Redux Short Tutorial

49.3. Redux Slicer Explained

49.4. Redux Mini Project

ERRORMAKESCLEVER

Interview Prep

Bonus Session

Effective way to Build Resume

Proven Pathway for Job Search
Building Linkedin
Optimizing your profile on
platforms like Naukri
Different Platforms where you can
apply and search for a Job
HR Interview Question and Answer
Preparation
Mock Interviews
Technical Interview Questions
Opportuinty to attend Direct
Interview with our Partner
Companies
ERRORMAKESCLEVER

Additional Benefits

Furthermore, as part of
the additional advantages
we offer, you'll have the
opportunity to participate
in meetings featuring
esteemed guests,
including renowned HR
professionals, tech
experts, and even
successful entrepreneurs.
ERRORMAKESCLEVER

FAQS

How will the classes be structured for consistent

learning?

On weekdays, you'll access exclusive recorded

videos for learning, with 24/7 support available
throughout the training. Additionally, you'll have
a dedicated mentor assigned to you, and every
weekend, there will be live classes and special
events.

What if I miss the live classes?

If you miss any of the live classes, you'll have

access to recordings of those sessions.
ERRORMAKESCLEVER

FAQS

Is job placement guaranteed?

We do not guarantee job placements, but we do

guarantee that the skills you acquire through this
course will significantly enhance your chances of
securing a job on your own. We have a track
record of our students getting placed in good
position
can I opt for EMI payments?
No, We are expecting full Payment. Which will
ensure a smooth learning process for you and as
well us for us
ERRORMAKESCLEVER

Why Choose Us ?

Extensive Reach: Join a community of

over 5,80,000 trusted followers on
Instagram and engage with over
4,00,000 subscribers on YouTube. Our
wide reach reflects our commitment to
quality training and the satisfaction of
our learners.

Inclusive Learning: Our mission is to provide

corporate training of the highest quality at an
affordable cost, making learning accessible to
everyone. We believe in learning by doing,
offering hands-on tasks to reinforce your
knowledge and skills.

Flexibility: You can Learn Programming at any

time. ensuring accessibility and convenience for
all learners. Choose the mode that suits your
preferences and schedule.
ERRORMAKESCLEVER

Pricing

LIMITED SEATS ONLY

you can get into the

program only if you
pass the certain
criteria

For enrollment and

further inquiries,
please contact us at

+91 8270496560

errormakesclever@gmail.com