Today we are going to create a task management system using MERN stack. Where user can create their own account and manage their tasks. This will be simple app for MERN beginners. In this video we will learn a lots of things like how to create relations in mongoDb, create authentications, create private routes, custom react.js hooks and many more. I hope you guys will like it.
♥ Support the Content Creator:
☕ Buy Me A Coffee: https://www.buymeacoffee.com/shaifarfan08
🔔subscribe and turn on the notification bell.
👉 Source Code: https://github.com/ShaifArfan/mern-task-management-tool/tree/youtube-tutorial
👇Tutorial mentioned in the video:
– Express.js MongoDB CRUD: https://youtu.be/jBoAG8yoRlo
– JWT authentication: https://youtu.be/rXu9Z2yMZzA
– Eslint Setup: https://youtu.be/eMgLHOrDkAs
Follow Shaif Arfan 👇👇
Instagram: https://www.instagram.com/shaifarfan08/
Facebook: https://www.facebook.com/fb.ShaifArfan08
Twitter: https://twitter.com/shaifarfan08/
▶ Also Watch :
HTML CSS Portfolio Project: https://youtu.be/78l05_nuDIg
One Page HTML & CSS Project: https://youtu.be/ZFQkb26UD1Y
HTML & CSS Landing Page : https://youtu.be/6SCV-JXNvXI
Mini Project for HTML & CSS : https://youtu.be/7ylX8R0RENo
How To Make A WordPress website: https://youtu.be/DtHDhDJYOfA
▶ Some useful Playlist :
HTML & CSS: https://www.youtube.com/playlist?list=PLRv_Gd5w9e7mmrNLpQTB9RWMsVoRt2moe
Vanilla JavaScript : https://www.youtube.com/playlist?list=PLRv_Gd5w9e7mmALZQWt_DJErngAFLp-aV
Frontend Mentor Challenges: https://www.youtube.com/playlist?list=PLRv_Gd5w9e7liRWZfoXX1MgNztk2HPMVp
30days30submits Challenge: https://www.youtube.com/playlist?list=PLRv_Gd5w9e7m7wokXmB9fGtGYw100UKc0
🌐 Join The Community :
Our website : https://webcifar.com/
Facebook Page : https://facebook.com/webcifar
Facebook group : http://bit.ly/fb-group-webcifar
Instagram : https://www.instagram.com/web_cifar/
twitter : https://twitter.com/webcifar
Github: https://github.com/WebCifar & https://github.com/shaifarfan
⏲Timestamps –
00:00:00 – Intro
00:05:22 – Backend Init
00:12:17 – Express.js Setup
00:14:54 – MongoDB Setup
00:26:14 – Express.js Middleware
00:28:24 – Express.js Routes
00:38:07 – Auth Routes
01:09:19 – Error Handling
01:22:00 – Auth Routes (logout & is_logged_in)
01:28:18 – Users Routes
01:41:17 – Tasks Routes
02:09:49 – Frontend Init
02:17:54 – React Routes
02:21:44 – Private Routes
02:30:03 – Vite.js Server Proxy
02:32:45 – Page Layout
02:35:02 – Auth Page
03:00:00 – Home Page
03:00:58 – Nav (Home Page)
03:12:37 – Tasks (Task List & Task Item)
03:47:31 – Edit Profile Page
04:03:03 – Quick Fix 01
04:06:17 – Quick Fix 02
04:07:54 – bye bye
#webcifar #mernstack #reactJs
Comments