A mobile-first workout and fitness tracking system built to make every session more focused, every routine easier to follow, and every training milestone easier to remember.
REDLINE is a personal training companion for people who want to train with a plan instead of relying on memory. It brings workout routines, exercise reference, working weights, completed sessions, and training history into one focused interface.
The idea is simple: know what you are training today, remember what you did last time, and make your next session more intentional.
| Organize exercises into reusable routines, keep your planned sets, reps, and working weights together, and spend less time figuring out what comes next. | Record completed sessions and revisit previous workouts. Keep useful training context close instead of trying to remember last week's numbers. |
| Explore a library built around 200+ exercise entries, with movement details, equipment and muscle categories, and exercise-specific illustrations. | Visual muscle-map assets cover front and back views and individual muscle groups, helping connect exercise selection with the muscles being trained. |
| Track exercise-specific working weights, reps, sets, and notes. Choose kilograms or pounds to fit your preference. | Clerk handles the sign-in experience, while Supabase stores user-linked routines, sessions, settings, and exercise tracking data. |
| A restricted admin area supports exercise-library management and a separate feedback dashboard. It is reserved for authorized accounts rather than ordinary users. | A dark, high-contrast interface, bold REDLINE identity, and GSAP-powered motion make the experience feel like a dedicated training system. PWA support adds an app-like installation path on supported devices. |
REDLINE uses a near-black foundation, sharp typography, and a restrained crimson accent to create a direct, training-focused identity. The interface prioritizes fast, practical use on a phone—the device most likely to be within reach between sets.
Motion and transitions are intentional parts of the experience, not just decoration. The goal is to make the app feel cohesive and focused without getting in the way of the workout.
The current priority is mobile. The desktop layout still has areas to refine, and improving that experience is part of the ongoing roadmap.
I started REDLINE for myself and a few friends. We wanted a better way to keep up with our weight training and routines. I kept forgetting which exercise came next, what weight I used the previous week, and how I had structured a session. Depending on memory was not working, so I started building a tool that could remember the details for me.
What began as a practical solution grew into a much bigger project. I wanted the exercise information to be useful, the training flow to feel natural, and the visuals to match the quality I had in mind. One of the hardest parts was entering and maintaining the exercise data while creating clear, movement-specific illustrations. Getting 200+ exercise entries into the project was a major milestone, but accuracy is still something I want to keep improving. I plan to keep refining the library, including with help from a trusted friend.
Building REDLINE alone also gave me a better appreciation for why software teams divide work across design, frontend, data, testing, and product decisions. AI tools can help with explanations and debugging, but they do not remove the hard work of connecting systems, making decisions, testing assumptions, or staying consistent through difficult problems.
It has also reinforced something easy to overlook in a long build: mental health matters. Clear thinking, rest, and time away from a problem are part of making good work—not obstacles to it. REDLINE is an ongoing project, and I want to keep improving it sustainably rather than rushing every idea into the app.
| Area | Technology | Role in REDLINE |
|---|---|---|
| Interface | HTML5, CSS3, Vanilla JavaScript | Structure, styling, app logic, and responsive behavior |
| Build tooling | Vite | Local development and optimized production builds |
| Authentication | Clerk | User sign-in and authenticated sessions |
| Data layer | Supabase | User-linked exercise tracking, routines, sessions, and settings |
| Motion | GSAP | Interface animation and transitions |
| Install experience | Web App Manifest, vite-plugin-pwa, Workbox |
PWA metadata and service-worker generation |
| Hosting | Vercel | Public deployment |
The frontend uses vanilla JavaScript with ES modules rather than a large UI framework. That keeps the application close to the platform's core web technologies while using focused libraries where they help.
REDLINE Web App
HTML · CSS · JavaScript
│
┌────────────┴────────────┐
│ │
Clerk Auth GSAP Motion
│
▼
Authenticated Supabase Client
│
▼
Supabase Data Layer
│
┌───────┼─────────┐
▼ ▼ ▼
Exercises Routines Workout Sessions
│
▼
User Settings & Tracking
Vite Build → Vercel Deployment
PWA Manifest + Service Worker
REDLINE is publicly viewable at the live link above. To run a local development build, you'll need Node.js/npm, a Clerk application, and a Supabase project configured for the app's data model and access policies.
git clone https://github.com/jbmsacps-stack/REDLINE.git
cd REDLINE
npm installCreate a .env file in the project root with client-safe values:
VITE_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
VITE_SUPABASE_URL=your_supabase_project_url
VITE_SUPABASE_PUBLISHABLE_KEY=your_supabase_publishable_keyThen start the development server or create a production build:
npm run dev
npm run buildSecurity note:
VITE_variables are included in the browser bundle. Use only publishable/client-safe keys in them; never expose a Clerk secret key or a Supabase service-role key in frontend code. Supabase Row Level Security policies should enforce access to user data.
- Continue refining exercise descriptions and illustration accuracy.
- Polish desktop layouts and responsive behavior.
- Validate the installed PWA icon presentation across Android launchers and browsers.
- Test installation and offline behavior across supported devices.
- Improve loading performance and perceived responsiveness.
- Add screenshots and a visual project gallery.
- Keep improving the training workflow, animations, and overall consistency.
Joshua Baskar · Aspiring Full-Stack Developer
- Live App: redline-six-alpha.vercel.app
- GitHub: jbmsacps-stack
- Repository: REDLINE on GitHub
REDLINE · Copyright © 2026 Joshua Baskar · All rights reserved.
This repository is available for viewing and learning. Unless written permission or a separate license says otherwise:
- Viewing and studying the source code for personal learning.
- Referencing the project in non-commercial academic or portfolio work with attribution.
- Private experimentation and modification for personal learning.
- Sharing links to this repository or the live application with credit.
- Republishing the project or substantial portions of its code publicly.
- Commercial use, monetization, or integration into a commercial product.
- Redistributing modified or unmodified versions under another name or identity.
- Claiming authorship or ownership of the original project or its work.
Other uses and licensing arrangements can be discussed with the author. These terms describe the author's intended usage policy and are not a substitute for legal advice.
REDLINE — Train with intent.
Designed for the work. Built one session at a time.