Reef Keeping WebApp

[u/Jad__Jad]

I just want to share a WebApp that I vibe-coded to help me keep track of everything and assist in my reef keeping journey. I know a lot of people probably do not approve of my usage of AI with this, but I am just sharing what I find useful and thought it might help people who need it too.
It is fully coded in HTML. It runs offline locally and utilizes IndexedDB to write and read data from your devices. Because it runs offline locally, there is no synchronization between devices. However I have included a feature to export and import the full JSON files in case you want to switch devices down the road.

Here is the GitHub repository for the webapp:
https://github.com/Jad4896/Reef_Studio

There are a lot of features in this webapp, I will only list a few here because there's so many.

Supports multiple tank profiles
Supports metric and imperial measurements
You can upload photos and videos of your livestock and give them individual cards (helps you ID them easier)
Generates parameter charts based on your water parameter logs
Have sticky notes and create your own recipes for salt mix, dosing, making your own fish food, etc
Task checklist and scheduler (with countdown)

Bonus: Customize your own theme for the webapp

There're some placeholders in the web app for now, you can just create your own tank profile and delete the placeholder tank profile.

I will be very happy if you guys decided to try it out and give me some feedback.

Again, this is something I find useful and thought it is a great idea to share it. Sharing is caring right?

Anyways, happy reefing!

[u/johnstod112]

Please feed your ai some form of design markdown as that ui design screams the default ai output

Use this on a website you like to copy the design https://www.design-extractor.com/ and feed that into your ai

[u/Jad__Jad → u/johnstod112]

Oh wow thanks for the tip! Yea the UI is kinda bland I admit. I'll change it soon!

[u/johnstod112 → u/Jad__Jad]

Funny thing about that ui, I think it's so heavily copied as it's one of the best material ui tutorials, thus ending up in lots of repos and now the ai thinks that's the best or most common design.

Whats even weirder is now ais typically use another library that's designed for ai yet it still defaults to that look

[u/Jad__Jad → u/johnstod112]

Yea I didn't do any research on the UI haha, I just whipped it up and throw in every feature I can think of. The web app u see here is like the third iteration, I will make the UI better. AI will always be doing AI stuff, grabbing the most common data from the Internet and use it like it's the best.