A Strava-inspired fitness tracking application built with Next.js, TypeScript, and Tailwind CSS.
FitTrack is a modern web application that allows users to track their running and cycling activities. With a clean and intuitive interface inspired by Strava, users can record workouts, view their progress, and analyze their performance metrics.
- Activity Tracking: Record running and cycling activities with detailed metrics (distance, duration, calories, etc.)
- Dashboard View: Get a quick overview of your fitness journey with key statistics
- Activity List: View and manage all your recorded activities in one place
- Progress Analysis: Track your improvement over time with interactive charts and visualizations
- Achievements: Celebrate milestones and accomplishments in your fitness journey
- Frontend: Next.js, React, TypeScript
- Styling: Tailwind CSS
- Charts: Recharts
- Icons: Lucide React
- Node.js 14.x or higher
- npm or yarn
-
Clone the repository:
git clone https://github.com/yourusername/fittrack.git cd fittrack -
Install dependencies:
npm install # or yarn install -
Run the development server:
npm run dev # or yarn dev -
Open http://localhost:3000 with your browser to see the result.
fittrack/
├── app/ # Next.js app directory
│ ├── page.tsx # Main page component
│ └── layout.tsx # Root layout
├── components/ # React components
├── public/ # Static assets
├── styles/ # Global styles
├── tailwind.config.ts # Tailwind CSS configuration
└── package.json # Project dependencies
The UI is inspired by Strava with a focus on:
- Clean, modern aesthetics
- High readability and usability
- Intuitive navigation
- Responsive design for all device sizes
- Accessible color contrasts and interactions
- User authentication and profiles
- Social features (friends, activity sharing)
- Route mapping and GPS integration
- Advanced analytics and goal setting
- Mobile app versions
This project is licensed under the MIT License - see the LICENSE file for details.