dev-resources.site
for different kinds of informations.
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.
Repo
Want to see the code? The project repository is in GitHub which contains the HTML, CSS, and JavaScript scripts. Try it out yourself.
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.
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
- Clone the repository or download the source code.
- Open the
index.htmlfile in your web browser.
Usage
- Enter a task in the input field and click the "Add Task" button.
- For each task, you can add micro-tasks by entering a description and clicking the "Add Micro-Task" button.
- 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.
Featured ones: