Making Froto

home

ยท Seattle

Over a few days, I tried to speed-run getting a fully functional social media app working. I planned out my simple architecture, and got to work.

So far, the basics work, and I hope to expand it over time and drastically improve the performance. I tried out some tech that I had never used before to learn some new things, and used some bad practices that I didn’t notice until I actually tried deploying.

I’m not too worried about the bad practices, as I’ve decided to take a slow approach to tweaking the site to basically become a photo portfolio for anybody. In free time, I hope to clean things up.

Overall, this was an awesome learning experience. I got more comfortable with various backend workflows alongside React, and tested out a few different pieces of tech that I was interested in.

The biggest takeaway from this project has been to keep things simple. It is very easy to quickly jump in and end up over-engineering everything rather than thinking things out for twice as long and saving yourself from a mess.

Regarding technical mistakes, I started the project with everything using a NoSQL setup due to the overall simplicity, which was likely the wrong route for my end goal. The schemas can be optimized in many ways though, so NoSQL isn’t necessarily the problem. It does hurt the possibility for some future capabilities though.

Additionally, none of the images are optimized and are served as the upload size. This is an easier fix, though a bit trickier than I had expected from basic aspect ratio, loading issues, or framework styling quirks.

The final issue was that I never tested a production build while developing. When the site felt finished, I built it and it broke everywhere. I fixed a ton of things to make it build, but by then I realized just how much slower it is when on production deployed.

Future solution

Luckily, speeding up the site shouldn’t be too difficult:

  • Slow down and draw out the database requirements, making a well thought out solution.
  • Clean up some API logic to help this new setup thrive.
  • Optimize images and loading states to make the site feel polished.

Update

I ended up shutting down the site after 6 months. During my speed-run, I cut some corners using the wrong tools for longevity of the project. This ended up being expensive to maintain on a Vercel free plan due to the image optimizations, and I didn’t want to pay anything to host this site. In the future I want to do things the right way with everything I’ve learned.