Take control of your growth—professionally, personally, and daily.
ProdHub is a modern, all-in-one web application built to help you organize, achieve, and grow. Seamlessly manage projects, tasks, habits, and your calendar from a single, intuitive platform—all with smart AI-powered features and robust security.
Try ProdHub Now
🌐 Web App: https://my-productivity-hub-5a3ba.web.app/
🧩 Chrome Extension: ProdHub on the Chrome Web Store (coming soon)
Dashboard Overview
Get a snapshot of your productivity: overdue tasks, upcoming deadlines, and overall progress all at a glance. With the AI Daily Planner, you can get a prioritized and motivational schedule for your day with a single click.
AI-Powered Goal Decomposition
Don't just manage projects; create them with purpose. Give the AI Goal Planner a high-level goal like "Learn web development," and it will intelligently break it down into a structured plan with multiple sub-projects and all the necessary tasks, neatly organized in your sidebar.
Hierarchical Project Management
Track everything from courses and conferences to personal projects. Projects can be created manually or generated by the AI as part of a larger goal. Each project gets its own page with a dynamic progress bar that updates as you complete tasks.
Task Management
Break down projects into actionable steps. Set priorities (High, Medium, Low), assign due dates, and check off completed tasks with ease.
Advanced AI-Powered Planning (Gemini API Integrated)
ProdHub uses the Google Gemini API for smart, context-aware planning:
-
Goal Decomposition: Turns your big ambitions into actionable projects. And with AI generated pre tasks for better understanding.
-
Daily Planning: Creates a prioritized daily schedule based on your tasks and calendar.
-
Smart Scheduling: The "Plan My Day" button on the dashboard will trigger an AI that acts as a productivity coach. It will analyze overdue tasks, today's high-priority items, and your fixed Google Calendar appointments.
-
Actionable Output: Instead of just a list, the AI will generate a suggested schedule with time blocks and priorities. It will be presented in a clean, easy-to-read modal.
-
Context-Aware: If you haven't synced your calendar, the planner will still work with your tasks but will also gently remind you that connecting your calendar can lead to even better plans.
-
-
Task Generation: Generates intelligent task lists for your projects, using your project title and synced Google Calendar events for context.
Habit Tracker: Build better routines with a full-featured habit tracker. Set daily habits, check them off, and track your consistency and streaks over time. You can easily edit or delete habits as your goals evolve.
Unified Schedule: See all your project deadlines, task due dates (including overdue items), and Google Calendar events beautifully organized in one timeline - no more switching between apps.
Secure Calendar Integration: Sync your Google Calendar securely and privately. ProdHub only reads event information to help you plan and never stores or modifies your calendar data. Your data stays yours.
ProdHub is also available as a Chrome side panel extension, so you can access your full productivity dashboard without leaving your current tab.
- Opens as a side panel — keeps your current tab intact
- Full access to all ProdHub features: tasks, habits, goals, schedule, and AI planner
- Responsive UI — compact, mobile-friendly layout optimized for the narrow side panel
- Secure Google sign-in via Firebase Authentication
- Real-time sync with your Firestore data across web and extension
-
Build the extension bundle:
npm run build:extension
This runs
react-scripts buildand then copiesmanifest.extension.json→build/manifest.json, making thebuild/folder a valid Chrome extension package. -
Load in Chrome:
- Open
chrome://extensions/in your browser - Toggle Developer mode ON (top right)
- Click "Load unpacked"
- Select the
build/folder
- Open
-
Open the side panel:
- Click the ProdHub icon in your Chrome toolbar
- The side panel will open. Sign in with Google to get started.
Follow these steps to publish your own instance of the extension:
npm run build:extensionThen create a ZIP of the build/ folder contents (not the folder itself — the manifest.json must be at the root of the ZIP):
# PowerShell (Windows)
Compress-Archive -Path .\build\* -DestinationPath prodhub-extension.zip# macOS / Linux
cd build && zip -r ../prodhub-extension.zip . && cd ..Important
Verify that manifest.json is at the root of the ZIP (not inside a subfolder). Chrome will reject the package otherwise.
- Go to the Chrome Developer Dashboard
- Sign in with your Google account
- Pay the one-time $5 developer registration fee if this is your first extension
- Click "New Item" in the dashboard
- Drag and drop
prodhub-extension.zipinto the upload area - Wait for it to process — you will be taken to the listing editor
Fill in the following required fields:
| Field | Suggested Value |
|---|---|
| Name | ProdHub – Productivity Side Panel |
| Short description | All-in-one productivity: tasks, habits, goals & AI planner in your Chrome side panel. |
| Category | Productivity |
| Language | English |
| Screenshots | At least 1 screenshot (1280×800 or 640×400 px) |
| Privacy Policy URL | Link to your privacy policy (required if you handle user data) |
Note
ProdHub uses Firebase Authentication and Firestore. In the Privacy Practices tab you must declare that your extension collects user authentication data (email, name) stored in Firebase.
- Set visibility to Public (or Unlisted for testing)
- Click "Submit for Review"
- Review typically takes a few hours to a few days
The extension uses manifest_version: 3 with the following key configuration:
{
"name": "ProdHub Chrome Extension",
"version": "1.0",
"manifest_version": 3,
"permissions": ["sidePanel", "identity"],
"side_panel": { "default_path": "index.html" },
"action": { "default_title": "Open ProdHub Panel" }
}The extension manifest lives at public/manifest.extension.json and is automatically copied to build/manifest.json by the build:extension script.
ProdHub is built for speed, reliability, and a great user experience.
- Frontend: React.js
- Backend & Database: Firebase (Firestore, Authentication)
- Styling: Tailwind CSS
- AI Integration: Google Gemini API
- Calendar Integration: Google Calendar API via Google Identity Services
- Extension: Chrome Manifest V3 Side Panel API
Follow these steps to run ProdHub locally and customize it for your workflow.
- Node.js (v18 or later): Download Here
- Firebase CLI (install globally):
npm install -g firebase-tools - Google Account (for Firebase and Google Cloud projects)
git clone https://github.com/Rupesh4604/my-productivity-hub.git
cd my-productivity-hubnpm install-
Create a Firebase project at the Firebase Console.
-
Enable Firestore: Go to Build > Firestore Database and create a database in Production mode.
-
Update Firestore Rules: In the Rules tab, paste:
rules_version = '2'; service cloud.firestore { match /databases/{database}/documents { match /artifacts/{appId}/users/{userId}/{document=**} { allow read, write: if request.auth != null && request.auth.uid == userId; } } } -
Enable Authentication: Go to Build > Authentication, click Get Started, and enable Google and Email/Password sign-in.
- Google Calendar:
Enable the Google Calendar API, configure the OAuth consent screen, and get your Client ID using the project documentation. - Gemini API:
Visit Google AI Studio to create and copy your Gemini API key.
Create a .env.local file in your project root and add:
# FIREBASE CONFIGURATION
REACT_APP_FIREBASE_API_KEY="YOUR_API_KEY"
REACT_APP_FIREBASE_AUTH_DOMAIN="YOUR_AUTH_DOMAIN"
REACT_APP_FIREBASE_PROJECT_ID="YOUR_PROJECT_ID"
REACT_APP_FIREBASE_STORAGE_BUCKET="YOUR_STORAGE_BUCKET"
REACT_APP_FIREBASE_MESSAGING_SENDER_ID="YOUR_SENDER_ID"
REACT_APP_FIREBASE_APP_ID="YOUR_APP_ID"
# GOOGLE API KEYS
REACT_APP_GOOGLE_CLIENT_ID="YOUR_GOOGLE_CLIENT_ID"
REACT_APP_GEMINI_API_KEY="YOUR_GEMINI_API_KEY"Update src/App.js to use these variables for your firebaseConfig.
| Command | Description |
|---|---|
npm start |
Start local dev server at http://localhost:3000 |
npm run build |
Build production web app |
npm run build:extension |
Build Chrome extension package in build/ |
firebase deploy |
Deploy web app to Firebase Hosting |
This project is fully containerized, allowing you to run it in a consistent and isolated environment with a single command.
- Docker Desktop installed and running on your machine.
-
Clone the Repository
git clone https://github.com/Rupesh4604/my-productivity-hub.git cd ProdHub -
Create an Environment File Create a file named
.envin the root of the project. Copy the contents of.env.localor add the following variables, replacing the placeholder values with your actual credentials:REACT_APP_FIREBASE_API_KEY=AIzaSy... REACT_APP_FIREBASE_AUTH_DOMAIN=your-project-id.firebaseapp.com REACT_APP_FIREBASE_PROJECT_ID=your-project-id REACT_APP_FIREBASE_STORAGE_BUCKET=your-project-id.appspot.com REACT_APP_FIREBASE_MESSAGING_SENDER_ID=1234567890 REACT_APP_FIREBASE_APP_ID=1:1234567890:web:abcdef123456 REACT_APP_GOOGLE_CLIENT_ID=your-google-client-id.apps.googleusercontent.com REACT_APP_GEMINI_API_KEY=your-gemini-api-key
-
Build and Run the Container
docker-compose up --build
-
Access the Application Once the container is running, open your browser at http://localhost:3000.
To stop, pressCtrl + Cin your terminal.
Start your journey with ProdHub today.
OpenSourceEnv is a dedicated initiative focused on democratizing access to high-quality education in various domains of technology. Our mission is to provide comprehensive resources that empower learners at all levels to master new skills and technologies. We are committed to fostering an inclusive learning environment where everyone can thrive.
Community Page: OpenSourceEnv Teamspace
Github: https://github.com/openSourceEnv
This project is licensed under the MIT License. For details, refer to the LICENSE.md file. You can find terms & conditions and other privacy related details at prodhub-info.
Created by: Rupesh Kumar Yadav Mediboyina, Email: rupesh32003@gmail.com
LinkedIn: www.linkedin.com/in/mediboyina-rupesh-kumar-yadav-8b7a14205
