Connect skilled workers with customers. Showcase portfolios. Build trust with AI.
SkillBridge is a revolutionary marketplace platform connecting blue-collar professionals (electricians, plumbers, painters, beauticians, and more) with customers who need their services. Think of it as LinkedIn meets Urban Company – but powered by cutting-edge Google AI technologies.
"Finding a trustworthy electrician or plumber is hard. Verifying their work quality is even harder."
SkillBridge solves this by:
- 🤖 AI-powered profile creation from voice descriptions
- 📸 Work photo verification using Gemini AI
- 📍 Real-time nearby search with Google Maps
- ⭐ Verified ratings & reviews from Google Places
- ⚡ Instant gig matching with Firebase real-time sync
┌─────────────────────────────────────────────────────────────────┐
│ GEMINI AI INTEGRATION │
├─────────────────────────────────────────────────────────────────┤
│ │
│ 🎤 VOICE TO PROFILE │
│ Worker speaks → AI generates professional portfolio │
│ Model: gemini-3-flash-preview │
│ │
│ ✍️ GIG REFINEMENT │
│ Raw request → Professional job listing with budget │
│ Model: gemini-3-flash-preview │
│ │
│ 🔍 NEARBY SEARCH + GROUNDING │
│ AI-powered local service discovery │
│ Model: gemini-2.5-flash + Google Maps Tools │
│ │
│ 🖼️ WORK IMAGE VERIFICATION │
│ Photo → Authenticity score + Trust comment │
│ Model: gemini-3-flash-preview (Vision) │
│ │
└─────────────────────────────────────────────────────────────────┘
| Service | Usage |
|---|---|
| Authentication | Email/password sign-in with role-based access (Worker/Customer) |
| Cloud Firestore | Real-time NoSQL database for gigs, users, professionals |
| Real-time Listeners | Instant sync when gigs are posted or accepted |
| Security Rules | Role-based data access control |
| API | Functionality |
|---|---|
| Places Nearby Search | Find electricians, plumbers, beauticians near you |
| Places Text Search | Flexible search like "AC repair near Koramangala" |
| Place Details | Phone, website, hours, reviews for each business |
| Place Photos | Display real business photos |
| Geocoding | Convert addresses ↔ coordinates |
| Distance Matrix | Calculate distance & travel time |
| Maps JavaScript | Interactive map with custom markers & radius |
|
|
| Feature | Description |
|---|---|
| 🔐 Dual Authentication | MongoDB backend + Firebase Auth |
| 👥 Role-based Dashboards | Different UX for workers vs customers |
| 🔔 Toast Notifications | Real-time feedback on actions |
| 🗺️ Interactive Maps | Full Google Maps with markers, info windows |
| ⚡ Real-time Sync | Instant updates across devices |
| 📱 Mobile-first Design | Responsive with bottom navigation |
| ⚡ Electrician | 🔧 Plumber | 🎨 Painter | 💇 Beautician | 🚗 Mechanic |
|---|---|---|---|---|
| 🪵 Carpenter | ✨ Cleaning | 🍳 Cook/Chef | ❄️ AC Repair | 🌿 Gardener |
React 19.2 → UI Framework
TypeScript → Type Safety
Vite 6.2 → Build Tool
Lucide → Icons
Recharts → Charts
Axios → HTTP Client
Node.js → Runtime
Express 4 → API Server
MongoDB → Database
Mongoose 8 → ODM
JWT → Auth Tokens
bcryptjs → Password Hashing
Gemini AI → Generative AI
Firebase → Auth + Database
Maps APIs → Location Services
- Node.js 18+ installed
- MongoDB running locally or Atlas connection
- Google Cloud API keys (Gemini, Maps, Firebase)
# Clone the repository
git clone https://github.com/yourusername/skillbridge-ai.git
cd skillbridge-ai
# Install frontend dependencies
npm install
# Install backend dependencies
cd backend
npm install
cd ..Create .env.local in root:
# Gemini AI
API_KEY=your_gemini_api_key
# Google Maps
VITE_GOOGLE_MAPS_API_KEY=your_maps_api_key
# Firebase
VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com
VITE_FIREBASE_PROJECT_ID=your-project-id
VITE_FIREBASE_STORAGE_BUCKET=your-project.appspot.com
VITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
VITE_FIREBASE_APP_ID=your_app_idCreate backend/.env:
PORT=5001
MONGODB_URI=mongodb://localhost:27017/skillbridge
JWT_SECRET=your_super_secret_jwt_key
GOOGLE_MAPS_API_KEY=your_maps_api_key# Terminal 1: Start backend
cd backend
npm start
# Terminal 2: Start frontend
npm run dev🎉 Open http://localhost:5173 in your browser!
skillbridge-ai/
├── 📁 backend/
│ ├── 📁 config/ # Database configuration
│ ├── 📁 middleware/ # Auth middleware
│ ├── 📁 models/ # Mongoose schemas
│ ├── 📁 routes/
│ │ ├── auth.js # Authentication routes
│ │ ├── gigs.js # Gig CRUD operations
│ │ ├── location.js # Distance & geocoding
│ │ └── places.js # Google Places integration
│ ├── 📁 services/
│ │ ├── locationService.js # Maps API wrapper
│ │ └── placesService.js # Places API wrapper
│ └── server.js # Express server
│
├── 📁 components/
│ ├── Landing.tsx # Home page
│ ├── Login.tsx # Authentication
│ ├── Marketplace.tsx # Browse professionals
│ ├── NearbyProfessionals.tsx # Google Places search
│ ├── ProfessionalMap.tsx # Interactive map
│ ├── FindWork.tsx # Real-time gig feed
│ ├── PostGig.tsx # AI-powered gig creation
│ ├── MyGigs.tsx # Manage gigs
│ ├── WorkGallery.tsx # Portfolio with AI verification
│ ├── ProfileCreator.tsx # AI profile generator
│ └── ...more components
│
├── 📁 services/
│ ├── authService.ts # Auth API calls
│ ├── firebaseService.ts # Firebase integration
│ └── geminiService.ts # Gemini AI integration
│
├── App.tsx # Main application
├── types.ts # TypeScript types
└── package.json
| Method | Endpoint | Description |
|---|---|---|
POST |
/api/auth/signup |
Register new user |
POST |
/api/auth/login |
User login |
GET |
/api/auth/me |
Get current user |
PUT |
/api/auth/profile |
Update profile |
| Method | Endpoint | Description |
|---|---|---|
GET |
/api/gigs |
List user's gigs |
POST |
/api/gigs |
Create new gig |
PUT |
/api/gigs/:id |
Update gig |
DELETE |
/api/gigs/:id |
Delete gig |
| Method | Endpoint | Description |
|---|---|---|
GET |
/api/places/nearby |
Search Google Places |
GET |
/api/location/nearby-professionals |
Find nearby workers |
┌──────────────────────────────────────────────────────────────────┐
│ CLIENT (React) │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ Landing │ │Marketplace│ │ Find Work │ │ Maps │ │
│ └────┬─────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘ │
│ │ │ │ │ │
│ └─────────────┼─────────────┼─────────────┘ │
│ │ │ │
└─────────────────────┼─────────────┼──────────────────────────────┘
│ │
┌─────────────┴─────────────┴─────────────┐
│ │
▼ ▼
┌───────────────────┐ ┌───────────────────┐
│ EXPRESS BACKEND │ │ FIREBASE │
│ ┌─────────────┐ │ │ ┌─────────────┐ │
│ │ Auth │ │ │ │ Firestore │◄─┼─── Real-time Sync
│ │ Gigs │ │ │ │ Auth │ │
│ │ Places │ │ │ └─────────────┘ │
│ │ Location │ │ └───────────────────┘
│ └─────────────┘ │
└────────┬──────────┘
│
▼
┌───────────────────┐ ┌───────────────────┐
│ MONGODB │ │ GOOGLE CLOUD │
│ ┌─────────────┐ │ │ ┌─────────────┐ │
│ │ Users │ │ │ │ Gemini AI │ │
│ │ Gigs │ │ │ │ Maps APIs │ │
│ │ Profiles │ │ │ │ Places API │ │
│ └─────────────┘ │ │ └─────────────┘ │
└───────────────────┘ └───────────────────┘
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- 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 ISC License.