Todo App

Next.js JAMstack hosted on Netlify.

Todo app frontend challenge from Frontend Mentor

Demo

Light Mode

Dark Mode

Features

• View the optimal layout for the app depending on their device's screen size
• See hover states for all interactive elements on the page
• Add new todos to the list
• Mark todos as complete
• Delete todos from the list
• Filter by all/active/complete todos
• Clear all completed todos
• Toggle light and dark mode
• Drag and drop to reorder items on the list

Technology Used

• Next.js
• tailwindcss
• Hosted on Netlify

Development

1. Clone repo

   git clone https://github.com/cloworm/todo
   

2. Install Dependencies

   npm i
   

3. Run the dev server

   npm run dev