Build & Deploy a MODERN Contact Manager with MERN Stack

แชร์
ฝัง
  • เผยแพร่เมื่อ 8 ก.ค. 2024
  • Tired of outdated contact management apps? Build your own sleek and efficient contact manager with this comprehensive MERN Stack tutorial!
    Second Part:
    • React + Node + MongoDB...
    Third Part:
    • Easy MERN Project Depl...
    Support Me:
    www.buymeacoffee.com/codewith...
    In this video, you'll learn how to:
    Create a user interface with a modern feel using React and libraries like React Router for navigation, React Spinner for loading states, and React Toastify for user notifications.
    Structure your application logic with Context API for efficient data management.
    Implement robust authentication and authorization using JWT (jsonwebtoken) and secure password hashing with bcrypt.
    Build a user-friendly experience with form validation powered by Express Validator on the backend.
    Deploy your application to the cloud (deployment process not covered in detail).
    This video is perfect for:
    Developers looking to learn the MERN stack (MongoDB, Express, React, Node.js).
    Anyone who wants to build their own modern contact management system.
    Bonus! We'll also explore using libraries like SweetAlert2 for interactive popups.
    Get ready to take your contact management to the next level!
    Timestamp:
    0:00 Introduction of CONTACT MS
    10:46 Create React & Node Project & Package Installation
    18:02 Navbar and Home Design
    25:54 Implementation of React Router
    31:18 Design Register/Sign Up Page, Validation, Toastify
    56:51 Registration API (Server Side Code)
    01:38:01 Login Design, Validation, Server API
    01:54:30 Context API
    Install MongoDB in Windows: • Install MongoDB 6.0.6 ...
    MERN Stack Projects: • MERN
    React + Node + MongoDB Connection: • How to Connect ReactJS...
    #mernstack #react #nodejs #mongodb #contactapp #authentication #authorization #formvalidation

ความคิดเห็น • 26

  • @jayeshsabale5021
    @jayeshsabale5021 2 หลายเดือนก่อน +5

    Man daily checking your youtube channel for second part.

  • @alihassanhaji2830
    @alihassanhaji2830 3 หลายเดือนก่อน +2

    Someone like you is on this earth who is really want to assist students who have passions in MERN Stack, May God Bless the Work of your hands 🤲🤲🤲🤲

  • @samyogyogi3339
    @samyogyogi3339 3 หลายเดือนก่อน +2

    nice man now i can use this project as a reference for my final year project

  • @jayeshsabale5021
    @jayeshsabale5021 3 หลายเดือนก่อน +2

    i have nothing to talk with you , another than thank you so much.

  • @gembojones8243
    @gembojones8243 2 หลายเดือนก่อน

    Looking forward to the next part! thanks for the great tutorials!

  • @otuekongnyong4820
    @otuekongnyong4820 2 หลายเดือนก่อน

    day 2 praying you drop part 2 alr subbed and liked with notifications on.

  • @oktayaltunkaya9019
    @oktayaltunkaya9019 3 หลายเดือนก่อน +2

    you are the best that you very much sir

  • @kurikodudewe2734
    @kurikodudewe2734 3 หลายเดือนก่อน +1

    thank you brother

  • @zeeshankhan-yc4oy
    @zeeshankhan-yc4oy 3 หลายเดือนก่อน +1

    i need kind of this project, thanks!

  • @hackstuffwasim9161
    @hackstuffwasim9161 3 หลายเดือนก่อน +1

    Please use tailwind css in your projects

  • @nallamillivijayramrddy6038
    @nallamillivijayramrddy6038 25 วันที่ผ่านมา

    your videos are good i am learning a lot from your videos it would be a lot more helpful if unit test cases are also incuded as part of the videos

  • @usmanakbar8592
    @usmanakbar8592 2 หลายเดือนก่อน

    volume issue, but awesome

  • @garnerhernani7114
    @garnerhernani7114 3 หลายเดือนก่อน +1

    Hello master, you're always awesome. Can you create a project tutorial for RethinkDB ?

  • @daisy_coder
    @daisy_coder 3 หลายเดือนก่อน

    Can you make a video about generating javascript data.... about creating an account and logging in to the web?

  • @jerichogibsmaralit7103
    @jerichogibsmaralit7103 2 หลายเดือนก่อน +1

    Next Project E-commerce

  • @oktayaltunkaya9019
    @oktayaltunkaya9019 3 หลายเดือนก่อน +1

    sir can you also do using redux toolkit projects pleas

  • @dhanrajgedam1382
    @dhanrajgedam1382 3 หลายเดือนก่อน +1

    Bro, please make this project using MySQL ❤

  • @Meme.stocks
    @Meme.stocks 2 หลายเดือนก่อน

    Why my controller code is not working

  • @Karthi875
    @Karthi875 2 หลายเดือนก่อน

    Can anyone tell me .. if i put this project in my resume .. if a interviewer asks why you done this project what should i say

  • @edenbar1465
    @edenbar1465 3 หลายเดือนก่อน

    God bless you man

  • @meherabhossain7378
    @meherabhossain7378 2 หลายเดือนก่อน

    please improve sound and add git hub source code

  • @ammartahir3591
    @ammartahir3591 3 หลายเดือนก่อน

    Add admin and client panel in it please

  • @alihassanhaji2830
    @alihassanhaji2830 3 หลายเดือนก่อน +1

    The source code please

    • @codewithyousaf
      @codewithyousaf  3 หลายเดือนก่อน +1

      After publishing the second part you will get the link.

    • @samyogyogi3339
      @samyogyogi3339 3 หลายเดือนก่อน

      @@codewithyousaf sir when is the second part coming? can you publish it abit fast?

  • @ShamaKhan-g2q
    @ShamaKhan-g2q 4 วันที่ผ่านมา

    Can I Give 1K likes for this content