Jean-Luc Makiola
ee3b6f74e3
- Two-row sticky toolbar: search input + view toggle (Row 1), tag/weight/price filter pills (Row 2) - Tag filter popover with click-outside close via useRef/useEffect - Weight and price range filter popovers with min/max sliders - Active filter removable pills + Clear all button - Grid view uses existing GlobalItemCard, list view uses Link-based GlobalItemListRow - SkeletonGrid and SkeletonList loading states - Empty state with context-aware message (query vs no catalog items) - Search input pre-fills from ?q= URL param, debounces 300ms - No framer-motion, no manual entry mode, no Add buttons
GearBox
A web app for managing gear collections (bikepacking, sim racing, etc.), tracking weight and price, and planning purchases through research threads.
Features
- Organize gear into categories with custom icons
- Track weight and price for every item
- Create setups (packing lists) from your collection with automatic weight/cost totals
- Research threads for comparing candidates before buying
- Image uploads for items and candidates
Deployment
GearBox is deployed via Coolify as a Docker image with separate services for dependencies.
Required services:
- PostgreSQL 16 — primary database
- Garage (or any S3-compatible storage) — image uploads
- Logto — OIDC authentication
GearBox image: gitea.jeanlucmakiola.de/makiolaj/gearbox:latest
See .env.example for required environment variables.
Updating
CI pushes a new Docker image on every release. Coolify auto-deploys when the image tag updates.
Database migrations run automatically on startup via entrypoint.sh.
Tech Stack
- Runtime & Package Manager: Bun
- Frontend: React 19, Vite, TanStack Router, TanStack Query, Tailwind CSS v4, Zustand
- Backend: Hono, Drizzle ORM, PostgreSQL
- Storage: S3-compatible (Garage, Cloudflare R2, AWS S3)
- Auth: OIDC via Logto
Local Development
Prerequisites
- Bun installed
- PostgreSQL, Logto, and Garage running (via Coolify test instance or locally)
Setup
-
Install dependencies:
bun install -
Copy and configure environment:
cp .env.example .env # Edit .env with your service URLs and credentials -
Start the development servers:
bun run devStarts both the Vite frontend (port
5173) and Hono backend (port3000).
Open http://localhost:5173 in your browser.
Commands
bun run dev— Start dev servers (frontend + backend)bun run build— Build production assetsbun test— Run testsbun run lint— Lint with Biomebun run db:generate— Generate Drizzle migrations after schema changes