Find your perfect co-founder or project collaborator with a swipe!
Features • Demo • Installation • Tech Stack • API Docs
CrewlyX is a modern web application that makes finding team members as easy as dating apps. Swipe right to connect with potential co-founders, hackathon partners, and project collaborators who share your vision and skills.
- 👥 Finding co-founders for startups
- 💻 Hackathon team formation
- 🚀 Project collaboration
- 🎓 Learning partners
- 🏢 Networking events
- 🎴 Tinder-Style Swiping - Intuitive swipe interface for browsing profiles
- 🤝 Smart Matching - Automatic match detection when both users like each other
- 💬 Real-time Messaging - Socket.IO powered chat between matches
- 👤 Rich Profiles - Detailed user profiles with skills, interests, and goals
- 🔐 Secure Authentication - JWT-based authentication with bcrypt password hashing
- Detailed profiles with bio, location, skills, and experience
- Collaboration preferences (co-founder, hackathon partner, etc.)
- Availability settings (full-time, part-time, weekends, flexible)
- Skill tags and interests display
- Profile photos with support for custom uploads
- 🎨 Modern UI with glassmorphism effects
- 📱 Fully responsive design (desktop & mobile)
- ✨ Smooth animations with Framer Motion & React Spring
- 🌙 Dark theme for better visibility
- ⚡ Fast and optimized performance
Beautiful gradient design with animated particles and clear call-to-action buttons.
Tinder-style card interface with smooth animations and real-time feedback.
Instant match notifications when mutual likes are detected.
Comprehensive profile editing with stats tracking.
- React 18 - Modern UI library
- TypeScript - Type-safe development
- Vite - Lightning-fast build tool
- TailwindCSS - Utility-first styling
- Framer Motion - Smooth animations
- React Router v6 - Client-side routing
- React Spring - Physics-based animations
- Socket.IO Client - Real-time features
- Node.js - JavaScript runtime
- Express.js - Web framework
- MongoDB - NoSQL database
- Mongoose - Elegant MongoDB ODM
- JWT - Secure authentication
- bcryptjs - Password hashing
- Socket.IO - Real-time communication
- Express Validator - Input validation
git clone https://github.com/yourusername/crewlyx.git
cd crewlyxmacOS:
brew tap mongodb/brew
brew install mongodb-community
brew services start mongodb-communityUbuntu/Linux:
sudo apt-get install -y mongodb-org
sudo systemctl start mongod
sudo systemctl enable mongodWindows: Download and install from MongoDB Downloads
# Install frontend dependencies
npm install
# Install backend dependencies
cd server
npm install# From the server directory
npm run seedThis creates 10 test users. All passwords are Test123
Terminal 1 - Backend:
cd server
npm run devTerminal 2 - Frontend:
npm run devVisit http://localhost:3000
Test Login:
- Email:
alex@test.com - Password:
Test123
crewlyx/
├── server/ # Backend API
│ ├── models/ # MongoDB models
│ │ ├── User.js # User schema
│ │ ├── Match.js # Match schema
│ │ └── Message.js # Message schema
│ ├── routes/ # API routes
│ │ ├── auth.js # Authentication
│ │ ├── users.js # User management
│ │ ├── swipes.js # Swipe functionality
│ │ ├── matches.js # Match management
│ │ └── messages.js # Messaging
│ ├── middleware/ # Middleware
│ │ ├── auth.js # JWT authentication
│ │ └── errorHandler.js # Error handling
│ ├── scripts/ # Utility scripts
│ │ └── seedDatabase.js # Database seeding
│ ├── .env # Environment variables
│ ├── server.js # Server entry point
│ └── package.json # Dependencies
│
├── src/ # Frontend source
│ ├── components/ # React components
│ │ ├── Login.tsx # Login page
│ │ ├── SwipeCards.tsx # Swipe interface
│ │ ├── LandingPage.tsx # Landing page
│ │ ├── Matches.tsx # Matches view
│ │ ├── Profile.tsx # Profile page
│ │ └── ...
│ ├── services/ # API services
│ │ └── api.ts # Backend API calls
│ ├── types/ # TypeScript types
│ ├── utils/ # Utilities
│ ├── App.tsx # Main app component
│ └── main.tsx # Entry point
│
└── public/ # Static assets
POST /api/auth/register
Content-Type: application/json
{
"name": "John Doe",
"email": "john@example.com",
"password": "SecurePass123",
"age": 25,
"skills": ["React", "Node.js"],
"location": "San Francisco, CA",
"lookingFor": "co-founder",
"availability": "full-time"
}POST /api/auth/login
Content-Type: application/json
{
"email": "john@example.com",
"password": "SecurePass123"
}GET /api/auth/me
Authorization: Bearer <token>GET /api/users/discover
Authorization: Bearer <token>PUT /api/users/profile
Authorization: Bearer <token>
Content-Type: application/json
{
"bio": "Updated bio",
"skills": ["React", "Vue", "Angular"]
}POST /api/swipes
Authorization: Bearer <token>
Content-Type: application/json
{
"targetUserId": "507f1f77bcf86cd799439011",
"action": "like"
}GET /api/matches
Authorization: Bearer <token>POST /api/messages/:matchId
Authorization: Bearer <token>
Content-Type: application/json
{
"content": "Hey! Let's collaborate!"
}For complete API documentation, see server/README.md
- ✅ Password Hashing - Bcrypt with 12 salt rounds
- ✅ JWT Authentication - Secure token-based auth (7-day expiry)
- ✅ Protected Routes - Middleware-based route protection
- ✅ Input Validation - Express-validator for all inputs
- ✅ Rate Limiting - 100 requests per 15 minutes
- ✅ Helmet.js - Security headers
- ✅ CORS - Configured for specific origins
- ✅ NoSQL Injection Protection - Mongoose sanitization
All test accounts use password: Test123
| Name | Role | |
|---|---|---|
| alex@test.com | Alex Johnson | Full-stack Developer |
| sarah@test.com | Sarah Chen | UI/UX Designer |
| michael@test.com | Michael Davis | ML Engineer |
| emily@test.com | Emily Rodriguez | Product Manager |
| david@test.com | David Kim | DevOps Engineer |
# Test login
curl -X POST http://localhost:5001/api/auth/login \
-H "Content-Type: application/json" \
-d '{"email":"alex@test.com","password":"Test123"}'
# Check backend health
curl http://localhost:5001/api/health- Create account at MongoDB Atlas
- Create free M0 cluster (512MB)
- Get connection string
- Update
server/.env:MONGODB_URI=mongodb+srv://username:password@cluster.mongodb.net/crewlyx NODE_ENV=production
Development (server/.env):
PORT=5001
MONGODB_URI=mongodb://localhost:27017/crewlyx
JWT_SECRET=your-secret-key
JWT_EXPIRES_IN=7d
NODE_ENV=development
CORS_ORIGIN=http://localhost:3000Production:
- Use strong JWT secret (32+ characters)
- Set secure CORS origin
- Use MongoDB Atlas connection string
- Enable HTTPS
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the project
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- Inspired by Tinder's swipe interface
- Icons from Lucide React
- Profile photos from Unsplash
- Built with ❤️ for the builder community
Project Link: https://github.com/yourusername/crewlyx
**Issues: ** https://github.com/yourusername/crewlyx/issues
⭐ Star this repo if you find it helpful! ⭐
CrewlyX - Where great teams begin