This is a React.js app implementing a simple ToDo app functionality with smooth animations and mobile like behavior. Also has an Apple style buttons icons. Used framer motion library for swipe like behavior and animations. Built with TypeScript.
The app is live here!
- React.js TypeScript
- Framer Motion for animations and swipe like behavior.
- React Router v6 for basic routing.
- TailwindCSS for all styles colors and sizes.
- Styled Components for custom components.
- Macro Twin to combine both tailwindCSS and Styled Components.
- Radix UI Components completely unstyled and full accessible components.
- React Icons for menu icons.
- Unsplash API for a random nature photo in the header.
- Axios to fetch data from unsplash API.
- Add/Edit Task.
- Delete Task swiping left holding the task item.
- Localstorage to save task list.
- Mark todo as completed with a beatiful animation and strikethrough.
- Dark mode, using tailwindCSS darkmode and localstorage.
- Mobile like menu, opening bu swiping right , and closing by swiping left.
- Fetching a random photo from Unsplash API and display it in the header.