Demo dashboard: feel free to edit anything. All data resets every night at 03:05 (Europe/Bratislava time).

A stock dashboard for a clothing shop, built while learning its stack

Modern Fashion Store is a demo for a shop manager: keep the catalogue up to date, see what sells, and watch changes made by other people appear without reloading. It's a portfolio project, so the products, prices and sales are made up.

A red hang tag: Modern Fashion Store, manager dashboard, a demo that resets nightly at 03:05 Europe/Bratislava time. Modern Fashion Store Manager dashboard Demo Resets nightly at 03:05 Europe/Bratislava time

Where it comes from

  1. A take-home task

    This started as a take-home assignment in a job application. The brief asked for a manager dashboard in Elixir with the Phoenix framework, Tailwind and PostgreSQL, a stack I had never worked with. I learned Phoenix and LiveView while building it, completed both required tasks and all four optional ones, and deployed it to my own server as a bonus. The point was to show how quickly I can get productive in an unfamiliar stack while keeping the code clean.

  2. Upgrade and self-hosting

    I brought it up to date with the latest Elixir, Phoenix, LiveView and Tailwind, packaged it as a Docker release, hardened it for public visitors and moved it to my home server, where it runs next to my other demo projects.

The assignment

  1. Task 1: Product dashboard Required

    Add, edit and delete products with photo, title, description, category, price and stock, and filter the list.

    See it: Product dashboard
  2. Task 2: Inventory, transactions and statistics Required

    Stock levels, every transaction with a month filter, and the best-selling products.

    See it: Inventory, transactions and statistics
  3. Task 3: Login Optional

    Every dashboard page sits behind a login. Registration is closed: the demo uses one shared account.

    See it: Login
  4. Task 4: Live feed Optional

    Changes made by one visitor appear for everyone else straight away, using Phoenix PubSub.

    See it: Live feed
  5. Task 5: Tags Optional

    Products can carry several tags instead of a single category.

    See it: Tags
  6. Task 6: Tag filter Optional

    Filter by any combination of tags, together with the other filters.

    See it: Tag filter

Things to try

  1. Open the dashboard in two browser windows, change a product in one and watch the other update.
  2. Combine the tag, price and availability filters on the inventory.
  3. Pick a month on Transactions, then see what sold best on Statistics.
  4. Add a product of your own, with a photo from Pexels or Unsplash.

How this demo works

  • Everyone uses the same demo account.
  • All changes are wiped every night at 03:05 (Europe/Bratislava time).
  • The account's e-mail and password can't be changed.
  • No e-mails are sent.
  • Photos can only come from Pexels, Unsplash or the built-in images.
  • Please don't enter anything personal.

Built with

Backend
Elixir 1.20.4 on Erlang/OTP 29
Phoenix 1.8.15
Phoenix LiveView 1.2.12
Ecto 3.14.0
Database
PostgreSQL 18.6
Frontend
HEEx templates
Tailwind CSS 4.3.3
Heroicons
Hosting
Docker (mix release)
nginx
Tailscale Funnel
Bandit 1.12.5 web server

Made by

Ákos Kappel

I build web applications end to end, from the database to the deployment.