Image Uploader - React, Supabase

Live Demo on Render

Code on Github

This is a solution to a challenge on devChallenges. I built this using:

It’s the first time I’ve made a :v: fullstack :v: app, so I’d love to know what I can improve on and what is the standard way to structure a project. My approach is basically this:

  • I have a client dir which I use Vite to initialize, and a server that contains API logics, so all frontend libraries are included in /client/package.json while all backend libs are in /package.json.
  • In developing, client will fetch from server (2 different servers, use proxy to not get CORS error)
  • When deploying, the dist folder built from client will be served by server as static files. (1 server). Then just start server and I got a live working site.

At first I was using Postgres and I was going to host this on Firebase. But it seems like there isn’t really a way to put a Postgres database on Firebase?? So I opted for Supabase and basically had to change all my Postgres queries to Supabase syntax. I’m still not really sure how one would deploy a frontend and backend together in real life?? This solution is just me powering through a tunnel with one eye closed.

Any feedback on the React and styling part would also be welcomed!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.