- π Overview
- π¦ Features
- π Structure
- π» Installation
- ποΈ Usage
- π Hosting
- π API Documentation
- π License
- π Authors
This repository contains a Minimum Viable Product (MVP) for a fitness tracker web application, enabling users to set goals, track progress, and share their achievements. Built with React, Node.js, Express, and MongoDB, it provides user authentication, goal setting, and progress tracking features.
Feature | Description | |
---|---|---|
π | User Authentication | Secure user registration and login using bcryptjs and JSON Web Tokens (JWT). |
π― | Goal Setting | Users can set fitness goals with target values and units. |
π | Progress Tracking | Track progress towards goals by logging daily or weekly activities. |
π€ | Social Sharing | Users can share their achievements with friends via a social feed (future implementation). |
π± | Responsive Design | The application is designed to be responsive and accessible across various devices. |
π‘οΈ | Secure API | The backend API is secured with JWT authentication to protect user data. |
βββ .env # Environment variables
βββ .gitignore # Specifies intentionally untracked files that Git should ignore
βββ package.json # Lists project dependencies and scripts
βββ README.md # Project documentation
βββ startup.sh # Script to start the application
βββ commands.json # JSON file with commands
βββ client # React frontend
β βββ public # Public assets
β β βββ index.html # HTML entry point
β βββ src # React source code
β β βββ App.js # Main application component
β β βββ index.js # React DOM rendering
β β βββ components # Reusable components
β β β βββ common # Common components
β β β β βββ Button.jsx # Reusable button component
β β β β βββ Input.jsx # Reusable input component
β β β βββ layout # Layout components
β β β β βββ Header.jsx # Header component
β β β βββ auth # Authentication components
β β β β βββ AuthForm.jsx # Authentication form
β β β βββ goals # Goal tracking components
β β β β βββ GoalList.jsx # Goal list component
β β β β βββ GoalForm.jsx # Goal form component
β β βββ pages # Application pages
β β β βββ Home.jsx # Home page component
β β β βββ Dashboard.jsx # Dashboard component
β β βββ context # Context API
β β β βββ AuthContext.js # Authentication context
β β βββ services # API services
β β β βββ api.js # API service
β β βββ utils # Utility functions
β β β βββ helpers.js # Helper functions
β β βββ styles # Global styles
β β βββ global.css # Global CSS
βββ server # Node.js backend
β βββ models # Mongoose models
β βββ routes # API routes
β βββ controllers # Route handlers
β βββ server.js # Main server file
- Clone the repository:
git clone https://github.com/coslynx/fitness-tracker-mvp.git cd fitness-tracker-mvp
- Install server dependencies:
cd server npm install cd ..
- Install client dependencies:
cd client npm install cd ..
- Configure environment variables:
cp .env.example .env # Edit .env to configure database connection and other settings
- Start the development server:
npm run dev
- Access the application:
- Web interface: http://localhost:3000
Tip
REACT_APP_API_BASE_URL
: Base URL of the backend API (default: http://localhost:3001)REACT_APP_AUTH_TOKEN_KEY
: Key used to store the authentication token in localStorage (default: fitness_app_auth_token)
-
π Registering a new user: Open the web application and navigate to the registration page.
-
π Creating a fitness goal: Log in and use the goal creation form on the dashboard.
- Install the Heroku CLI:
npm install -g heroku
- Login to Heroku:
heroku login
- Create a new Heroku app:
heroku create fitness-tracker-mvp-production
- Set up environment variables:
heroku config:set NODE_ENV=production heroku config:set REACT_APP_API_BASE_URL=https://your-heroku-app.herokuapp.com heroku config:set MONGODB_URI=your_mongodb_connection_string
- Deploy the code:
git push heroku main
NODE_ENV
: Set toproduction
for production environment.REACT_APP_API_BASE_URL
: Base URL of the backend API.MONGODB_URI
: Connection string for the MongoDB database.JWT_SECRET
: Secret key for JWT token generation.
-
POST /api/auth/register
- Description: Register a new user
- Body:
{ "username": string, "email": string, "password": string }
- Response:
{ "id": string, "username": string, "email": string, "token": string }
-
POST /api/auth/login
- Description: Login a user
- Body:
{ "email": string, "password": string }
- Response:
{ "id": string, "username": string, "email": string, "token": string }
-
GET /api/goals
- Description: Get all goals for a user
- Headers:
Authorization: Bearer TOKEN
- Response:
[{ "id": string, "name": string, "description": string, "target": number, "unit": string, "current": number }]
-
POST /api/goals
- Description: Create a new goal
- Headers:
Authorization: Bearer TOKEN
- Body:
{ "name": string, "description": string, "target": number, "unit": string }
- Response:
{ "id": string, "name": string, "description": string, "target": number, "unit": string, "current": number }
- Register a new user or login to receive a JWT token.
- Include the token in the
Authorization
header for all protected routes:Authorization: Bearer YOUR_JWT_TOKEN
# Register a new user
curl -X POST http://localhost:3001/api/auth/register \
-H "Content-Type: application/json" \
-d '{"username": "fitnessuser", "email": "user@example.com", "password": "securepass123"}'
# Response
{
"id": "user123",
"username": "fitnessuser",
"email": "user@example.com",
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
}
# Create a new goal
curl -X POST http://localhost:3001/api/goals \
-H "Content-Type: application/json" \
-H "Authorization: Bearer YOUR_JWT_TOKEN" \
-d '{"name": "Weight Loss", "description": "Lose 10kg", "target": 10, "unit": "kg"}'
# Response
{
"id": "goal123",
"name": "Weight Loss",
"description": "Lose 10kg",
"target": 10,
"unit": "kg",
"current": 0
}
Note
This Minimum Viable Product (MVP) is licensed under the GNU AGPLv3 license.
This MVP was entirely generated using artificial intelligence through CosLynx.com.
No human was directly involved in the coding process of the repository: fitlog-goal-track-share
For any questions or concerns regarding this AI-generated MVP, please contact CosLynx at:
- Website: CosLynx.com
- Twitter: @CosLynxAI
Create Your Custom MVP in Minutes With CosLynxAI!