Introduction
I'd like to share about a workout app I developed for personal use that can visualize max weights.
Application
This is a web application with PWA feature.
https://maxweightlog.vercel.app/
You can create a shortcut of this application in our device
https://web.dev/learn/pwa/installation
Background: Why I Built This App
As I works out regularly, I feel two main challenges below:
1. Existing Workout Apps Were Difficult to Use
- Frequent ads interrupting workout recording
- Too many unnecessary features making apps cumbersome
- Recording process not optimized, making it tedious to log workouts
2. Couldn't Track Personal Max Weights
- I want to consider my workout menu based on previous max weights
- But couldn't find an existing app with this feature
Tech Stack
As a personal project, I chose a following tech stack that would be free to run.
(Cursor is an exception since it is used regardless of this project)
| Category | Technology | Description |
|---|---|---|
| Language | TypeScript | Statically typed JavaScript extension |
| Framework | Next.js 13 (App Router) | React-based full-stack framework |
| Styling | Tailwind CSS | Utility-first CSS framework |
| Database | Supabase | PostgreSQL-based BaaS. Using free tier. |
| Authentication | Clerk | Auth platform. Using free tier. |
| UI Library | shadcn/ui | Reusable UI components |
| Infrastructure | Vercel | Hosting service. Using free tier. |
| Editor | Cursor | AI code editor. Using paid plan. |
Features
| Category | Feature | Description |
|---|---|---|
| Workout Records | CRUD | Create, read, update, delete workout records |
| Workout Records | Search | Search records by body part and exercise type |
| Workout Records | Copy | Create new records by copying existing ones |
| Workout Analysis | Max Weight Check | View historical max weights by body part and exercise |
| Settings | Body Part CRUD | Manage body part data |
| Settings | Exercise CRUD | Manage exercise type data |
Application Characteristics
1. Simple Workout Recording
It is designed for easy recording during a workout by keeping it simple.
Specific application characteristics include:
List Page
- Search functionality for existing records
- Used for the "Copy Existing Record" feature below
- "Copy Existing Record" feature
- Minimizes input effort
Create/Update Page
- Default of Date/time is set to current date because I want to record today's workout record.
- Default of reps is set to 10 because I always aim at 10 for each exercise
- Be able to input set for easy input for same exercise/rep combinations
2. Max Weight Visualization
Progress is visualized clearly to track improvements:
- Graph display of historical max weights by exercise
- Graph display of records by date
Top comments (0)