Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/coslynx/fittrack-mvp-web-app

Project: Track fitness goals, log workouts, and share progress with friends. Created at https://coslynx.com
https://github.com/coslynx/fittrack-mvp-web-app

code-generation community-building developer-tools devops expressjs fitness-tracking goal-setting javascript machine-learning mvp nextjs postgresql prisma progress-visualization react social-sharing software-development tailwindcss user-authentication workout-logging

Last synced: 12 days ago
JSON representation

Project: Track fitness goals, log workouts, and share progress with friends. Created at https://coslynx.com

Awesome Lists containing this project

README

        




FitTrack-MVP-Web-App


A web-based fitness tracker to help users achieve their goals.


Developed with the software and tools below.



Framework used for the application
Frontend technologies used
Backend technology used
Large language models used


git-last-commit
GitHub commit activity
GitHub top language

## ๐Ÿ“‘ Table of Contents
- ๐Ÿ“ Overview
- ๐Ÿ“ฆ Features
- ๐Ÿ“‚ Structure
- ๐Ÿ’ป Installation
- ๐Ÿ—๏ธ Usage
- ๐ŸŒ Hosting
- ๐Ÿ“„ License
- ๐Ÿ‘ Authors

## ๐Ÿ“ Overview
The repository contains a Minimum Viable Product (MVP) called "FitTrack-MVP-Web-App" that provides a user-friendly platform for fitness tracking, goal setting, and progress visualization. It combines the power of React, Next.js, and a robust backend built with Node.js, leveraging custom Large Language Models (LLMs) like Gemini and OpenAI for enhanced user experience and functionality.

## ๐Ÿ“ฆ Features
| | Feature | Description |
|----|--------------------|--------------------------------------------------------------------------------------------------------------------|
| โš™๏ธ | **Architecture** | The codebase follows a modular architectural pattern with separate directories for different functionalities, ensuring easier maintenance and scalability. |
| ๐Ÿ“„ | **Documentation** | The repository includes a README file that provides a detailed overview of the MVP, its dependencies, and usage instructions.|
| ๐Ÿ”— | **Dependencies** | The codebase relies on various external libraries and packages such as React, Next.js, Zustand, Prisma, and Tailwind CSS, which are essential for building and styling the UI components, and handling external services.|
| ๐Ÿงฉ | **Modularity** | The modular structure allows for easier maintenance and reusability of the code, with separate directories and files for different functionalities such as components, pages, styles, and utilities.|
| ๐Ÿงช | **Testing** | Implement unit tests using frameworks like Jest or React Testing Library to ensure the reliability and robustness of the codebase. |
| โšก๏ธ | **Performance** | The performance of the system can be optimized based on factors such as the browser and hardware being used. Consider implementing performance optimizations for better efficiency.|
| ๐Ÿ” | **Security** | Enhance security by implementing measures such as input validation, data encryption, and secure communication protocols.|
| ๐Ÿ”€ | **Version Control**| Utilizes Git for version control with GitHub Actions workflow files for automated build and release processes.|
| ๐Ÿ”Œ | **Integrations** | Interacts with browser APIs, external services through HTTP requests, and includes integrations with popular fitness trackers like Fitbit, Garmin, and Apple Health.|
| ๐Ÿ“ถ | **Scalability** | Design the system to handle increased user load and data volume, utilizing caching strategies and cloud-based solutions for better scalability. |

## ๐Ÿ“‚ Structure
```text
โ”œโ”€โ”€ components
โ”‚ โ”œโ”€โ”€ Button.tsx
โ”‚ โ”œโ”€โ”€ Header.tsx
โ”‚ โ”œโ”€โ”€ Layout.tsx
โ”‚ โ”œโ”€โ”€ GoalInput.tsx
โ”‚ โ”œโ”€โ”€ ProgressChart.tsx
โ”‚ โ””โ”€โ”€ SocialShareButton.tsx
โ”œโ”€โ”€ pages
โ”‚ โ”œโ”€โ”€ api
โ”‚ โ”‚ โ”œโ”€โ”€ auth.ts
โ”‚ โ”‚ โ”œโ”€โ”€ goals.ts
โ”‚ โ”‚ โ””โ”€โ”€ progress.ts
โ”‚ โ”œโ”€โ”€ _app.tsx
โ”‚ โ”œโ”€โ”€ index.tsx
โ”‚ โ”œโ”€โ”€ dashboard.tsx
โ”‚ โ””โ”€โ”€ login.tsx
โ”œโ”€โ”€ styles
โ”‚ โ””โ”€โ”€ global.css
โ”œโ”€โ”€ utils
โ”‚ โ”œโ”€โ”€ helpers.ts
โ”‚ โ”œโ”€โ”€ api.ts
โ”‚ โ”œโ”€โ”€ auth.ts
โ”‚ โ””โ”€โ”€ validation.ts
โ”œโ”€โ”€ config
โ”‚ โ””โ”€โ”€ next-auth.config.ts
โ”œโ”€โ”€ middleware
โ”‚ โ””โ”€โ”€ authentication.ts
โ”œโ”€โ”€ .env
โ”œโ”€โ”€ package.json
โ”œโ”€โ”€ README.md
โ”œโ”€โ”€ tailwind.config.ts
โ””โ”€โ”€ tsconfig.json
```

