An AI-powered friend-finding platform that helps you discover meaningful platonic connections through intelligent matching and engaging conversations.

• AI-Generated Profiles: Realistic user profiles created using Google's Gemini AI with diverse hobbies, personalities, and bios
• Swipe Interface: Familiar Tinder-style swipe mechanics for browsing potential friends
• Smart Matching: Match with people who share your interests and personality type
• AI Chat: Have natural conversations with AI-powered profiles that maintain context and personality
• Personality Types: MBTI personality types integrated into profiles for better compatibility
• Beautiful UI: Modern, responsive design with smooth animations and gradients
• Demo Mode: Try the full experience with AI-generated profiles before creating an account

• Frontend: React 18 + TypeScript
• Styling: Tailwind CSS + shadcn/ui components
• Build Tool: Vite
• AI Integration: Google Gemini API
• Routing: React Router v6
• Icons: Lucide React

• Node.js 18+ or Bun
• Google Gemini API key

1. Clone the repository

   git clone https://github.com/TheAgencyMGE/friend-match-connect.git
   cd friend-match-connect

2. Install dependencies

   npm i
   # or
   bun install

3. Set up environment variables

   Create a .env file in the root directory:

   VITE_GEMINI_API_KEY=your_api_key_here

   Get your API key from Google AI Studio

4. Run the development server

   npm run dev
   # or
   bun dev

5. Open your browser

   Navigate to http://localhost:5173

npm run build
# or
bun run build

The built files will be in the dist/ directory.

1. Landing Page: Click "Try Demo" to experience the full app without signing up
2. Swipe Interface:
   • Swipe right (or click ❤️) to like a profile
   • Swipe left (or click ✖️) to pass
   • View detailed profile information including hobbies, bio, and personality type
3. Matches: When you match with someone, a popup appears
4. Chat: Click "Message" to start an AI-powered conversation
5. Conversations: The AI maintains context and personality throughout the chat

• Profile Generation: Uses Gemini 2.5 Flash to create diverse, realistic profiles with unique hobbies and bios
• Conversational AI: Each profile has a distinct personality that responds naturally to your messages
• Context Awareness: AI remembers previous messages and maintains conversation flow
• Personality Consistency: Responses match the profile's hobbies, age, location, and MBTI type

friend-match-connect/
├── src/
│   ├── components/         # React components
│   │   ├── ui/            # shadcn/ui components
│   │   ├── SwipeInterface.tsx
│   │   ├── ChatInterface.tsx
│   │   ├── MatchPopup.tsx
│   │   └── ...
│   ├── pages/             # Page components
│   │   ├── Index.tsx      # Landing page
│   │   ├── Demo.tsx       # Main app demo
│   │   └── NotFound.tsx
│   ├── lib/               # Utilities
│   │   ├── geminiApi.ts   # AI integration
│   │   └── utils.ts       # Helper functions
│   └── hooks/             # Custom React hooks
├── public/                # Static assets
└── package.json

The app uses Google's Gemini API for generating profiles and chat responses. Configuration can be found in src/lib/geminiApi.ts:

• Profile Generation: temperature: 0.9, maxOutputTokens: 256
• Chat Responses: temperature: 0.85, maxOutputTokens: 300

• Personality Types: Edit PERSONALITY_TYPES in geminiApi.ts
• Cities: Modify CITIES array for different locations
• Gradient Colors: Customize GRADIENT_PAIRS for profile avatars
• Fallback Data: Update FALLBACK_HOBBIES and FALLBACK_BIOS for offline mode

Built with shadcn/ui, including:

• Card, Button, Input, Textarea
• Dialog, Sheet, Drawer
• Avatar, Badge, Toast
• Accordion, Tabs, Separator
• And many more...

• User authentication and real profiles
• Backend API for persistent data
• Real-time messaging with WebSockets
• Advanced matching algorithms
• Photo uploads
• Location-based filtering
• Interest-based communities
• Event planning features

This project is for demonstration purposes. Feel free to use and modify as needed.

Contributions are welcome! Please feel free to submit a Pull Request.

For questions or issues, please open an issue on GitHub.

Note: This is a demo application showcasing AI integration. The profiles and conversations are AI-generated and not real people.