DEV Community

Muhammad Irfan Hassan
Muhammad Irfan Hassan

Posted on

1

NextStep: Habit Tracker Built with GitHub Copilot

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

What I Built

NextStep is a habit builder and tracker web application designed to help users develop and maintain positive habits.

Key Features:

  • Add Habits: Users can input their desired habits.
  • Customize Days: Select specific days of the week to practice each habit.
  • Track Progress: A visually appealing tracker graph allows users to monitor their progress by marking completed tasks.
  • Maintain Streaks: The app encourages consistency with streak tracking to keep users motivated.

The project aims to simplify habit tracking, making it engaging and effective for individuals aiming to build better habits.


Demo

Video Demo: NextStep Demo

Screenshots:

Dashboard View of NextStep

Add Habit Interface

Progress Tracker


Repo

GitHub Repository: NextStep


Copilot Experience

GitHub Copilot played an instrumental role in building NextStep, enhancing both frontend and backend development:

Frontend Development:

  • Code Assistance: Writing and editing code in Visual Studio was seamless with Copilot’s contextual suggestions.
  • Inline Chat: This feature allowed direct communication with Copilot in the IDE, enabling quick solutions and avoiding the need to switch between tools.
  • Workspace-Wide Changes: Using the “workspace” tag, I was able to modify multiple files simultaneously, saving hours of manual adjustments.
  • Overall Impact: Copilot made frontend development faster and more efficient, allowing me to focus on creating an intuitive user interface.

Backend Development:

  • Database Integration: Copilot provided accurate suggestions for integrating PostgreSQL with Flask, ensuring secure and efficient database operations.
  • Code Optimization: It streamlined repetitive tasks like table creation, CRUD operations, and validations, reducing boilerplate code.
  • Error Handling: Copilot’s real-time debugging tips helped resolve issues quickly, ensuring smoother development.
  • Inline Chat for Backend: The inline chat feature was invaluable in clarifying backend logic and modifying code efficiently.
  • Overall Impact: Copilot significantly improved backend development by offering reliable recommendations and saving development time.

Suggested Improvements:

  • When modifying specific portions of code, it would be ideal if Copilot focused solely on the selected part to avoid unnecessary changes.

GitHub Models

I did not use GitHub Models for this project.


Conclusion

Building NextStep was an exciting journey, and GitHub Copilot proved to be an exceptional assistant throughout the process. It saved time, enhanced productivity, and improved the overall quality of the code.

Team Member: Sana Rahman

Thank you for this opportunity to showcase our project and explore the possibilities with GitHub Copilot!


Reinvent your career. Join DEV.

It takes one minute and is worth it for your career.

Get started

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay