Skip to content
codexa

Web apps · React

Gym memberships

Manage gym members, plans, renewal dates and monthly revenue from one simple list.

Use this templateRemix
Gym memberships starter, as built from its own files
Starter screenshot captured from this template's own build at 1440×900. It shows the template as it ships, not output generated from a prompt.

What you get

A membership list for an independent gym: each member's plan, monthly fee, join and renewal dates, with active revenue and lapsed members counted at the top. The plans, statuses and sample members live in src/app.ts.

Files

Exactly what is copied into a new project: 12 files, nothing generated.

Raw data: GET /api/v1/templates/app-gym-memberships

Explorer 12

src/app.ts
src/app.ts
import type { AppSpec } from "./types"; /** Everything this app shows. Edit freely. */export const app: AppSpec = {  "brand": "Northside Barbell",  "icon": "bolt",  "storageKey": "northside-members-v1",  "entity": {    "singular": "Member",    "plural": "Members"  },  "title": "Members",  "subtitle": "Memberships, renewals and who has gone quiet",  "currency": "$",  "titleKey": "member",  "statusKey": "status",  "tones": {    "Active": "good",    "Trial": "accent",    "Paused": "warn",    "Lapsed": "bad"  },  "views": [    "table"  ],  "fields": [    {      "key": "member",      "label": "Member",      "type": "text",      "required": true    },    {      "key": "email",      "label": "Email",      "type": "email"    },    {      "key": "plan",      "label": "Plan",      "type": "select",      "options": [        "Unlimited",        "3x per week",        "Off-peak",        "Student"      ]    },    {      "key": "fee",      "label": "Monthly fee",      "type": "money"    },    {      "key": "joined",      "label": "Joined",      "type": "date",      "hideInTable": true    },    {      "key": "renews",      "label": "Renews",      "type": "date"    },    {      "key": "status",      "label": "Status",      "type": "select",      "options": [        "Active",        "Trial",        "Paused",        "Lapsed"      ]    },    {      "key": "notes",      "label": "Notes",      "type": "longtext",      "hideInTable": true    }  ],  "summary": [    {      "label": "Members",      "kind": "count"    },    {      "label": "Active",      "kind": "count",      "status": "Active"    },    {      "label": "Monthly revenue",      "kind": "sum",      "field": "fee",      "status": "Active"    },    {      "label": "Lapsed",      "kind": "count",      "status": "Lapsed"    }  ],  "seed": [    {      "member": "Jordan Mills",      "email": "jordan.mills@mail.com",      "plan": "Unlimited",      "fee": 89,      "joined": "2025-03-14",      "renews": "2026-11-14",      "status": "Active",      "notes": "Competes in powerlifting, Saturday coaching."    },    {      "member": "Bea Santos",      "email": "bea.santos@mail.com",      "plan": "3x per week",      "fee": 65,      "joined": "2026-01-08",      "renews": "2026-11-08",      "status": "Active",      "notes": ""    },    {      "member": "Chris Albright",      "email": "c.albright@mail.com",      "plan": "Off-peak",      "fee": 45,      "joined": "2024-09-02",      "renews": "2026-11-02",      "status": "Paused",      "notes": "Knee surgery, paused until December."    },    {      "member": "Mei Tanaka",      "email": "mei.tanaka@mail.com",      "plan": "Student",      "fee": 35,      "joined": "2026-09-15",      "renews": "2026-11-15",      "status": "Active",      "notes": ""    },    {      "member": "Andre Wallace",      "email": "andre.w@mail.com",      "plan": "Unlimited",      "fee": 89,      "joined": "2026-10-21",      "renews": "2026-11-04",      "status": "Trial",      "notes": "Two-week trial, follow up after class on Nov 2."    },    {      "member": "Kelly O'Brien",      "email": "kelly.obrien@mail.com",      "plan": "3x per week",      "fee": 65,      "joined": "2025-06-30",      "renews": "2026-09-30",      "status": "Lapsed",      "notes": "Card declined twice."    },    {      "member": "Sam Patel",      "email": "sam.patel@mail.com",      "plan": "Unlimited",      "fee": 89,      "joined": "2023-11-11",      "renews": "2026-11-11",      "status": "Active",      "notes": "Founding member rate."    },    {      "member": "Nina Kowalski",      "email": "nina.k@mail.com",      "plan": "Off-peak",      "fee": 45,      "joined": "2026-10-25",      "renews": "2026-11-08",      "status": "Trial",      "notes": ""    }  ]};

Remix

Remix this template

Describe what to change and the agent starts from Gym memberships's files. The box is already started for you: finish “Start from Gym memberships and …”

Agent ready

Creates a free account first; your idea is carried over.

Dependencies

Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.

  • react^19.1.0
  • react-dom^19.1.0
  • vite^6.3.0
  • @vitejs/plugin-react^4.4.0
  • tailwindcss^4.1.0
  • @tailwindcss/vite^4.1.0
  • typescript^5.8.0

How it runs

Framework
Vite + React + TypeScript
Dev command
npm run dev
Build command
npm run build
Output directory
dist
Port
5173
Entry route
/

Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.

Keep browsing

All templates

Build on Gym memberships

Create a free account, start from this template, and ask the AI agent to turn it into your app.

Use this templateAll templates