Logo

dev-resources.site

for different kinds of informations.

Boost Your Productivity with Momentum Builder: A Web App to Overcome Procrastination and Track Progress

Published at
1/15/2025
Categories
devchallenge
githubchallenge
webdev
ai
Author
terieyenike
Author
11 person written this
terieyenike
open
Boost Your Productivity with Momentum Builder: A Web App to Overcome Procrastination and Track Progress

This is a submission for the GitHub Copilot Challenge : New Beginnings

What I Built

The momentum builder app's concept uses the Pomodoro technique. This technique lets you engage in deep work and remain focused. At the end of your work, it alerts you to take a break. In addition, the application keeps track of your tasks, allows you to overcome procrastination, and provides a motivational quote.

Demo

The application is hosted on Vercel which is available via this public URL. Here is a screenshot of the demo app which uses local storage to persist the stored data.

momentum builder demo

Repo

Want to see the code? The project repository is in GitHub which contains the HTML, CSS, and JavaScript scripts. Try it out yourself.

GitHub logo Terieyenike / momentum_builder

Momentum Builder is a web application designed to help users overcome procrastination and provide motivational nudges. The app encourages consistency by tracking streaks and displaying progress reminders.

Momentum Builder

Momentum Builder is a web application designed to help users overcome procrastination and provide motivational nudges. The app encourages consistency by tracking streaks and displaying progress reminders.

momentum builder demo

Features

  • Add tasks
  • Set timers for tasks
  • Receive motivational quotes and progress reminders
  • Track and display streaks to encourage consistency
  • Display error messages when a timer is already running for another task
  • Automatically clear error messages and input fields after a few seconds

Getting Started

Prerequisites

To run this application, you need a web browser that supports HTML, CSS, and JavaScript.

Installation

  1. Clone the repository or download the source code.
  2. Open the index.html file in your web browser.

Usage

  1. Enter a task in the input field and click the "Add Task" button.
  2. For each task, you can add micro-tasks by entering a description and clicking the "Add Micro-Task" button.
  3. Set a timer for each task or micro-task by entering the number…

Copilot Experience

Since I have some experience using prompts to query the LLM capability to produce resulting code and developed a snake game with Python in the past, using the embedded model was not strange to me.

  • Prompts: My prompts centered around tweaking the responses for the code and I ensured it aligned with the end goal while checking the functionality of the app on the live server so it meets my expectation
  • Edits: GitHub Copilot did an awesome job suggesting possible solutions and making meaningful edits appropriately and timely. The model intelligence remembering previous input and generating code was a breeze. There is no doubt of its efficiency.
  • Chat: I found the chat feature to be a lifesaver for improving the codebase. Deleting the previous result and starting on a clean slate made it superb
  • Model switcher: I tried and switched between the models to experiment with different results.
  • Voice: This feature helped me to ask for the possible article title idea for this blog

GitHub Models

For context, the models gave me a quicker way to speed up my development process in creating the workflow from the header to the footer. The model handled the responsiveness, functionality, and the app's building blocks well enough.

Conclusion

The brainstorming capacity of GitHub Copilot helps you debug, explain parts of your code that you find tricky, and offer solutions to fix which makes it a great buddy assistant to rely on. I found this task of building the momentum builder app exciting as Copilot intelligently suggested and pointed out several ways to improve the codebase, and also not without the additional fixes by a human to make sure it meets the standard of a fully developed and deployable app.

ai Article's
30 articles in total
Artificial Intelligence (AI) focuses on creating intelligent systems that can simulate human thinking and automate decision-making processes.
Favicon
Join us for the Agent.ai Challenge: $10,000 in Prizes!
Favicon
Can I build & market a SaaS app to $100 in 1 month?
Favicon
🚨 The Dangers of Developers Relying Exclusively on AI Without Understanding Fundamental Concepts
Favicon
Announcing Powerful Devs Conference + Hack Together 2025
Favicon
Build Your First AI Application Using LlamaIndex!
Favicon
Designing for developers means designing for LLMs too
Favicon
Daily.dev's unethical software design
Favicon
Teaching Large Language Models (LLMs) to do Math Correctly
Favicon
Boost Your Productivity with Momentum Builder: A Web App to Overcome Procrastination and Track Progress
Favicon
When AI Fails, Good Documentation Saves the Day πŸ€–πŸ“š
Favicon
The Language Server Protocol - Building DBChat (Part 5)
Favicon
πŸ“βœ¨ClearText
Favicon
Habit Tracker: A Web Application to Track Your Daily Habits
Favicon
Impostor syndrome website: Copilot 1-Day Build Challenge
Favicon
How to Get the Most out of Cursor
Favicon
The Frontier of Visual AI in Medical Imaging
Favicon
5 cool things from CES for Amazon Developers (plus 4 more!)
Favicon
5 Free AI Design Tools For Designers!
Favicon
Artificial Neurons: The Heart of AI
Favicon
Amazon Product Finder
Favicon
3D models from images with local AI
Favicon
How RAG works? Retrieval Augmented Generation Explained
Favicon
The AI Advantage: Enhancing Customer Engagement through CRM
Favicon
AI-Powered Lockscreen: The Future of Mobile Intelligence Is Already Here
Favicon
POST ABOUT AI'S INCREASING INFLUENCE IN CODING
Favicon
Evolution By Sound
Favicon
Binary classification with Machine Learning: Neural Networks for classifying Chihuahuas and Muffins
Favicon
Weekly Planner - API
Favicon
Flow Networks Breakthrough: New Theory Shows Promise for Machine Learning Structure Discovery
Favicon
Breakthrough: Privacy-First AI Splits Tasks Across Devices to Match Central Model Performance

Featured ones: