DEV Community

Cover image for It's not a copilot it's a genie I never dreamt of!
Priyanka Shah
Priyanka Shah

Posted on

2 1 3 3 1

It's not a copilot it's a genie I never dreamt of!

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

What I Built

I built a creative productivity tool to create new year resolutions for each year, track them and celebrate their successful accomplishments. Add a badge to the completed ones.

Demo

Here's the link to my app: https://extraordinary-sfogliatella-4ec868.netlify.app/ For best experience, please open on your desktop.

Here's how my app took the shape:

1 - Initial brainstorming phase

Image description

2 - Somewhere in the middle

Image description

3 - Final App after 7 hours...

Image description

Repo

https://github.com/priyanka-hemant-shah/new-year-resolutions-tool

Copilot Experience

Although I am a skilled frontend web developer, this time I took a back seat in terms of coding and decided to let GitHub Copilot do all the technical hard work. I took the approach of bespoke app development. I neither went anywhere on the internet to brainstorm or find inspiration, nor did I do any prior research on the topic. Instead, I directly brainstormed along with Copilot via prompts and built the app as things progressed. I did some initial brainstorming with Copilot Chat using the GPT-4 model on what I wanted to build. Then, I created a starter app with CRA as guided by the model. I switched to Copilot Edits and the Claude Sonnet 3.5 for the next 80% of the app building. I visualized things and just prompted the model to build, and the super talented Copilot did that surprisingly well and quickly and was always open to feedback! For example, I asked to add an input in the center of the screen to add resolutions that would get added to a list below upon hitting the enter button on the keyboard. Then, I asked to refine the style in terms of size and border. Within just 7 hours, I was able to create a beautiful New Year Resolutions app to create new year resolutions for each year, track them, and celebrate their successful accomplishments with a confetti animation! I added a badge to the completed ones. I was also able to add a light and dark theme switcher and a music button in just the last few minutes! I did just 5% of the coding, and even in that, I got autocomplete suggestions!

Conclusion

My experience of working with the Copilot was mind-blowing! I always wanted to work with the best tech team and now I can say I have a coworker who has learned from the best ones in the World! This one-day dev challenge has turbo charged my speed in building apps with AI copilots and the process is so much fun. The journey has just begun!

API Trace View

How I Cut 22.3 Seconds Off an API Call with Sentry πŸ•’

Struggling with slow API calls? Dan Mindru walks through how he used Sentry's new Trace View feature to shave off 22.3 seconds from an API call.

Get a practical walkthrough of how to identify bottlenecks, split tasks into multiple parallel tasks, identify slow AI model calls, and more.

Read more β†’

Top comments (0)

Cloudinary image

Optimize, customize, deliver, manage and analyze your images.

Remove background in all your web images at the same time, use outpainting to expand images with matching content, remove objects via open-set object detection and fill, recolor, crop, resize... Discover these and hundreds more ways to manage your web images and videos on a scale.

Learn more

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay