Colorful Days is an online calendar that stands out with customizable themes, seamless multi-user collaboration, and intuitive user interface. It makes planning visually appealing and enables users to share plans or discuss upcoming events all in one single calendar.
- Built the calendar layout, including monthly and weekly view, and handled rendering of events without reliance on external calendar libraries
- Applied
Firebase Cloud Firestorefor data management and real-time data updates,Firebase Authenticationfor member system, andFirebase Hostingfor deployment of react app - Utilized
Tailwind CSSandNextUIto apply RWD and create a vibrant user interface with rich color palettes rapidly - Managed global states with
Zustand, saving time on creating complicated boilerplate - Achieved drag-and-drop feature for event scheduling with
dnd kit - Created card flip animation with
Framer Motion
- React
- Vite
- TypeScript
- Tailwind CSS
- Firebase
- ESLint
- zustand
- dnd-kit
- framer-motion
- react-hook-form
- react-datepicker
- Website
- Test account
- Email: user01@gmail.com
- Password: colorfuldays2023
-
Personalization｜ Name the calendar and select one theme color upon registration
-
Event Management｜Add detailed events with options for dates, times, tags, and notes; edit as needed
-
Flexible Views｜Switch seamlessly between monthly and weekly views for better planning
-
Notes for Plans｜Add memos for tentative plans not yet scheduled
-
Multiple Calendars｜Create and manage different calendars for varied aspects of life
-
Collaboration｜Share calendars with friends, family, or colleagues and plan together
-
Event Filtering｜Organize schedule with tags, making finding events easier
-
Interactive Scheduling｜Events are draggable, making events adjustment simpler
