Community Garden

Plant homepage displaying your current plant, as well as links to the community garden and tasks.
Community page, where all registered users' plants will be shown in a grid.
Other users are also visible, which can be scaled to a community (or global) level.

Inspiration

Our group wanted to promote healthy and positive habits and foster community growth here at KU!

What it does

Create an account to get a unique plant! This plant grows as you complete various positive tasks, such as volunteering for a local organization or complimenting someone in a random act of kindness. See other plants in a garden by going to the "/garden" page of the website. This garden shows all the different plants of the community, and clicking on their username will bring you to their plant. You can also visit other people's gardens by visiting "/garden/". To see what their plant looks like. Plants are also open-requestable as an API at "/gardenplant/" in the form of an L-system string.

How we built it

We used a MongoDB Atlas backend to store all the user and plant data, with a Flask server to handle API calls and serve the client HTML. Moreover, the client uses p5.js to render the L-system-generated plants to the client.

Challenges we ran into

User authentication and JSON web tokens via Flask were a pretty decent obstacle, as was figuring out how to draw plants to the screen using p5. Additionally, working between the client, server, and database required a lot of orchestration and planning on the backend.

Accomplishments that we're proud of

Dellie: Proud of the user authentication system and MongoDB backend! Dylan: Proud of the L-system interactions with Flask!

What we learned

We learned a lot about user authentication with databases and how it can be worked into Flask web apps. We also learned about L-systems and how they can be used to generate plants based on string rules.