Inspiration

Having an environmental theme was an exciting opportunity for us because there were so many possibilities we could explore, and in all, we could take pride in the fact that we were building something impactful. Given such a broad theme, we started with several ideas and eventually worked our way to where we are now. Our initial thought was to use an API to build a site that allows you to track the carbon footprint of a certain food/product as well as that of the company (if applicable). However, after an extensive amount of time researching different APIs, we ultimately had to work with the resources available to us, which meant altering the plan. Fortunately, we found a free API that allows us to track the carbon footprint of certain cars, public transit methods, flights, energy sources, food categories, and fuel. From there we started building and slowly our ideas worked themselves out into a website. We all put a lot of effort and thought into the site, and after many hours of work, and a few hours of sleep, we came to a stopping point. We are proud of what we were able to accomplish in the given time, but most importantly we were glad to take part in this event to build on our knowledge together.

What it does

Carbon Calculator was built to help everyday people see how much they are contributing to climate change. While it may not be as significant as huge corporations, it still is important for all of us to be aware of how we can best cut emissions. Using our calculator, you can calculate your CO2e, or carbon dioxide equivalent for everyday activities. For example, if I was going to travel to another country, I could enter the plane type and length, the food I ate on the plane, and the two taxi trips to and from the airport. After entering these values, I would know my carbon dioxide equivalent, as well as how many dead trees that equate to. If you felt that that number was too high, you could move to our carbon offset page, where you can calculate how effective different eco-friendly strategies are and discover charities to increase your carbon offset.

How we built it

We put together our project using vscode, HTML, tailwind CSS, and vanilla js. We began by connecting the API to our code and doing simple calculations. After we had the API all set up, we began using the data to make it clearer for the average user. We converted the CO2e in Kg to an average number of trees killed and compared it to other similar calculations. We also wanted to add the severity of the user’s carbon footprint by comparing the worst and best scenarios. To do this, we took the least impactful and most impactful element of each category and collected for the first 10 units of measurement. For example, the Large Petrol Car has the highest carbon footprint per mile driven and the Medium Hybrid Car has the lowest. For each, we collected their footprints for the first 10 miles. We then graphed those data points and used them to create lines of best fit. We used that information as a comparison for worst and best-case scenarios. If the user’s input leaned more towards the higher end of the spectrum, they would have a higher severity rating. After we had finished the carbon calculator portion of our project, we moved on to our second page, carbon offset. For carbon offset, we gathered the data ourselves as there was no good API or database already out there that fit our needs. We also researched reputable charities that can help increase your carbon offset.

Challenges we ran into

Finding free APIs with enough calls to work with isn’t easy, but we got there eventually. However, we did run out of calls several times because they were limited to 100 per month. Every time this happened, we had to make a new account, but after a while, it became more of a minor inconvenience. Finding APIs wasn't the only difficult thing, as we had to research a lot and get data from many different websites, which was very hard to find. We were also all new to Tailwind CSS so it took us time to format everything properly for both mobile and desktop, and style everything to our liking.

Accomplishments that we're proud of

We are proud that we were able to properly implement and use our API, as it had no good documentation or information. Tailwind CSS was also fairly new to all of us, however, we all got the hang of it fairly quickly and built our knowledge as we progressed. On top of that, we were proud to have finished the website in the given time. 2 of us had little experience building websites, but we still managed to keep up and contribute to the project. In all, we were proud of how much we learned and stepped outside of our comfort zone to try something new.

What we learned

Our whole team was inexperienced with Tailwind CSS, but we all picked it up fairly quickly. We learned a lot of new styling and formatting tricks that helped us along the way. We also did not have lots of experience working with APIs, JSON, and other data, but just like Tailwind, we all picked it up fairly quickly and were able to do everything necessary for the project.

What's next for Carbon Calculator

Our web app has two different options for the future. We could optimize our website for the average user, making everything more simplified and having more day-to-day experiences. We could also make our website for corporations to calculate their carbon emissions from large shipments, construction, and energy usage, and help cut CO2e at a massive scale. While creating our platform for large corporations might have a better impact on the environment, there are other programs just like that, and we want to be original. In the future, we will make our platform easier to use for someone with less experience with technology.

Built With

Share this project:

Updates

Submission history