A full-stack hostel management platform with real-time chat, marketplace, notifications, and cross-platform mobile support.
- 🔐 Authentication — Email/password auth with Supabase, session persistence, and post-login onboarding flow
- 💬 Real-Time Chat — One-on-one messaging with presence indicators, typing status, and optimistic UI updates via Supabase Realtime
- 🛒 Marketplace — Create and browse listings with multi-image upload, client-side compression (WebP), and thumbnail generation
- 🔔 Notifications — In-app notification system with realtime subscriptions, unread counts, and mark-as-read functionality
- 📱 Cross-Platform — Responsive web app wrapped with Capacitor for native Android/iOS deployment
- 🎨 Premium UI — Glassmorphic design system with Framer Motion animations, dark mode support, and adaptive navigation (bottom bar on mobile, sidebar on desktop)
- 🖼️ Image Pipeline — Automatic image compression with iterative quality loop, cover crop thumbnails, and WebP conversion
- 🛡️ Error Resilience — Global error boundary, auth failsafes, and PWA service worker with cache management
| Layer | Technology |
|---|---|
| Frontend | React 18, TypeScript, Vite, TailwindCSS, shadcn/ui, Framer Motion |
| Backend | Supabase (PostgreSQL, Auth, Realtime, Storage) |
| Mobile | Capacitor (Android/iOS native wrapping) |
| State | React Context, React Router |
| Deployment | Vercel (web), Android Studio (APK) |
- Node.js ≥ 18
- npm or pnpm
- A Supabase project
# Clone the repository
git clone https://github.com/Dharya-dev/hostel-helper.git
cd hostel-helper
# Install dependencies
npm install
# Set up environment variables
cp .env.example .env
# Add your Supabase URL and anon key to .env
# Start the development server
npm run dev# Build for production
npm run build
# Sync with Capacitor
npx cap sync android
# Open in Android Studio
npx cap open androidhostel-helper/
├── public/ # Static assets and service worker
├── src/
│ ├── components/ # Reusable UI components
│ ├── pages/ # Route-level page components
│ ├── hooks/ # Custom React hooks
│ ├── integrations/ # Supabase client and API layer
│ ├── utils/ # Image compression, helpers
│ └── App.tsx # Root component with routing
├── supabase/
│ └── migrations/ # Database schema migrations
├── android/ # Capacitor Android project
└── capacitor.config.ts # Capacitor configuration
Contributions are welcome! Please open an issue first to discuss what you'd like to change.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'feat: add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is open source and available under the MIT License.
Built with ❤️ by Dharya Gangwar