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

Рет қаралды 76,971

Күн бұрын

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

@saikishorevangala8123 Жыл бұрын

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

@HamaadAfzal 5 ай бұрын

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

@nithyasri-b5c Ай бұрын

Can I get the source code of it

@gabriel_macena 2 ай бұрын

Thank you for helping me with my first MERN project!

@nicholemcgrew2588 7 ай бұрын

Short, sweet, and complete! Thank you!

@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

@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

@programming3617 6 ай бұрын

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

@muskangupta4551 Жыл бұрын

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

@ajayboro777 10 ай бұрын

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

@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

@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.

@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..

@jacobhagan553 Ай бұрын

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

@EfimRisberg Жыл бұрын

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

@aravindp2595 Жыл бұрын

I think className should be applied

@pranavbedekar5844 Жыл бұрын

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 11 ай бұрын

thank you bro it is working now @@coronareyesmauriciodassel5345

@WorldSpace007 Ай бұрын

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

@deblinaroy9624 6 ай бұрын

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

@codewithyousaf 6 ай бұрын

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?

@abhaykashyap256 Ай бұрын

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

@uniquetechexploration Жыл бұрын

pls how did you add the icons?

@uniquetechexploration Жыл бұрын

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

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

Taught me so much about mern stack thanks !!!

@onion2530 3 ай бұрын

it say net::err_connection_refused how to solve??

@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

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

really good and clear explanation!

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

tank you so much...such a helpful video

@sampathkumar1301 4 ай бұрын

update todo not there in front end

@dipakkumawat8608 4 ай бұрын

same issue

@nagazackyishida2160 Жыл бұрын

Thank you so much! It works!

@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?

@brycetownsend1289 Жыл бұрын

Amazing! Thank you so much!

@manjeeralakshmi7472 5 ай бұрын

mongodb compass is not creating the database automatically

@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!!

@namangokhru3715 Жыл бұрын

source code ??

@walleworkie 9 ай бұрын

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

@hassanmujtaba9086 Ай бұрын

Thx alot bro!!

@ugyenofficial 11 ай бұрын

thank you so much bro

@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

@SoftwareScience 11 ай бұрын

css not working....

@authenticvideocreator8546 4 ай бұрын

thanks for this vide

@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

@RodrigoAR33747 24 күн бұрын

This bro is working outside

@SajalSoni00 8 ай бұрын

sir can you please provide source code for cross check

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

great video

@VandanaTripathi-r4d Ай бұрын

Can I get a sourcee code pleaseee???

@democracyprevails 7 ай бұрын

bro code please

@veera1_8_001 8 ай бұрын

Can I get the source code?

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

thank you

@dfordemo981 Жыл бұрын

brilliant

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

thanks bhai

@ksantoshkumar4579 5 ай бұрын

wheres the source code ?

@malikshifin2699 10 ай бұрын

Source code?

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

please share source code as well.

@vaibhavsolanki8225 9 ай бұрын

29:49 done=true not working..

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

thx

@arnopzakaria3212 Жыл бұрын

MERN E-commerce project...

@magomedbataev8131 8 ай бұрын

where is the source coooooooooooooooooooooooooooooooooooooode

@walleworkie 9 ай бұрын

please do projects sir

@somanadhguthula147 8 ай бұрын

Oh ma gud where is the source code

@zaidkhan4555 5 ай бұрын

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

@sweetangleam5106 25 күн бұрын

24:00

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

Pdf hongi to upload krdo

@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

@Roozikhan565 Жыл бұрын

❤❤❤❤😊

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

AxioError coming

@Garvit41 Ай бұрын

One of the worst tutorial I have ever came across

@whatsupbitch111 Жыл бұрын

Thank you. Great video, keep it up!

@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 11 ай бұрын

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.