AthCircle - Sports Networking Platform

AthCircle is a comprehensive sports networking platform that connects athletes, teams, and venue owners. Think of it as "LinkedIn meets sports" - a place where players can find teammates, teams can recruit talent, and venues can manage bookings.

🎯 Features

For Players

• Profile Management: Create detailed sports profiles with skills, experience, and achievements
• Discovery: Find other players, teams, and venues in your area
• Connections: Network with other athletes and build your sports community
• Match Finding: Find and join matches or create your own
• Messaging: Direct messaging with other players

For Teams

• Team Management: Create and manage your sports team
• Recruitment: Find and recruit talented players
• Match Scheduling: Organize matches with other teams
• Member Management: Manage team roster and roles

For Venue Owners

• Venue Listing: List your sports facilities
• Slot Management: Create and manage booking slots
• Booking Management: Handle booking requests and confirmations
• Analytics: Track venue performance and bookings

🛠️ Tech Stack

• Frontend: Next.js 14+ with App Router, React, TypeScript
• Styling: Tailwind CSS with custom theme
• Database: PostgreSQL with Prisma ORM
• Authentication: JWT-based authentication
• Validation: Zod schemas
• Icons: Lucide React

🚀 Getting Started

Prerequisites

• Node.js 18+
• PostgreSQL database
• npm or yarn

Installation

1. Clone the repository

   git clone https://github.com/yourusername/athcircle.git
   cd athcircle

2. Install dependencies

   npm install

3. Set up environment variables

   cp .env.example .env

   Update .env with your database credentials:

   DATABASE_URL="postgresql://user:password@localhost:5432/athcircle"
   JWT_SECRET="your-super-secret-jwt-key"
   

4. Set up the database

   # Generate Prisma client
   npx prisma generate
   
   # Run migrations
   npx prisma migrate dev
   
   # Seed the database (optional)
   npx prisma db seed

5. Start the development server

   npm run dev

6. Open the app Navigate to http://localhost:3000

📁 Project Structure

athcircle/
├── app/                    # Next.js App Router
│   ├── (auth)/            # Auth pages (login, register)
│   ├── (dashboard)/       # Dashboard pages
│   │   ├── bookings/
│   │   ├── connections/
│   │   ├── dashboard/
│   │   ├── discover/
│   │   ├── matches/
│   │   ├── messages/
│   │   ├── notifications/
│   │   └── settings/
│   ├── api/               # API routes
│   │   ├── auth/
│   │   ├── bookings/
│   │   ├── connections/
│   │   ├── matches/
│   │   ├── messages/
│   │   ├── notifications/
│   │   ├── players/
│   │   ├── sports/
│   │   ├── teams/
│   │   └── venues/
│   └── page.tsx           # Landing page
├── components/            # React components
│   └── ui/               # Reusable UI components
├── lib/                   # Utility libraries
│   ├── auth.ts           # Authentication helpers
│   ├── prisma.ts         # Prisma client
│   └── validations.ts    # Zod schemas
├── prisma/               # Database
│   ├── schema.prisma     # Database schema
│   └── seed.ts           # Seed data
└── public/               # Static assets

🔑 Demo Accounts

After seeding the database, you can use these accounts:

Role	Email	Password
Player	john.player@example.com	password123
Player	sarah.player@example.com	password123
Team Manager	mike.team@example.com	password123
Venue Owner	david.venue@example.com	password123

🎨 Design System

Colors

• Primary (Deep Navy Blue): #1E3A5F - Trust, professionalism
• Secondary (Energetic Orange): #FF6B35 - Energy, action, sports
• Accent (Teal): #4ECDC4 - Fresh, modern appeal
• Success: #10B981
• Warning: #F59E0B
• Destructive: #EF4444

Typography

• Headings: Montserrat (bold, modern)
• Body: Inter (clean, readable)

📝 API Endpoints

Authentication

• POST /api/auth/register - Register a new user
• POST /api/auth/login - Login user

Players

• GET /api/players - List players with filters
• GET /api/players/:id - Get player details
• PATCH /api/players/:id - Update player profile

Teams

• GET /api/teams - List teams
• POST /api/teams - Create a team
• GET /api/teams/:id - Get team details

Venues

• GET /api/venues - List venues
• POST /api/venues - Create a venue
• GET /api/venues/:id - Get venue details

Bookings

• GET /api/bookings - List bookings
• POST /api/bookings - Create a booking
• PATCH /api/bookings/:id - Update booking status

Matches

• GET /api/matches - List matches
• POST /api/matches - Create a match

Connections

• GET /api/connections - Get user connections
• POST /api/connections - Send connection request
• PATCH /api/connections/:id - Accept/reject connection

Messages

• GET /api/messages - Get conversations
• POST /api/messages - Send a message

Notifications

• GET /api/notifications - Get notifications
• PATCH /api/notifications - Mark as read

🧪 Development

Run development server

npm run dev

Build for production

npm run build

Run Prisma Studio (database GUI)

npx prisma studio

Reset database

npx prisma migrate reset

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Design inspiration from LinkedIn, Hudl, and modern sports apps
• Icons by Lucide
• UI components inspired by shadcn/ui

---

Built with ❤️ by the AthCircle Team