Sharing is caring… Especially with code

Building a Full-Stack Marketplace in Flask + Flutter: A Hands-On Demo

Written by

This project started as my first attempt at building a Flutter app. I didn’t want something too trivial or too massive, so I went with a marketplace-style app — just complex enough to keep me learning without turning into a multi-year odyssey.

I’ll be honest: part of the motivation was to get something on GitHub that potential employers could see. I’m mostly a backend person (with a history in PHP), but lately I’ve been deepening my Python skills. Frontend isn’t my favorite, but hey, the app needed one. I looked at React Native but ended up picking Flutter for its single-codebase cross-platform capabilities — and because I didn’t want to touch anything as ancient as Apache Cordova (a.k.a. PhoneGap).

Verdict: Flutter is now my go-to for mobile app building.

What It Does

It’s a demo marketplace where people can list stuff they want to sell — title, description, price, location, category, and media (photos/videos). Basically, the kind of foundation you could extend into a real app.

The flow is simple:

  • Login screen with account creation option
  • Listings view with all posted items (with thumbnails if there’s a lead image)
  • Search by keyword, price range, category, and location
  • Profile editing because profiles rarely stay the same
  • Refresh button to pull updated listings from the API
  • Logout back to the login screen

If you open a listing you created, you can edit details, manage media, and even reorder photos/videos via drag-and-drop. Media opens in a gallery view for scrolling through items.

That’s the Flutter side.

The Tech Stack

Backend (Python + Flask)

  • Flask + SQLAlchemy + SQLite
  • JWT auth with bcrypt password hashing
  • RESTful endpoints for users, listings, and media
  • Rate limiting via Flask-Limiter
  • Modular blueprint routing
  • .env configuration support
  • Scripts for DB creation and optional seeding

Frontend (Flutter)

  • Responsive UI (tested on Web + Windows)
  • User authentication (register/login/logout/delete)
  • Browse listings with thumbnails
  • Search/filter by multiple fields
  • View images/videos with playback controls
  • Create/edit/delete (owner only)
  • Upload/delete/reorder media
  • Profile editing
  • Auth guards + validation

Lessons Learned

This was my crash course in Flutter’s widget-based architecture and the Dart language (which honestly feels like C/C++ in disguise). I wrangled with the navigation stack (push/pop), AppBars, theming, state management, and Futures vs async.

The hardest part? Implementing media reordering and the gallery view.

I skipped pagination and stuck with an “oldest-to-newest” listing order — because the goal was an MVP, not a fully-fledged product.

I also skipped refresh tokens and persistent logins (that’s planned for another project, which will also support “log out all devices” via Firebase Cloud Messaging).

Would I do anything differently? Not really. It’s a first attempt, so I’m sure there are code style issues by Flutter/Dart purist standards — but it works, and that’s what counts.

📂 Repo: flutter-flask-marketplace

Leave a Reply

Your email address will not be published. Required fields are marked *