Bloomback

Inspiration- We wanted to make something for the environment because who doesn't love the environment, but also romance themed for Valentine's Day. I also wanted something I could use for my girlfriend to show why I was away on Valentine's Day. Long Story short we came up with something innovative and hopefully brings a smile to peoples face while also saving our planet (conceptually).

What it does- The website's purpose is to send someone a digitalized pixel art of a bouquet, store a picture of the user's choosing, and show where a tree was planted on the planet for them creating a bloom. The user is able to create an account to see all of the blooms they have created and sent. The user also finds information about our mission on the website. You are able to share the website via copy link, email, or text message. You are also able to see on Google Maps where your tree was planted.

How we built it- We began by using generative AI to rapidly prototype the frontend structure. From there, we organized the project using Vite and React with TypeScript, integrated Supabase for backend services including authentication and database operations, and configured row-level security policies.

Development and testing were handled locally in VS Code using npm for dependency management and build scripts (npm run dev, npm run build). The final optimized static build was deployed to Netlify for hosting.

Challenges we ran into- At first when trying to implement Supabase, we kept running into an error trying to create/send a bloom when logged into an account. It was only when we realized we had to updated the project’s public anon key so the frontend was securely connected to our specific Supabase instance. We then configured the database directly through Supabase’s SQL editor to set up the blooms table and enable authentication-based permissions. This allowed users to create and send blooms only when logged in. This was such a breakthrough for us because we were stuck trying to figure it out for a while. We had a similar problem when it came to emails, but figured it out a lot quicker because we had already solved a situation that was similar.

Accomplishments that we're proud of- The breakthrough we had on the Supabase set up made us all very happy and proud. Overall we are very proud of the finished outcome because as much as we had help from gen AI a lot of the process was us tinkering and figuring out the little kinks throughout the process. We are also proud of the fact that it is very love themed and that we could make something that in theory would be very amazing for our environment

What we learned- We learned a lot about databases and how they work. We learned a ton about building scripts and using so many different kinds of code and solving all types of problems. Being a computer science student so much is done in Java, Python, and C however we accomplished so much using other forms of coding and it really was a good experience to learn from.

What's next for Bloomback- We pitch it to a nonprofit or anyone who would like the idea. In all seriousness we would love to expand the concept into something more serious. Of course everything in the real world has a cost so we could add a payment method for those that would like to monetize it. Other than that we really just are very glad to have a time and place that we could show off our skills and make something fun and awesome.

Built With

• api
• chatgpt
• css
• figma
• git
• github
• google-maps
• html
• json
• netify
• node.js
• react
• sql
• supabase
• tailwind
• typescript
• visual-studio
• vite