WidgetHub is a React-based web app that showcases a collection of small, interactive projects and reusable UI components. It includes a search and category filter to easily find specific projects like Accordions, Counters, Dice Rollers, Password Manager and more.
✅ Search Bar – Quickly find components/projects
✅ Category Filters – Filter projects by type (Games, UI Components, Utlity Tools, etc.)
✅ Grid Layout – Responsive card-based display
✅ Dynamic Routing – Each project opens in a new page
✅ Animations – Powered by Framer Motion for smooth transitions.
✅ Modern UI – Glassmorphism-inspired styling with CSS & SCSS.
Check out the live version: WidgetHub
WidgetHub/
│── src/
│ ├── components/ # Reusable components
│ ├── pages/ # Pages for individual widgets
│ ├── assets/ # Images and icons
│ │ ├── styles/ # Global CSS & SCSS styles
│ ├── App.js # Main App Component
│ ├── index.js # Entry Point
│
│── public/ # Static assets
│── README.md # Project Documentation
│── package.json # Dependencies & Scripts
- Frontend: React.js, React Router
- CSS & SCSS – Lightweight and customizable styling
- Routing: React Router
- State Management: useState, useEffect
🚀 Installation & Setup
1️⃣ Clone the repository:
git clone https://github.com/72umesh/WidgetHub.git
2️⃣ Navigate to the project folder:
cd WidgetHub
3️⃣ Install dependencies:
npm install
4️⃣ Run the project:
npm run dev
5️⃣ Open in Browser:Your app will be running at http://localhost:5173/ (if using Vite).
📂 Adding a New Project
Want to add your own component? Follow these steps:
- Inside src/components/, create a new folder:
/NewComponent
├── NewComponent.jsx
├── NewComponent.css
-
Write your component logic in NewComponent.jsx.
-
Import & register it inside the projects.js file.
This project is open-source under the MIT License.
Contributions are welcome! Feel free to fork the repo and submit a pull request.
If you like this project, star the repository and share it with others!
Made with ❤️ by Umesh
📬 Connect with Me
💼 Portfolio: https://umeshpalportfolio.vercel.app/
📧 Email: umeshpal8141@gmail.com