Build a TODO app with React and Firebase • Edit a Todo • PART 23

preview_player
Показать описание
**** PART 23 DESCRIPTION ****

**** COURSE DESCRIPTION ****
In this course I will walk you through all the steps needed from start to finish to code a To Do App using React JS and firebase. I will explain the logic behind each line of code before typing the code, I'm going to use diagrams and animations so you can follow up easily and have a better understanding of what's going on behind the scenes of our App/Code.

In our To Do App the user can add a to do by filling a form (Controlled component) that has an input for the to do text, an input for date and time (We wi use the date and time pickers from Material UI), and he/she can select the project he/she wants to add the to-do to.

The user can filter the todos by date (Today, Next 7 days, All days) or by project, se when he/she clicks on project, only the to dos under that project will appear.

The user can add, remove or edit a to do. When editing a to do the user won't need to hit a "save button" to save the changes cause the changes ei be saved automatically.

The user can add, remove, rename a project. When removing a project, all the todos under that project will be removed.

When the user completes a to do, we show a line through the text of the to do and show a Circle Check Icon instead of a Circle (We are going to use the icons from react bootstrap icons).

When a to do is completed, the user can repeat the to do next day.

We will add some animations (transitions) to our App, using react spring library.

🌍 Social Media Links.

💲 Suppport the Channel
Рекомендации по теме
Комментарии
Автор

🚨 Big Announcement! 🚨

Hey everyone! I've made a big decision for this channel—I've turned off ads on all my videos! That's right, you can now enjoy all my content ad-free! This means I'm earning $0 from ad revenue, but I believe this is the right move to make your viewing experience better.

If you find my content valuable and want to support my work, there are several ways you can help:

Like & Share: Simply liking the video and sharing it with friends helps a lot!
Subscribe & Hit the Bell: Stay updated and never miss a new video.
YouTube Thanks: Use the "Thanks" button below to send a one-time donation.
Join the Channel Community: Get exclusive perks and behind-the-scenes content.

Every little bit counts and goes directly to creating more high-quality content for you all. Thank you so much for your continued support!

Let’s keep growing and learning together! 🌟

CodeExplained
Автор

Excellent, clear and direct teaching. Thank you.

fightscene
Автор

clean, easy to understand, well structured guide.

appletesla
Автор

I loved this channel. Great content you have provided so far.

gobideveloper