DEV Community

Cover image for SkyGreen: Your Flight's Carbon Footprint Calculator
BinaryGarge.dev
BinaryGarge.dev Subscriber

Posted on

5 3 4 2 3

SkyGreen: Your Flight's Carbon Footprint Calculator

This is a submission for the GitHub Copilot Challenge : Fresh Starts

What I Built

SkyGreen is a web application that empowers users to calculate and understand the carbon footprint of their flights. By providing flight details such as origin, destination, number of passengers, cabin class, and aircraft type, users can quickly estimate the CO2 emissions associated with their travel.

Demo

https://flight-carbon-calculator.onrender.com/

Image description

Repo

https://github.com/binarygaragedev/fcc

Copilot Experience

I leveraged Copilot's AI-powered code completion and generation capabilities extensively while building SkyGreen. Some key ways Copilot assisted me:

Code Autocomplete:

As I started typing code, Copilot provided intelligent autocomplete suggestions based on the context. This saved time and reduced typos.
It accurately suggested variable names, function calls, and commonly used patterns, maintaining consistency with my coding style.

Generating Code Snippets:

When I needed to implement certain functionalities, I provided Copilot with concise natural language descriptions or comments.
Copilot generated relevant code snippets based on my prompts, often providing multiple variations to choose from.
For example, when creating the flight distance calculation, I described the Haversine formula and Copilot generated the corresponding JavaScript implementation.

Editing and Refactoring:

Copilot assisted in editing and refactoring code by suggesting improvements and optimizations.
It identified potential bugs, security vulnerabilities, and performance issues, providing fixes and best practices.
When I needed to update the UI components, Copilot offered suggestions to streamline the JSX code and apply appropriate styling classes.

Contextual Understanding:

Copilot demonstrated strong contextual understanding of the project's requirements and dependencies.
It provided recommendations that aligned with the React framework, Tailwind CSS utility classes, and the data structures used in the app.
Copilot's suggestions took into account the existing code base, ensuring consistency and compatibility.

Chat and Collaboration:

I engaged in conversations with Copilot using natural language to discuss implementation approaches, clarify requirements, and brainstorm ideas.
Copilot provided thoughtful responses, code examples, and explanations to guide me in making informed decisions.
It acted as a knowledgeable coding assistant, offering insights and best practices throughout the development process.

Data Gathering for Aircrafts and Airports:

Copilot played a crucial role in gathering data about various aircraft types and airports worldwide.
When I needed information about specific aircraft models, Copilot provided detailed data such as emission factors, seating configurations, and fuel efficiency.
It assisted in compiling a comprehensive list of airports, including their IATA codes, cities, countries, and geographical coordinates.
Copilot's vast knowledge base and ability to retrieve relevant information greatly simplified the process of collecting and integrating accurate data into the SkyGreen app.

UI/UX design

As a backend developer, designing user interfaces has always been a challenge for me. However, GitHub Copilot's AI-powered code generation capabilities revolutionized my workflow and made UI development a breeze. With Copilot, I could simply describe how I wanted the user interface to look and function using natural language, and it would generate the corresponding code for me. For example, when I needed a form for users to input their flight details, I described the layout, input fields, and styling preferences to Copilot. It then generated clean and semantic HTML markup, complete with Tailwind CSS utility classes for styling. Copilot's ability to understand my natural language descriptions and translate them into functional UI components saved me countless hours of struggling with frontend code. It allowed me to focus on the backend logic and data processing while still delivering a polished and user-friendly interface. Copilot's assistance in UI development was a game-changer, empowering me as a backend developer to create visually appealing and intuitive user experiences with ease.

GitHub Models

I haven't use any GitHub models

Conclusion

Overall, GitHub Copilot was an invaluable tool throughout the development of SkyGreen. It accelerated the coding process, provided intelligent suggestions, and acted as a knowledgeable coding assistant. Copilot's contextual understanding, code generation capabilities, and collaborative features greatly enhanced my productivity and code quality. It allowed me to focus on the high-level design and user experience while efficiently handling the implementation details.

Sentry blog image

How to reduce TTFB

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

In this article, we’ll see how we can identify what makes our TTFB high so we can fix it.

Read more

Top comments (0)

Cloudinary image

Video API: manage, encode, and optimize for any device, channel or network condition. Deliver branded video experiences in minutes and get deep engagement insights.

Learn more

👋 Kindness is contagious

Discover a treasure trove of wisdom within this insightful piece, highly respected in the nurturing DEV Community enviroment. Developers, whether novice or expert, are encouraged to participate and add to our shared knowledge basin.

A simple "thank you" can illuminate someone's day. Express your appreciation in the comments section!

On DEV, sharing ideas smoothens our journey and strengthens our community ties. Learn something useful? Offering a quick thanks to the author is deeply appreciated.

Okay