## ๐Ÿ’ป Installation
### ๐Ÿ”ง Prerequisites
- Node.js
- npm
- Docker

### ๐Ÿš€ Setup Instructions
1. Clone the repository:
- `git clone https://github.com/coslynx/FitTrack-MVP-Web-App.git`
2. Navigate to the MVP directory:
- `cd FitTrack-MVP-Web-App`
3. Install dependencies:
- `npm install`

## ๐Ÿ—๏ธ Usage
### ๐Ÿƒโ€โ™‚๏ธ Running the MVP
1. Start the development server:
- `npm start`
2. Open your browser and navigate to [http://localhost:3000](http://localhost:3000).

### โš™๏ธ Configuration
Adjust configuration settings in `config.js` or `.env`.

### ๐Ÿ“š Examples
- ๐Ÿ“ **Example 1**: Setting up a new fitness goal:
- Navigate to the 'Goals' section.
- Click on the 'Add Goal' button.
- Fill in the goal details (type, target, timeframe).
- Submit the goal.
- ๐Ÿ“ **Example 2**: Tracking workout progress:
- Log in to your account.
- Navigate to the 'Progress' section.
- Click on 'Log Workout' to record workout details (date, type, duration, metrics).
- View your progress visualized on the 'Progress Chart'.
- ๐Ÿ“ **Example 3**: Integrating with fitness trackers:
- Log in to your account.
- Navigate to 'Settings' and connect your fitness tracker (Fitbit, Garmin, Apple Health).
- Automatically sync your workout data from your tracker to FitTrack for a seamless experience.

## ๐ŸŒ Hosting
### ๐Ÿš€ Deployment Instructions
If applicable, provide details on how to host the MVP using various services, such as:

Vercel
Netlify
GitHub Pages
AWS
Google Cloud

#### Heroku
1. Install the Heroku CLI:
- `npm install -g heroku`
2. Login to Heroku:
- `heroku login`
3. Create a new Heroku app:
- `heroku create`
4. Deploy the code:
- `git push heroku main`

### ๐Ÿ”‘ Environment Variables
- `DATABASE_URL`: PostgreSQL database connection URL.
- `NEXTAUTH_SECRET`: A secret used for signing tokens.

## ๐Ÿ“œ API Documentation
### ๐Ÿ” Endpoints
- **GET /api/auth/[...nextauth].js**: Handles authentication requests (sign in, sign up, password reset).
- **GET /api/goals**: Retrieves a list of goals for the current user.
- **POST /api/goals**: Creates a new goal for the current user.
- **GET /api/progress**: Retrieves workout data and progress for the current user.
- **POST /api/progress**: Logs a new workout for the current user.

### ๐Ÿ”’ Authentication
Authentication is handled by NextAuth.js, which provides secure JWT token-based authentication.

### ๐Ÿ“ Examples
```bash
# Get goals
curl -X GET http://localhost:3000/api/goals -H "Authorization: Bearer YOUR_JWT_TOKEN"

# Create a new goal
curl -X POST http://localhost:3000/api/goals -H "Authorization: Bearer YOUR_JWT_TOKEN" -H "Content-Type: application/json" -d '{"type": "weight loss", "target": 10, "timeframe": 30}'

# Get progress data
curl -X GET http://localhost:3000/api/progress -H "Authorization: Bearer YOUR_JWT_TOKEN"

# Log a new workout
curl -X POST http://localhost:3000/api/progress -H "Authorization: Bearer YOUR_JWT_TOKEN" -H "Content-Type: application/json" -d '{"date": "2024-03-10", "type": "running", "duration": 30, "distance": 5, "calories": 300}'
```

## ๐Ÿ“œ License
This MVP is licensed under the [MIT](https://choosealicense.com/licenses/mit/).

## ๐Ÿ‘ฅ Authors
- **CosLynxAI** - [CosLynx.com](https://coslynx.com)
- **Drix10** - [GitHub](https://github.com/coslynx)
- **Kais Radwan** - [GitHub](https://github.com/KaisRadwan)


๐ŸŒ CosLynx.com


Create Your Custom MVP in Minutes With CosLynxAI!