This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend
What I Built
I built Cat-a-log, a cat-themed to-do application for a friend who absolutely loves cats. 🐱
They wanted something simple to keep track of everyday tasks, but I didn't want to build just another boring checklist.
So I thought: why not make a to-do app that actually feels like something they'd enjoy using?
That's how Cat-a-log came to life.
It lets them:
✅ Create, edit, and delete tasks
⏰ Set deadlines and track the remaining time
📊 See their progress through a visual pie chart
🌙 Switch between light and dark mode
📱 Use it across desktop and mobile
🐱 Unlock a spinning cat after completing tasks
The spinning cat started as a fun little idea, but it became the personality of the whole project. Instead of simply checking off another task, there's a tiny cat waiting as a reward for getting things done.
The goal was simple: build something useful for my friend, but make it feel like it was made specifically for them.
Demo
🎥 Live Demo:
Code
💻 GitHub:
Ayushjhawar8
/
Cat-a-Log
Cat-a-Log is a dynamic and feature-rich to-do application designed to help you manage your tasks efficiently
Cat-a-Log
Cat-a-Log is not just a to-do application—it's your purr-sonal assistant for task management, now with a delightful surprise! Along with efficient task tracking, customizable themes, and visual insights, we’ve added an easter egg that’s sure to make you smile: a spinning cat inspired by the viral video Spinning Cat.
Features
- Task Management: Create, edit, and delete tasks effortlessly.
- Set Deadlines: Assign deadlines to tasks and track how much time remains in real time.
- Dark/Light Mode: Toggle between dark and light themes to suit your preferences.
-
Progress Visualization: A pie chart provides an at-a-glance view of
- Completed tasks
- Remaining tasks
- Expired tasks
- Responsive Design: Fully functional across devices, from desktops to mobile phones.
Technologies Used
- Frontend: HTML, CSS, JavaScript
- Visualization: Chart.js
- Theme Toggle: CSS Variables and JavaScript
How to Use
- Clone the repository:
git clone https://github.com/Ayushjhawar8/Cat-a-Log
- Install the dependencies:
cd Cat-a-Log …How I Built It
Cat-a-log is a lightweight web application built using:
HTML — application structure
CSS — styling, responsive design, and themes
JavaScript — task management and application logic
Chart.js — progress visualization
The application keeps track of tasks, deadlines, completed tasks, remaining tasks, and expired tasks, and presents that information through a simple dashboard.
I also added light/dark mode using CSS variables and JavaScript so the experience can be customized depending on the user's preference.
And, of course, there's the cat. 🐈
Complete your tasks and you get a spinning cat as a little celebration.
Why Does Open Innovation Matter?
I wanted the project to be something I could experiment with and continue extending, rather than being completely dependent on a closed system.
Using open technology gives me the freedom to experiment, modify the experience, and potentially swap or change the underlying AI components as the project evolves.
For a small personal project like Cat-a-log, that flexibility matters because the goal isn't just to ship something once. It's to be able to keep playing with the idea and make it better for the person it was built for.
Prize Categories
Best Use of GitHub Copilot, Best Use of Gemma
Why Cat-a-log?
There are plenty of to-do apps already.
But this one wasn't built because the world needed another to-do list.
It was built because a friend loves cats. 🐱
And sometimes that's enough of a reason to build something.
Top comments (0)