Skip to content
Submitted almost 2 years ago

ToDo List Web App using tailwind css and vanilla JS

tailwind-css
_nehal💎•6,710
@NehalSahu8055
A solution to the Todo app challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

👋Hello, Frontend Mentor coding community.

👨🏼‍💻This is my solution for the ToDo List Web App

🛠️ Built with

  • Semantic HTML5 markup
  • Tailwind CSS
  • Vanilla JS

🎨 Features

  • 🫧 CSS Animations
  • 🤹 Custom UI Design
  • 🌈 Dark Theme Mode
  • 🪞 Glassmorphism

📜 What I learnt?

  • Event handling
  • Event bubbling
  • Event Delegation
  • Local Storage

💡 Challenges Faced

  • Event Listener Problem
  • Dynamically adding list items

✨ Bonus

  • Multi select checkbox(top to bottom & vice-versa)
  • Click on any checkbox and hold shift key then again click on another checkbox all the list in between will be selected.

✅Update ➜ Now localStorage also supported 🆕

I'll be happy to hear any feedback and advice!🤗

Code

Please log in to post a comment

Log in

Community feedback

  • Nature Son•1,100
    @NatureSon22

    The UI is fantastic! I'm impressed by its simplicity. You might find it helpful to learn about localStorage. It allows you to store data that remains saved on the user's device only. For instance, imagine you have a task list. By employing localStorage, you can save the user's tasks, enabling them to access the list whenever they wish.

    Marked as helpful

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord