DEV Community

Foyzul Karim
Foyzul Karim

Posted on • Updated on

Learn MERN in Bangla like a pro

This is the high level plan for my upcoming udemy free youtube course.

YouTube playlist

Google slide

Facebook

Postman link

Learn MERN GitHub

Individual lectures

Lecture 1 : Introduction of this course

JavaScript refresher

Lecture 2 : Programming language

Lecture 3 : History of JavaScript and why should we care

Lecture 4 : Working with JavaScript

Lecture 5 : What are Data Types and How can we use JavaScript types

Lecture 6 : JavaScript Object Notation (JSON)

Lecture 7 : JavaScript Loops

Lecture 8 : Functions (Declaration and execution)

Lecture 9 : Functions (Scopes and Parameters)

Lecture 10 : Array and Array functions

Lecture 11 : JavaScript this

Lecture 12 : Thread, process and operating system

Lecture 13 : Callback, sync, async and Promise

Lecture 14 : asynchronous execution walkthrough with settimeout()

Lecture 15 : sync execution in online editor stackblitz

Lecture 16 : sync execution in visual studio code and browser

Lecture 17: async code execution walkthrough in visual studio code

Lecture 18 : async promise code walkthrough in visual studio code

Lecture 19 : Promise resolve reject then states hands on practices

Lecture 20 : async await promise and executing from top level code

Lecture 21 : async for await promise all and return from then

Lecture 22 : Practice 01 - input via prompt and sum using reduce()

Lecture 23 : Practice 02 - working with JSON array and assignment

Node.js

Lecture 24 Node-01: Why we needed nodejs and how it solved problems

Lecture 25 Node 02 : Basic components of nodejs runtime

Lecture 26 Node 03 : Diving into rabbit hole for setTimeOut code

Lecture 27 Node 04 : How node.js server event loop works internally

Lecture 28 Node 05 : How to install and verify nodejs installation

Lecture 29 Node 06 : Hello world app

Lecture 30 Node 07 : What is Node package manager (NPM) and NPM CLI

Lecture 31 Node 08: Working with builtin console and crypto modules

Lecture 32 Node 09: Working with external npm package - lodash

Lecture 33 Node 10: Working with builtin modules - OS and Events

Lecture 34 Node 11: Working with builtin File Systems and Promises

Lecture 35 Node 12: Working with Streams 01 - Writable stream

Lecture 36 Node 13: Working with Streams 02 - Readable streams

Lecture 37 Node 14: Working with Streams 03 - process.std streams

Web concepts

Lecture 38 Web concepts 01: Introduction to data communication

Lecture 39 Web concepts 02: Open Systems Interconnection model

Lecture 40 Web concepts 03: Hypertext Transfer Protocol (HTTP)

Lecture 41 Web concepts 04: How HTTP messages sent and received

Lecture 42 Web concepts 05: Inspect HTTP request in browser devtool

Lecture 43 Web concepts 06: HTTP get and post request using CURL

Lecture 44 Web concepts 07: HTTP get and post requests in browser

Lecture 45 Web concepts 08: HTTP requests via postman and vscode

Lecture 46 Web concepts 09: HTTP request via javascript node-fetch

Lecture 47 Web concepts 10: Web server using built in HTTP module

Lecture 48 Web concepts 11: Expressjs + nodemon setup and running

[More will be added here]

Server

Node

  • History about why we needed node
  • What is node (architecture)
  • Installation and verify
  • Manage versions
  • Hello world
  • What’s happening

Node package manager

  • What and why
  • Dissecting package.json
  • Going into node_modules
  • Working with npm packages

Node built-in modules

  • os
  • events
  • fs
  • stream
  • http

Server frameworks

  • Comparison between server frameworks
  • Hello world - Express
  • Hello world - Koa
  • Hello world - Fastify

HTTP

  • OSI Model
  • How Internet works
  • HTTP messages
  • HTTP Request Types / VERBS
  • HTTP Clients (Postman, Insomnia, VSCode, Terminal)
  • HTTP Get
  • HTTP Post
  • HTTP Put
  • HTTP Delete
  • HTTPS

