Building a Todo List App with MERN Stack | Todo Application using MongoDB + Express + React + Node

Рет қаралды 75,159

Күн бұрын

In this video, we're going to build a todo list app using the MERN Stack. This is a full stack solution, meaning we'll be using MongoDB, Express, React, and Node. We're going to build a todo list application that users can add tasks to and track their progress.
This is a great tutorial for anyone new to the MERN Stack, or for anyone who wants to learn more about how to build a todo list app. We'll take you step by step through the process, and by the end, you'll have a working todo list application that you can use in your own projects!
#todolist #mongodb #reactjs #nodejs #expressjs

Пікірлер: 102

@HamaadAfzal 5 ай бұрын

Finally My first mern project is done because of you, Thanks Brother

@nithyasri-b5c 27 күн бұрын

Can I get the source code of it

@nicholemcgrew2588 6 ай бұрын

Short, sweet, and complete! Thank you!

@saikishorevangala8123 Жыл бұрын

Sir can you provide the code as a reference purpose for cross checking.

@gabriel_macena 2 ай бұрын

Thank you for helping me with my first MERN project!

@programming3617 5 ай бұрын

Great Lecture. Thanks for making things clear😊😊 May God bless you with lots of his blessings ameen.

@ajayboro777 10 ай бұрын

Bro, u r a good tutor.😊 But please use background noise remover software.

@Vivek-fc7cl 2 ай бұрын

Bro when we add,update or delete the task at that time whole page reloads that is logically not correct because we are working in react, it should reload only that part of application

@anti-tankartur677 4 ай бұрын

Taught me so much about mern stack thanks !!!

@whatsupbitch111 Жыл бұрын

Thank you. Great video, keep it up!

@atone-p2t 3 ай бұрын

really good and clear explanation!

@VikashYadav-eo1qi 13 күн бұрын

tank you so much...such a helpful video

@Srilakshmi-xh5iy 6 ай бұрын

when i am editing the code in app.jsx file localhost stops working and it is showing a vitehmr update and it doesnt show any ouput

@nagazackyishida2160 Жыл бұрын

Thank you so much! It works!

@brycetownsend1289 Жыл бұрын

Amazing! Thank you so much!

@hassanmujtaba9086 25 күн бұрын

Thx alot bro!!

@authenticvideocreator8546 4 ай бұрын

thanks for this vide

@muskangupta4551 Жыл бұрын

requr=est is not defining in post showing not connecting with database

@thanos.42078 2 ай бұрын

great video

@praveshverma0808 3 ай бұрын

how to deploy this project with local mongoDb database , what i have to set up local mongodb before deployment , please tell me

@viniciussilvano4177 Ай бұрын

Localhost MongoDB is only available on your computer. If you deploy, you need to use MongoDB Atlas so that you can run your code anywhere.

@WorldSpace007 22 күн бұрын

Sir can we use effect for 33:00 for re rendering By using todos list in dependency array??

@Motivational_talks 5 ай бұрын

when you are trying to access to display the todos...user.task .....here task is what?? means from where you get this?? pls response

@codewithyousaf 5 ай бұрын

task is stored inside database

@Harshitsharma-jn6qj 4 ай бұрын

how to post update date and (fetch data without reload), for eg: when we click like button of youtube video it don't make reload, it make realtime,like instagram also?

@codewithyousaf 4 ай бұрын

As for your example we can do that because that is front-end but we you would like to update your post then it must reload to fetch updated data.

@Harshitsharma-jn6qj 4 ай бұрын

@@codewithyousaf bhai samjh ni aaya aap ne kya lika hai.. par mujhe ek solution mil gya hai.. mai useeffect se sara data managa rha tha backend se or usse state mai rakh rha tha... to abb jab bhi koi post ya like function callkarega too fir se useeffect call krwa denge.. jise ab ka updated data bhi aajaye or refresh bhi na kr na pade..👍👍 or dusra tarika redux use krke bhi ho jaye ga..

@ugyenofficial 11 ай бұрын

thank you so much bro

@jacobhagan553 Ай бұрын

Pls is there way to uncheck the checkbox back to false to reflect on the db?

@abhaykashyap256 21 күн бұрын

App css ho kaam ni kar rha...10 baar se jada repeat Kiya lekin problem ni Mila...

@sampathkumar1301 4 ай бұрын

update todo not there in front end

@dipakkumawat8608 4 ай бұрын

same issue

@walleworkie 9 ай бұрын

please do ecommerce project using node js, express js, mongodb, react with payment getways

@user-ym5tp1cl2k 11 ай бұрын

I'd stuck on 7:30, the style from App.css cannot be applied, what it can be?

@aravindp2595 11 ай бұрын

I think className should be applied

@pranavbedekar5844 11 ай бұрын

Could you elaborate?@@aravindp2595

@coronareyesmauriciodassel5345 11 ай бұрын

To apply the CSS classes to the elements, you need to assign those classes to the JSX elements using the className attribute. Here's how you can do it in your components: In Home.jsx, you can apply the home class to the outer element like this: function Home() { const [todos, setTodos] = useState([]); return ( {/* Apply the 'home' class */} To Do List {/* ... */} ); }

@coronareyesmauriciodassel5345 11 ай бұрын

