๐Ÿ›’ ShopSmart

Full-Stack App ยท React + FastAPI + Azure

Build your basket. Find the cheapest store.

ShopSmart helps you find the best prices across supermarkets. Add items to your shopping list, compare prices store by store, and let it automatically identify the cheapest store for your whole basket.

Price comparison
Tap items to add them to your basket โ€” the cheapest store updates live.

โ†‘ A scripted illustration โ€” store names and prices are sample data.

01 โ€” Features

Everything you need for a cheaper shop.

๐Ÿ“

Shopping list

Add items with autocomplete and manage your whole list in one place.

๐Ÿช

Multi-store comparison

Compare item prices across multiple supermarkets side by side.

๐Ÿ’ธ

Best-price finder

Automatically identifies the cheapest store for your basket.

๐Ÿ’พ

Persistent state

Your list survives page navigation and browser sessions.

๐Ÿ”

Authentication

Sign up and log in to keep your lists private.

๐Ÿ“ฑ

Responsive

Works on desktop and mobile alike.

02 โ€” Architecture

A containerised full-stack app on Azure.

A React/Vite frontend (served by Nginx) talks to a FastAPI backend, which persists to PostgreSQL โ€” all containerised and deployed on Azure App Service with CI/CD.

React + Vite
Nginx ยท Azure
โ†’
FastAPI
Azure App Svc
โ†’
PostgreSQL
Azure Flexible

03 โ€” Stack

Built with.

Frontend

  • React 18 + Vite
  • React Router
  • Custom CSS
  • Nginx (prod)

Backend

  • FastAPI (Python 3.11)
  • SQLAlchemy ORM
  • Alembic migrations
  • PostgreSQL

DevOps

  • Docker + ACR
  • GitHub Actions CI/CD
  • Azure App Service
  • Application Insights