Inspiration
As busy college students, we still have to worry about getting chores done around our houses and apartments. These include grocery shopping, laundry, washing the dishes, and more. With our hectic schedules, it's easy to forget tasks, so we decided a Simple Chore Tracker would be a great way to keep us organized and ensure nothing gets overlooked.
What it does
Our Simple Chore Tracker allows users to input household tasks and check them off as they complete them. It simplifies staying on top of chores like grocery shopping, laundry, and cleaning, helping you stay organized by tracking what’s done and what’s pending.
How we built it
We built the Simple Chore Tracker using HTML for structure, CSS for styling, and JavaScript for functionality. The HTML and CSS define the layout and appearance, while JavaScript handles adding tasks, marking them as completed, and storing data in local storage.
Challenges we ran into
A challenge we ran into was getting the html file and Javascript file to work together. We learned that the "src=" line allows us to connect the two files by adding the name of the Javascript file into the html file. Additionally, it was challenging figuring out how the different components of the website worked together on the Javascript file. However, we were able to code up a variety of different commands that allows for the Chore Tracker to work and be useful in organizing tasks.
Accomplishments that we're proud of
We are proud of building a functional, user-friendly chore tracking tool. We integrated HTML and JavaScript components, allowing users to manage their chores effectively. We implemented local storage so that chores remain even after refreshing the page, ensuring users don't lose their data.
What we learned
For some of the students in our group, it was the first time coding in Javascript and creating a website. Many of us learned the basic components of working with Javascript and better understood how it differs from other coding languages such as Python and Java. We learned what a Document Object Model(DOM) is and how to store tasks there. Other things we learned include Javascript Object Notation(JSON), using the innerHTML element property, and much more.
What's next for Chore Tracker
In the future, we plan to add the option of setting deadlines and sending reminders. Also, we intend to include an option that will organize the tasks depending on the user's preferences. With these additions, it will improve the user's experience as we continue to expand and enhance the functionality of Simple Chore Tracker.
Log in or sign up for Devpost to join the conversation.