MongoDB

  • RDBMS vs NOSQL
  • Why MongoDB
  • How it works
  • Install
  • Working with Database
  • Working with Collection
  • Working with Schema
  • Working with Index
  • CRUD from mongo shell
  • MongoDB Atlas

Express API CRUD

  • Setup Express application
  • Setup routes
  • Perform CRUD using POSTMAN
  • Create model
  • Create service
  • Use validation

Testing

  • Unit test
  • Integration test

Client

Client side JavaScript

  • How browsers work
  • DOM rendering
  • Console, Network, Application tabs
  • Libraries and Frameworks

React

  • Why we needed react
  • What is React
  • How react works
  • Thinking in react

Create react app

  • Hello world
  • What’s happening in here
  • Create a calculator

Working with data

  • Local state
  • Passing data via props

React concepts

  • hooks
  • context
  • refs
  • custom hooks

React router dom

  • Create routes and pages
  • Create menu and page containers
  • Hooks
  • Router
  • Link

Form and List

  • Create a form from scratch
  • Create form using react-hook-form
  • Create a list page from scratch
  • Save data to server
  • Search data ono list page
  • Edit data

Testing

  • Snapshot testing
  • Storybook testing
  • Unit testing (Jest)

MUI

  • Material UI
  • Create pages
  • Use templates

Real project: Inventory system

Project management

  • Requirement analysis
  • Architecture analysis
  • Project breakdown
  • Release plan

Phase 1: Architecture and User management

Architecture

  • Create base architecture
  • Create auth codes properly
  • Add seed data
  • Modular architecture

Authentication

  • JWT token
  • Authentication in server
  • Authenticationin client
  • Add signin signout feature

Authorization

  • add middleware in server
  • add authorization mechanism in client

Phase 2: Feature implementation

Modules

  • Product
  • Customer
  • Order

Reporting

  • add recharts
  • add cron
  • design dashboard

Deployment

  • aspects of deployment
  • deploy to virtual machine
  • deploy to digital ocean apps
  • Cloud deployment (theory only)

Conclusion

  • What you should do next
  • Connect with me

Whole playlist

Playlist

https://dev.to/foyzulkarim/learn-mern-like-a-pro-4hf

favicon youtube.com

Top comments (43)

Collapse
 
mohiuddinmohi profile image
mohiuddinmohi

Waiting...

Collapse
 
faridulhassan profile image
Md. Faridul Hassan

Thank you @Foyzul Karim bhai.

Collapse
 
andrewbaisden profile image
Andrew Baisden

Deep topic.

Collapse
 
mahmudulhasan1773 profile image
mahmudulhasan1773

thanks

Collapse
 
maamouribilel profile image
Maamouri Bilel

Thank you, this is very helpful.

Collapse
 
shibbirahmad profile image
Shibbir Ahmad

thanks

Collapse
 
safin777 profile image
Safin,Sayed Islam

Waiting for this course..already did a lot practice on js and trying to learn the core concept of node environment..Hope we will get your udemy course soon..Best of luck vayya.🖤

Collapse
 
hnazmul profile image
H.Nazmul Hassan

Thanks you so much 🥰💖

Collapse
 
omarfarukesham profile image
Omar Faruk

Great Guide line, thanks

Collapse
 
codingjlu profile image
codingjlu

Why do we need to learn Koa or Fastify if this stack involves Express?

Collapse
 
foyzulkarim profile image
Foyzul Karim

That lesson is meant to teach how simple is to work with other frameworks if you know express.
And lesson is a hello world lesson.
I hope you get your answer

Collapse
 
mushfiqur06 profile image
Mushfiqur Niloy

Waiting

Collapse
 
shakilahmmed profile image
Shakil Ahmmed

waiting

Collapse
 
mizbauddintareq profile image
Mizba Uddin Tareq

Eagerly waiting

Collapse
 
mdshahriarferdous profile image
Ferdous

Thank you (JazakAllahu khair) sir, for giving us your valuable times, efforts and of course this course on youtube for absolutely free. It was needed for most of us. We are growing and developing ourselves by achieving skills from the mentors like you.

Collapse
 
fsappdev profile image
fsappdev

Thanks a lot man, this is great.