🚀 RestoManager - The Ultimate React Restaurant POS & CRM

RestoManager is a modern, high-performance Web Application designed for restaurants, cafes, bars, and food trucks. Built with the latest technology stack (React, Vite, TypeScript, and Tailwind CSS), it offers a blazing-fast experience that feels like a native mobile app.

📱 Mobile App Experience (PWA)

RestoManager is built as a Progressive Web App (PWA). This means:

• No App Store needed: Install it directly from the browser on Android and iOS.
• Native Feel: It adds an icon to your phone's home screen and runs full-screen without browser bars.
• Cost Effective: Waiters can take orders directly at the table using their own smartphones—no need to buy expensive dedicated hardware!

Unlike traditional POS systems, RestoManager features a unique Dual-Mode System:

• 🟢 Demo Mode (Offline): Works instantly out of the box with local storage. Perfect for testing or single-device use.
• ☁️ Production Mode (Firebase): Syncs data in real-time across multiple devices (Kitchen, Waiter, Cashier) using Google Firebase.

✨ Why Choose RestoManager?

It is a complete White Label solution. You can change the App Name and Theme Colors directly from the settings menu without touching a single line of code!

Feature List:
- ⚡ Built with React 18, Vite, TypeScript, and Tailwind CSS.
- 📱 Mobile-First Design: Looks and behaves like a Native App on smartphones.
- 📲 PWA Ready: "Add to Home Screen" support for iOS & Android.
- 🔥 Real-time Database integration with Google Firebase (Free Tier compatible).
- 🎨 White Label Settings: Change App Name & Theme Colors via UI.
- 👥 Role-Based Access: Admin, Manager, Waiter, and Kitchen Staff roles.
- 🛒 Point of Sale (POS): Touch-friendly interface optimised for thumbs.
- 👨‍🍳 Kitchen Display System (KDS): Real-time order updates for cooks.
- 📊 Dashboard & Reports: Sales statistics, top products, and staff performance.
- 🔒 Secure Authentication: Email/Password login with Firebase Auth.
- 🌑 Beautiful UI: Modern design with glassmorphism effects and dark mode elements.

• 💻 Device Compatibility: Works on Desktop, Tablet, and Mobile (Android & iOS).
• 🌐 Web Browser: Google Chrome (Recommended), Safari, Edge, or Firefox.
• ⚙️ Node.js: Version 16 or higher (Required for installation).
• 📦 NPM: Included with Node.js.
• 🔥 Google Firebase: Free account (for Database).
• 📝 Code Editor: VS Code (Recommended) if you want to edit the code.

🛠️ Part 1: Quick Installation

Need Help? A complete Step-by-Step PDF Manual is included in the download file. It also contains my personal email for Priority Support.

1. Unzip & Install:
   Extract the file, open your terminal in the folder, and run:
   npm install
2. Setup Database (Firebase):
   Create a free project at console.firebase.google.com.
   Copy your keys and paste them into: src/firebase.ts.
3. Start the Server:
   Run the command: npm run dev
   Access via browser at: http://localhost:5173

🎨 Part 2: Customization & Mobile Use

Make it Yours (White Label):

• Change Logo: Simply replace the logo.png file in the /public folder.
• Change App Icon: Replace the icon.png file in the same folder.
• Change App Name: Edit the title tag in index.html.

📱 How to use on Mobile (Wi-Fi):

1. On your PC terminal, run: npm run dev -- --host
2. Check the Network IP shown in the terminal (e.g., 192.168.1.5).
3. Type that IP in your phone's browser to access the POS instantly!