Lets Start Your MERN stack Journey
Tags: javascript, react, github, api
Published: 2024-02-06 11:10:04

I am Swapnanil Roy , a MERN stack developer . I have learned many concepts on 
1)JavaScript, 
2)React.js, 
3)redux, react-redux, redux-toolkit, 
4)Node.js
5)Express.Js
6)MongoDb shell
7)Mongoose
8)REST APIs 
9)CRUD operation through Axios react
10)Creating APIs through Express and Mongoose and deploying 
that API on Heroku, Render, Railway, Neetlify, Vercel etc.....**
![Start Programming with Enthusiasm](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ai4itup8j9jr3s4277k6.png)
![Become A complete MERN stack developer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vaop055o12lrx2l4x11q.png)**

A) **_JAVASCRIPT _**: 
![Javascript](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uc4p7fyei5kkih8ou9wb.png)
Now the first step of becoming a full stack developer is going to start with learning javascript . When ever you are going to learn Node.js, Express.js these kind of backend frame work or either any front-end framework like React.js , TypeScript, redux, React-Redux, Redux-toolkit , Material-UI , Angular.js etc or Data base by Express.js all these are popular frameworks or libraries of Javascript. So before diving into front-end or back-end or database you need to have a firm grip on jaavscript concepts. You have to go through all the essential topics of Javascript practice them very well in multiple ways and then move to the next topic. In this way you will develop confidence on your skill and then you are ready to pick your front-end frame work which is obviously based on javascript . So I will share here only which topics of javascript you need to learn before moving on to any framework =>

1) Arrays in Javascript.
2) forEach , for in , for of loop.
3) '===' operator in JS.
4) Objects .
5) Array of Objects.
6) Map() , filter(), reduce() methods in JS.
7) Execution context and Execution stack.
8) Variable hoisting and function hoisting.
9)scope chain and lexical scoping.
10) functional program / first class program.
11) Call back function.
12) Higher Order function .
13) IIFE(Immediately Invoked Function Expression)
14) call(), bind(), apply()
15) Object Destructuring.
16) REST operator
17) Spread Operator
18) Math Object
19) Classes , Objects, inheritance .
20) synchronous vs asynchronous .
21) Fetch APIs.
22) aysnc-await
23) try-catch
24) Error handling

B) **_React.js_** : 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/leo4p4gfw9omcehsmp9c.png)

React.js is front-end library of javascript and it is basically used for UI . In react the important topics you need to learn is =>
1) State with functional and class component .
2) Props with functional and class component .
3) Form handling.
4) Condotional rendering.
5) Pass function as props.
6) life cycle methods like => constructor, render, conponentDidMount.
7) Hooks => useEffect(), useState(), useContext(), useRef(), useReducer(), useCallback(), useMemo(), customHooks()
8) Array with map function 
9) Nested Map() function.
10) Reuse() component
11) Fragment in React.
12) Higher-Order component.
13) Reatc-RouterV6 : links, navbar, anchor-tags
14) Dynamic Routes and params
15) useNavigateHook, useLocation, React fetch API 
16) React POST, PATCH, PUT, DLETE method.
17) React Axios Library


C) **_React-redux, Redux, Redux-toolkit_** :


![Redux](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pgmhs3o5vdycrb9ffbn5.png)

1) Structuring Reducers
2) Spliting Reducer Logic
3) Refactoring Reducer
4) Using combined reducers
5) Normalizing state shape
6) Updating Normalized Data
7) Reusing Reducer Logic 
8) Immutable update patterns
9) Initializing State
10) Reducing Boilerplate
11) Deriving Data with selectors
12) Writing Logic with Thunks
13) Writing Custom Middleware
14) bindActionCreators
15)compose
16) Async logic and Data Fetching
17) Performance and Normalizing
18) RTK query basics and Advanced patterns.
19) state, action, reducers and store.


D) **_Node.js _**:

![Node.js](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y3opu0wbtdbu28ew4z0k.png)

1)Introduction
2)Enviourment setup
3)REPL Terminal
4)Node.js Modules
5) Node.js HTTP Modules
6) File system
7) URL Modules
8) OS Modules
9) NPM (Node Package Manager)
10) Upload Files
11) Node.js Emails
12) Events
13) Events Loop
14) Event Emitter

E) MongoDB with Mongoose : =>
![MongoDB and Mongoose](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rwr714clna78jhcepnb0.png)

1) Collections
2) Documents
3) find single document
4) Find multiple document
5) Create or Insert Single Document
6) Create or insert Multiple Document
7) Find single document 
8) Find multiple document
9) Update single document
10) Update multiple Document
11) Delete single / multiple document
12) queries => find() , where()
13) operators => $and , $or , $not, $gt, $lt, $gte, $lte, $nin, $in, $all
14) aggregation
15) Relation
16) populate
17) validate
18) Schema and Moldels
19) Docuemnt 
20) subdocument
21) Queries : 
Model.deleteMany()
Model.deleteOne()
Model.find()
Model.findById()
Model.findByIdAndDelete()
Model.findByIdAndRemove()
Model.findByIdAndUpdate()
Model.findOne()
Model.findOneAndDelete()
Model.findOneAndReplace()
Model.findOneAndUpdate()
Model.replaceOne()
Model.updateMany()
Model.updateOne()