function Create() { return ( {/* Apply the 'create_form' class */} Add ); }

@jaydeepbhogate3753 10 ай бұрын

thank you bro it is working now @@coronareyesmauriciodassel5345

@RodrigoAR33747 15 күн бұрын

This bro is working outside

@dfordemo981 11 ай бұрын

brilliant

@deblinaroy9624 6 ай бұрын

I am unable to find my local IP address port number. Every time I try, it shows an axios error.

@codewithyousaf 5 ай бұрын

u r using mongoDB atlas use this IP 0.0.0.0/0

@ZainAli-fh7oj 2 ай бұрын

just write localhost. It's the same

@CoderUzair 9 сағат бұрын

hi! how did you resolve your issue?

@uniquetechexploration 11 ай бұрын

pls how did you add the icons?

@uniquetechexploration 11 ай бұрын

fixed

@BytezDevs 9 ай бұрын

@@uniquetechexploration Can you please help me fix the icons issue?

@winterflake741 8 ай бұрын

Can u tell how u fixed it?

@uniquetechexploration 8 ай бұрын

we have alot of icons...search on google for some mostly in formats like bscircleFill@@winterflake741

@manjeeralakshmi7472 5 ай бұрын

mongodb compass is not creating the database automatically

@onion2530 2 ай бұрын

it say net::err_connection_refused how to solve??

@namangokhru3715 11 ай бұрын

source code ??

@greeshmaaturu2889 10 ай бұрын

Can I get the source code? I was stuck in the project. It's a request from my side.

@Anonymous____________A721 Ай бұрын

No response from that side

@عبدالعزيزسليم-ص3س 9 ай бұрын

thank you

@VijayChauhan-Krishna 8 ай бұрын

thanks bhai

@democracyprevails 7 ай бұрын

bro code please

@rombohak-lgite4400 3 ай бұрын

thx

@VandanaTripathi-r4d 22 күн бұрын

Can I get a sourcee code pleaseee???

@SajalSoni00 7 ай бұрын

sir can you please provide source code for cross check

@arnopzakaria3212 Жыл бұрын

MERN E-commerce project...

@SoftwareScience 10 ай бұрын

css not working....

@sweetangleam5106 16 күн бұрын

24:00

@BytezDevs 9 ай бұрын

Icons are not working, what to do brother?

@victorm3807 8 ай бұрын

I think when something like icons is not working, it is the best opportunity to explore other icons libraries out there!!

@PHYSICSINNEPALI 7 ай бұрын

15:55 what is the local ip adress of mine ? how to know that ? can i know it using - ipconfig in cmd which i should use among : IPv4 Address. . . . . . . . . . . .: Subnet Mask . . . . . . . . . . . : Default Gateway . . . . . . . . . :

@deblinaroy9624 6 ай бұрын

hi, did u solve this?? i couldnot find my local ip address port number. everytime it shows axios error

@NeerajSharma-sk2rs Жыл бұрын

if we do not want vite and want simple npm install, is it ok cause i never use vite and i am also not comfortable with this

@mdfaiyazulhussain8752 9 ай бұрын

Yes it is ok to use although

@abdu11ahh 4 ай бұрын

why are you not comfortable with it ? any specific reason?

@walleworkie 9 ай бұрын

please do projects sir

@veera1_8_001 7 ай бұрын

Can I get the source code?

@ksantoshkumar4579 5 ай бұрын

wheres the source code ?

@gg.cip0t Жыл бұрын

I have learnt ReactJs and AntDesign, How much time do gou think I can learn Express,MongoDB and NodeJs?

@gojovoiceover 6 ай бұрын

if you are naruto you can learn fast , if you are nobito you need more time

@vaibhavsolanki8225 9 ай бұрын

29:49 done=true not working..

@zitansalehin6941 5 ай бұрын

Too much code skipping..you shouldn’t make video like this..wastage of time

@Welcome_home6264 5 ай бұрын

you have to create request in thunder client by yourself otherwise it won't work

@MDSALIM-lj7hs 11 ай бұрын

please share source code as well.

@Roozikhan565 Жыл бұрын

❤❤❤❤😊

@magomedbataev8131 8 ай бұрын

where is the source coooooooooooooooooooooooooooooooooooooode

@malikshifin2699 10 ай бұрын

Source code?

@zaidkhan4555 5 ай бұрын

Not good for beginner It involve lack of explaination and also improper speech which pose difficulty for viewer to understand

@somanadhguthula147 7 ай бұрын

Oh ma gud where is the source code

@Sans24-kj5zm 2 ай бұрын

Pdf hongi to upload krdo

@k-CE-OmkarPathak 5 ай бұрын

AxioError coming

@garvitgoyal41 Ай бұрын

One of the worst tutorial I have ever came across

@lonewolf7704 5 ай бұрын

@pujachoursiya7418 Жыл бұрын

I am unable to get id in my console please help @Code With Yousaf

@codewithyousaf Жыл бұрын

when you pass it to the server side through URL then destruct it from req.params if it was empty then check your front-end

@genarodistilio8441 10 ай бұрын

Hey! I had the same problem, i just needed to add a "key={todo._id}" on the classname task div: ---- todos.map(todo => ( handleEdit(todo._id)}> ---- It worked for me, i don't know why his code is working.