I have to express my gratitude for giving us all this knowledge. I just graduated as a Full Stack Web Developer, and will continue to watch your videos throughout my career. You helped me so much especially with my last project, and I can code better each day just from watching you. Thanks Bro.
Brother please don’t stop making these videos! They may seem like simple projects but so far in this video I have learned so much and I can actually follow through and understand what’s going on! Many blessings to you! 🙏🏼 keep up the great work. And keep these projects coming because I will be here to learn from the best. I hope you could make a separate video showing firebase would be nice to supplement the learning.
This is such a solid, solid, solid tutorial. Touching on Tailwind CSS while creating a todo app in React JS with a firebase backend - all in under one hour. Super easy to follow along. Thanks so much for putting this together and putting it out there. Well done, sir.
It was my first firebase use, it works so smoothly and is well documented. I also like the way you used tailwind classes by putting them in an object called styles. Thanks for the video !
Hey, I really love your videos. I don’t comment often but I had to tell you. You explain very well. You are not too fast and not too slow either. You have great tutorials that teach bunch of new helpful things. I am a new subscriber but already a big fan!
Thank you so much for taking take to prepare for, record and deliver those materials to us! It helped me in my bigger project. So so thankful! Please keep making new videos!
It was a very beginner friendly tutorial project of react, firebase, tailwindcss with perfect explanation of all the functionalities. Thank You for this. Helped a lot in learning the basics properly.
I seen number of videos related to connecting react application to firestore i did not feel interesting, this video helps me to understand firestore concepts thoroughly. Thank You.
this is awesome! Keep those backend videos coming. Personally thats where I lack and I really don’t see alot of youtube developer covering a bridge between the Frontend and backend! Good stuff man!
Really helpful video! I was looking for an entry point to begin learning firebase and this video really helped a lot. Also it was a good revision for React.
You made it so understandable, thank you! I only missed an order stacking of todos, where the newest todo would be first on the list or where the completed todos would jump to the end of the list.
Awesome tutorial! Thank you! Can you pls give advice, or where can I found, how to add date to each of todos, when it suppose to be accomplish, and add how to add btn with possibilities to add any file to each todos. Kindly regards!
This was a great tutorial! Also, I'm wondering why when a todo is added, it's not always added to the top of the todo list? Sometimes, it's added randomly in the middle of the list like at 57:39?
Hi Martin. I believe it’s added in alphabetical order but I may be mistaken. You could add an additional field using the server timestamp and then use the Firebase orderBy method to sort by timestamp
Juan! Haha that’s a good idea man! I do freelancing on e-commerce platforms which is where the name came from. I had a different vision for the channel initially but I’ve enjoyed working on different things lately.
]Could you make a short video explaining how to properly pass props with updateDoc() firebase function? I see we are crossing out the todo but can you do it to pop up a modal to edit the data via input textfield? im having trouble with this, Thank you!
I have a doubt , the height is set to h-screen(100vh) , what if there are many todo list items they will surely overflow right.How to solve this probem?
But how can I make this app userspecified. I mean if I add sign in and signup method then any user can get all the todos. So how can I make the todos available for logged in users only. By the way, awesome video. You did it very simply.
Could you possibly make an app that is a firebase & react stack with firebase storage for the images and firebase db for the posts, essentially like a blog remake? Editing a post through a modal and such?
I have the styles set up the exact way you did but the line-through and the bg-slate-400 wont show up and i have no idea why. Super irritating but i love the vid!
I have the bg-slat applied to li and liComplete. The li has 200 and the complete has 400. My line-through is applied to the textComplete. Here is the style code block that i have. const style = { li: `flex justify-between bg-slate-200 p-4 my-2 capitalize`, liComplete: `flex justify-between bg-slate-400 p-4 my-2 capitalize`, row: `flex`, text: `ml-2 cursor-pointer`, textComplete: `ml-2 cursor-pointer line-through`, button: `flex cursor-pointer items-center` } Im also new to Tailwind so i might just have to learn the basics of it first and try to apply it that way.
@@codecommerce I’m so happy to meet your channel It made stuff easy and now I’m rebuilding my portfolio again and I will be glad to get you to critic it again. Thanks 😊
Congratulations for the channel is one of the best. I followed the tutorial but using vitejs. But, I can't make environment variables work using vitejs
This is a great tutorial, thanks man. i actuall have an issue, when i deployed this on netlify an todo added is chaneged across all platforms, when i try accesing it from another phone,i can still see the todo list from my phone, is there a way to make make different users have a new sheet when they access it
Hi Toni, yes you can store user specific data. I have a couple projects like that. You could create a new “collection” with the users email and then store documents to that same user. Right now we aren’t storing any users in the database, only getting authenticated.
Hello, is it safe to deploy this application with our firebase keys in the frontend? Would we need to create a local server or would editing our permissions within firebase be enough to prevent unwanted manipulation of our DB? Thanks for the videos, I have created several projects based on your youtube videos - keep them coming!
Hiii. I like much yours vídeos tutorials. But i would like to see you teach reactjs using react structure components and typescript. Its best practicies that makes the difference to get a job.
@@codecommerce when i got stuck , i found the solution it was hard but i didn't want to look at the GitHub code. At the end it was worth it. my suggestion is can you share the shortcuts in visual studio and also how do you go about learning a new framework.
I love how you organize tailwind properties in an object. It makes the code so much cleaner!
I have to express my gratitude for giving us all this knowledge. I just graduated as a Full Stack Web Developer, and will continue to watch your videos throughout my career. You helped me so much especially with my last project, and I can code better each day just from watching you. Thanks Bro.
So awesome dude!! Keep building stuff!
Brother please don’t stop making these videos! They may seem like simple projects but so far in this video I have learned so much and I can actually follow through and understand what’s going on! Many blessings to you! 🙏🏼 keep up the great work. And keep these projects coming because I will be here to learn from the best.
I hope you could make a separate video showing firebase would be nice to supplement the learning.
Thanks man! Another firebase video tomorrow morning.
Whoaaa... this tutorial was super awesome loved it . Keep em coming !!!
Thanks vikk!
This is such a solid, solid, solid tutorial. Touching on Tailwind CSS while creating a todo app in React JS with a firebase backend - all in under one hour. Super easy to follow along. Thanks so much for putting this together and putting it out there. Well done, sir.
It was my first firebase use, it works so smoothly and is well documented. I also like the way you used tailwind classes by putting them in an object called styles. Thanks for the video !
Best youtuber for react JS I've seen in my 2 years journey so far, You are a life saver keep up the work man love it
Hey, I really love your videos. I don’t comment often but I had to tell you. You explain very well. You are not too fast and not too slow either. You have great tutorials that teach bunch of new helpful things. I am a new subscriber but already a big fan!
Thank you so much for taking take to prepare for, record and deliver those materials to us! It helped me in my bigger project. So so thankful! Please keep making new videos!
Thank you dude!
It was a very beginner friendly tutorial project of react, firebase, tailwindcss with perfect explanation of all the functionalities. Thank You for this. Helped a lot in learning the basics properly.
BRO this helped me out immensely. Not alot of people working Firebase config for the new v9. Very helpful!
Awesome Micah. I’m glad it helped!
I seen number of videos related to connecting react application to firestore i did not feel interesting, this video helps me to understand firestore concepts thoroughly. Thank You.
Thank you!
Totally worth it spending time on your videos! Always learning something new! Great job!!
this is awesome! Keep those backend videos coming. Personally thats where I lack and I really don’t see alot of youtube developer covering a bridge between the Frontend and backend! Good stuff man!
It’s certainly a little more difficult than the “React” apps which are primarily HTML/CSS apps.
Great tutorial, was super easy to follow and you covered a lot of ground. Thanks!
Thank you Richard!
Really helpful video! I was looking for an entry point to begin learning firebase and this video really helped a lot. Also it was a good revision for React.
You made it so understandable, thank you! I only missed an order stacking of todos, where the newest todo would be first on the list or where the completed todos would jump to the end of the list.
Thanks a lot, man, Your tutorials are really helpful. I learned a lot, Now I am going to build my own project
Thank you my friend!
Love your content.
Thanks for sharing your knowledge !!!
This is great! Simple and precise!! I appreciate you !!
Great video man and perfect timing I was looking to get started learning Firebase!!!!
Firebase is awesome dude!
This is awesome! Don't stop my man
Thank you Andrew!
you are actually the best. definitely subscribing.
Thank you!
seriously great tutorial. helped me out a lot
hey dude! i like your style very much) thanx for teaching
Thanks man, it helped me a lot.
i am dead when he said ofc we didnt do anything right BAhahaa i love moment like this in code tutorial
happens... lol
Man graet job. You is the Best. Help me a lot with your tutorials.
Thank you Claudia!
Thanks man, you rock!. I love the content.
really helped me [learning developer] a LOT thanks
keep uploading brother love the content
Thank you dude! I’m enjoying uploading content as often as I can! 😃
I wish I could put five likes because this video helped me at least five times for last four months.
Thank you Oxana!
This was a great tutorial. Thank you!
Thank you Alex!
Needed this video! Thanks again!!
Thank you again sir!
@@codecommerce Welcome !
Great video! Can you share how you beautified / formatted your code in visual studio @ 0:55:56 ?
you need to download extension called prettier and there will be shortcut
Great video ))) thank you a lot for posting this out ;)))
Thank you so much for this awesome video. Subscribed 👍 :)
Thanks again learning so much great build
Thank you man!
Really great content. Thanks 👍
Thank you!
I think that you miss an Edit function in your to-do list. But it is also a great tutorial for beginner.
Thanks, friend, waiting for another tutorial, preferred Firebase with lots of filtering for the items
Thank you my friend!
Great Tutorial !!
Great content mate
Thank you Christian! 💪
great tutorial!
Thanks a lot sir :) for your beautiful project :)
amazing tutorial. thanks so much. ☺
Awesome tutorial! Thank you!
Can you pls give advice, or where can I found, how to add date to each of todos, when it suppose to be accomplish, and add how to add btn with possibilities to add any file to each todos. Kindly regards!
Thank you! You could do a timestamp or a user set time :)
This is great. I kinda got lost in the firebase code in Read function
thank you very much It was so helpful
This was a great tutorial! Also, I'm wondering why when a todo is added, it's not always added to the top of the todo list? Sometimes, it's added randomly in the middle of the list like at 57:39?
Hi Martin. I believe it’s added in alphabetical order but I may be mistaken. You could add an additional field using the server timestamp and then use the Firebase orderBy method to sort by timestamp
Can't find the working way of sorting the data at snapshot, so in my case I just sort the data after foreach in snapshot
Can I ask why when storing your todos from firebase to your local state, you used 'push' rather than setState(doc.data()) ? Curious! Thanks
Hey clint! super awesome video and I'm definitely learning a lot through you. Just wondering... what was the exercise site you used before leetcode?
Thanks! edabit was where I started out. It starts off very basic - great for beginners.
you should make a e commerce with firebase in honor of your youtube nickname.... good job! I love your videos!
Juan! Haha that’s a good idea man! I do freelancing on e-commerce platforms which is where the name came from. I had a different vision for the channel initially but I’ve enjoyed working on different things lately.
at 44:07 my line-through text decoration didnt work at all. anyone has the same problem?
What is your code?
@@codecommerce already solved it. forgot to add jsx in tailwind config.
@@joelhkbn thank you so much! I was having same problem.
Can you make videos on Instagram Facebook clone like we better understanding how big applications work and there structure
Basit- I was just thinking about that. It would be nice to use redux and show how larger applications are built out. It’s just time consuming! 😂
]Could you make a short video explaining how to properly pass props with updateDoc() firebase function? I see we are crossing out the todo but can you do it to pop up a modal to edit the data via input textfield? im having trouble with this, Thank you!
Thanks sir what an amazing video it was ♥️♥️♥️
Thank you my friend!
Background gradient colour are not working on my device like I'm using vite set up what's the issue????
I have a doubt , the height is set to h-screen(100vh) , what if there are many todo list items they will surely overflow right.How to solve this probem?
Cool, very informative video
Thank you
No se mucho Ingles y aun asi logre entender, muchas gracias
Great video.
But how can I make this app userspecified. I mean if I add sign in and signup method then any user can get all the todos. So how can I make the todos available for logged in users only.
By the way, awesome video. You did it very simply.
Great tutorial
Thanks!
@@codecommerce do you have or could recommend a tutorial for adding bottom tab navigation?
That's awesome tutorial. Is it possible to add the edit text function in this app?🤔
Could you possibly make an app that is a firebase & react stack with firebase storage for the images and firebase db for the posts, essentially like a blog remake? Editing a post through a modal and such?
Great tutorial.
Liked+Subscribed = Done😎
I have the styles set up the exact way you did but the line-through and the bg-slate-400 wont show up and i have no idea why. Super irritating but i love the vid!
Hmm what are you applying the bg-slate to?
I have the bg-slat applied to li and liComplete. The li has 200 and the complete has 400. My line-through is applied to the textComplete. Here is the style code block that i have.
const style = {
li: `flex justify-between bg-slate-200 p-4 my-2 capitalize`,
liComplete: `flex justify-between bg-slate-400 p-4 my-2 capitalize`,
row: `flex`,
text: `ml-2 cursor-pointer`,
textComplete: `ml-2 cursor-pointer line-through`,
button: `flex cursor-pointer items-center`
}
Im also new to Tailwind so i might just have to learn the basics of it first and try to apply it that way.
Thanks for a great tutorial. Is there anyone on this channel that can guide me to why my app flashes up then disappears on the browser.
thanks for this content . Could you do a tutorial with django and React ?? Please
Oh man I’m afraid I’m not familiar with Django. I haven’t started learning python yet.
can you please tell how to add firebase auth so user can access there own todos not others
Is helpful learning firebase such as front end developer junior?
Hey Clint, do you have a tutorial on firebase hosting and deploying I did try to deploy this app it deployed a blank page though
Hello man how are you i can help you if you want to deploy first project
Thanks bro for everything
Thanks again Joseph! 💪
@@codecommerce I’m so happy to meet your channel It made stuff easy and now I’m rebuilding my portfolio again and I will be glad to get you to critic it again.
Thanks 😊
Great, I will try to add edit todo
Amazing tutorial!! What was the other platform you used before leetcode?
Edabit was the very first! I have a link in the bio. It’s the most beginner friendly. Leetcode made me feel dumb when I first started. Haha
Really awesome
Thank you Nabin!
Congratulations for the channel is one of the best. I followed the tutorial but using vitejs. But, I can't make environment variables work using vitejs
Let me check - Haven't used much vite, I was actually reading some of their docs the other day!
Hello Sir..can u please tell me which font u r uning in ur vscode ?? (user and workspace)
I am using the Material Ui for my vs code theme. They have a bunch of cool themes.
@@codecommerce yeah I know about the theme but what is your vs code font in setting
Thank You soo much for this..
Anytime sir!
Melhor que isso, só dois disso! Parabéns
This is a great tutorial, thanks man.
i actuall have an issue, when i deployed this on netlify an todo added is chaneged across all platforms, when i try accesing it from another phone,i can still see the todo list from my phone, is there a way to make make different users have a new sheet when they access it
Hi Toni, yes you can store user specific data. I have a couple projects like that. You could create a new “collection” with the users email and then store documents to that same user. Right now we aren’t storing any users in the database, only getting authenticated.
@@codecommerce ok, thanks... I will do just that.
@@codecommerce thanks for your videos, you have really helped me alot 💫💫
@@oluwatobiomotosho4754 did you solved your problem can you guide me ?
Would you be able to show us how to make 1-1 chat app using firebase if possible! Thanks
That would be really awesome- I can work on that!
@@codecommerce Thank you so much!
you are the king
Haha thanks dude!
great one
Sir plz create video on redux toolkit also include asyncthunk , middleware, and queries...
hope you'd shown how to use the env file
Apologies, I’ll go into more detail
Thank you bro :)
No problem dude!!
Excenelent thanks a lot!
Thank you my friend!
Hello, is it safe to deploy this application with our firebase keys in the frontend? Would we need to create a local server or would editing our permissions within firebase be enough to prevent unwanted manipulation of our DB? Thanks for the videos, I have created several projects based on your youtube videos - keep them coming!
No - it would be wise to store your keys in a DOT ENV file.
@@codecommerce Can you make a video on deployment and how to store keys in DOT ENV file?
Hiii.
I like much yours vídeos tutorials.
But i would like to see you teach reactjs using react structure components and typescript.
Its best practicies that makes the difference to get a job.
Yes I have typescript coming soon!
Awesome as always!
Can you do the same App with mongodb, please?
Oh absolutely! Mongo DB coming soon!
Amazing!!!!
Thank you Deena!
thank u so much!!!!
yay I finished it.
You got it dude!! 🙏
@@codecommerce when i got stuck , i found the solution it was hard but i didn't want to look at the GitHub code. At the end it was worth it. my suggestion is can you share the shortcuts in visual studio and also how do you go about learning a new framework.
I'm stuck at passing the todo I still get errors
Do you have a GitHub? What is the error you’re getting. Feel free to have a look at my repo :)
How does it work with Firebase with Redux?
Redux coming soon
could do you node.js tutorial
You got it! Node coming soon.
Code is not visible during video please next time zoom the code for clear visibility of code
You got it.
hi, would like to know other platforms like leetcode
Haven’t heard of that one!
Darkhan, hackerrank is really great AND I like edabit for beginners.