Photo Upload Service with Python FastAPI, S3, Postgres, React JS & Chakra UI

Let’s build an image upload service with Python Fast API, React JS, Chakra UI, PostgreSQL, Docker and AWS S3!

In this tutorial you will learn about a very common technique used to store images in web applications. The image itself is stored in AWS S3, which is a file storage system and the URL is stored in a PostgreSQL database. This way, you store the image perfectly without much compression. At the same time your database does not take too much space because you don’t have to store the image as a Binary object.

For the frontend we use React JS and Chakra UI as a UI framework to avoid writing any raw CSS.

In terms of database, we are going to use a simple PostgreSQL running locally on our machine.

The backend framework will be FastAPI which is an amazing Python backend framework that’s really fast and gives you amazing documentation automatically!

0:00 Intro
0:30 Demo
2:55 Database Setup
6:40 Backend Python FastAPI
16:40 Store Image in S3
18:55 Store URL in PostgreSQL
23:16 Start ReactJS Dev
25:15 Support CORs in Backend
27:22 Frontend Continued
31:13 Connect Frontend & Backend
41:12 Final Demo!
44:40 Summary & Outro

#python #tutorial #postgres #reactjs #chakraui #appbuild #programming #docker #s3 #aws

Backend Code: [https://github.com/irtiza07/photo-upload-full-stack/tree/master/backend](https://github.com/irtiza07/photo-upload-full-stack/tree/master/backend)

Frontend Code: [https://github.com/irtiza07/photo-upload-service](https://github.com/irtiza07/photo-upload-service)

Visit me at: https://irtizahafiz.com

Reach me at: [email protected]