{"id":43048385,"url":"https://github.com/hummbl-dev/hummbl-io","last_synced_at":"2026-01-31T10:09:27.138Z","repository":{"id":318993786,"uuid":"1077201472","full_name":"hummbl-dev/hummbl-io","owner":"hummbl-dev","description":"Highly Useful Mental Model Base Language (HUMMBL)","archived":false,"fork":false,"pushed_at":"2026-01-20T22:16:13.000Z","size":2818,"stargazers_count":0,"open_issues_count":5,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-01-21T07:19:11.418Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://hummbl.io","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hummbl-dev.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":"AGENTS.md","dco":null,"cla":null}},"created_at":"2025-10-15T23:34:02.000Z","updated_at":"2026-01-20T22:16:18.000Z","dependencies_parsed_at":"2025-10-17T16:37:47.101Z","dependency_job_id":"6291a40b-ec08-4db2-ac5d-326f27cd5196","html_url":"https://github.com/hummbl-dev/hummbl-io","commit_stats":null,"previous_names":["hummbl-dev/hummbl-io"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/hummbl-dev/hummbl-io","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hummbl-dev%2Fhummbl-io","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hummbl-dev%2Fhummbl-io/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hummbl-dev%2Fhummbl-io/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hummbl-dev%2Fhummbl-io/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hummbl-dev","download_url":"https://codeload.github.com/hummbl-dev/hummbl-io/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hummbl-dev%2Fhummbl-io/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28937877,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-31T08:53:31.997Z","status":"ssl_error","status_checked_at":"2026-01-31T08:51:38.521Z","response_time":128,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-01-31T10:09:26.594Z","updated_at":"2026-01-31T10:09:27.132Z","avatar_url":"https://github.com/hummbl-dev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# HUMMBL\n\n**120 Mental Models for Strategic Thinking**\n\nA modern web application for exploring and searching the HUMMBL (Highly Useful Mental Model Base Language) framework - a comprehensive collection of mental models organized into six core transformations.\n\n🌐 **Live Site:** [hummbl.io](https://hummbl.io)\n\n---\n\n## 📚 Documentation\n\nFor detailed development setup and guidelines, see the [Development Guide](docs/DEVELOPMENT.md).\n\n## 🎯 Overview\n\nHUMMBL provides an interactive interface to browse, search, and learn about 120 mental models that enhance strategic thinking and decision-making. Each model includes:\n\n- **Code**: Unique identifier for quick reference (e.g., P1, IN5, CO12)\n- **Name**: The mental model's title\n- **Definition**: Clear explanation of the concept\n- **Example**: Practical application scenario\n- **Transformation**: Classification into one of six cognitive transformations\n\n---\n\n## 🧠 Six Transformations\n\nThe mental models are organized into six fundamental transformations:\n\n| Code   | Transformation | Description                                |\n| ------ | -------------- | ------------------------------------------ |\n| **P**  | Perspective    | Viewing situations from different angles   |\n| **IN** | Inversion      | Thinking backwards or opposite             |\n| **CO** | Composition    | Combining elements together                |\n| **DE** | Decomposition  | Breaking down into parts                   |\n| **RE** | Recursion      | Self-referential patterns and iteration    |\n| **SY** | Meta-Systems   | Systems thinking and higher-order patterns |\n\nEach transformation contains 20 models (P1-P20, IN1-IN20, etc.)\n\n---\n\n## ✨ Features\n\n- **🔍 Search**: Find models by name, code, or keywords in definitions\n- **🎯 Filter**: Browse by transformation type (P, IN, CO, DE, RE, SY)\n- **📱 Responsive**: Works seamlessly on desktop, tablet, and mobile\n- **⚡ Fast**: Built with Vite for instant loading and smooth interactions\n- **🎨 Clean UI**: Card-based grid with expandable detail views\n\n---\n\n## 🚀 Getting Started\n\n### Prerequisites\n\n- Node.js 20.x or later\n- pnpm 8.x or later\n- Git\n\n### Installation\n\n1. Clone the repository:\n\n   ```bash\n   git clone https://github.com/your-username/hummbl-io.git\n   cd hummbl-io\n   ```\n\n2. Install dependencies:\n\n   ```bash\n   pnpm install\n   ```\n\n3. Set up environment variables:\n   ```bash\n   cp .env.example .env\n   # Edit .env with your configuration\n   ```\n\n### Development\n\nStart the development server:\n\n```bash\npnpm dev\n```\n\n### Building for Production\n\n```bash\npnpm build\npnpm preview\n```\n\n### Testing\n\nRun unit tests:\n\n```bash\npnpm test\n```\n\nRun performance tests:\n\n```bash\npnpm test:perf\npnpm test:auth\n```\n\n### Linting and Formatting\n\n```bash\n# Lint code\npnpm lint\n\n# Format code\npnpm format\n\n# Check TypeScript types\npnpm typecheck\n```\n\n### Git Hooks\n\nThis project uses Husky for Git hooks. After cloning, run:\n\n```bash\npnpm prepare\n```\n\nThis will set up pre-commit hooks that run linting and formatting automatically.\n\n## 📊 Analytics\n\nThe application includes a robust analytics system that tracks user interactions while respecting privacy. The system supports multiple analytics providers and is designed to be performant and reliable.\n\n### Key Features\n\n- **Multi-provider Support**: Tracks events in both Plausible and Google Analytics\n- **Type Safety**: Full TypeScript support with strict type checking\n- **Performance Optimized**: Lightweight and non-blocking\n- **Comprehensive Testing**: Extensive test coverage for all tracking functions\n- **Privacy-Focused**: No personally identifiable information (PII) is collected by default\n\n### Available Tracking Methods\n\n```typescript\n// Basic event tracking\ntrackEvent({\n  event: 'button_click',\n  category: 'engagement',\n  label: 'Signup Button',\n  properties: {\n    button_position: 'hero',\n    button_color: 'blue',\n  },\n});\n\n// Page view tracking\ntrackPageView('/dashboard', 'Dashboard Page');\n\n// Predefined events\ntrackSearchPerformed('mental models', 15);\ntrackMentalModelViewed('P1', 'First Principles');\n```\n\n### Configuration\n\nInitialize analytics in your main application file:\n\n```typescript\nimport { initAnalytics } from './utils/analytics';\n\ninitAnalytics({\n  debug: process.env.NODE_ENV === 'development',\n  trackPageViews: true,\n  trackErrors: true,\n  sampleRate: 1.0, // 100% of sessions\n});\n```\n\n### Testing\n\nRun the test suite:\n\n```bash\n# Run all analytics tests\npnpm test:analytics\n\n# Run edge case tests\npnpm test:analytics:edge-cases\n```\n\nFor more details, see the [Analytics Documentation](./docs/ANALYTICS.md).\n\n## 🤝 Contributing\n\n1. Fork the repository\n2. Create a feature branch: `git checkout -b feature/amazing-feature`\n3. Commit your changes: `git commit -m 'Add some amazing feature'`\n4. Push to the branch: `git push origin feature/amazing-feature`\n5. Open a pull request\n\n## 📄 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n### Prerequisites\n\n- **Node.js** (v16 or higher)\n- **npm** or **yarn**\n\n### Installation\n\n1. **Clone the repository:**\n\n   ```bash\n   git clone https://github.com/[YOUR-USERNAME]/hummbl-io.git\n   cd hummbl-io\n   ```\n\n2. **Install dependencies:**\n\n   ```bash\n   npm install\n   ```\n\n3. **Start the development server:**\n\n   ```bash\n   npm run dev\n   ```\n\n4. **Open your browser:**\n   ```\n   http://localhost:5173\n   ```\n\n---\n\n## 📦 Build \u0026 Deployment\n\n### Local Production Build\n\nTo create an optimized production build:\n\n```bash\nnpm run build\n```\n\nThe build artifacts will be generated in the `dist/` directory.\n\nTo preview the production build locally:\n\n```bash\nnpm run preview\n```\n\n### Deploy to Vercel\n\nThis project is configured for Vercel deployment:\n\n1. **Connect to Vercel:**\n   - Push your repository to GitHub\n   - Import project in [Vercel Dashboard](https://vercel.com/new)\n   - Vercel auto-detects Vite configuration\n\n2. **Configure Build Settings:**\n   - **Framework Preset:** Vite\n   - **Build Command:** `npm run build`\n   - **Output Directory:** `dist`\n   - **Install Command:** `npm install`\n\n3. **Add Custom Domain** (optional):\n   - Go to Project Settings → Domains\n   - Add your domain (e.g., `hummbl.io`)\n   - Update DNS records as shown by Vercel\n\n### Deploy to Other Platforms\n\n**Cloudflare Pages:**\n\n```bash\nnpm run build\nnpx wrangler pages deploy dist --project-name=hummbl-io\n```\n\n**Netlify:**\n\n```bash\nnpm run build\n# Drag and drop dist/ folder to Netlify\n```\n\n---\n\n## 🛠️ Tech Stack\n\n- **React 18** - UI library\n- **TypeScript** - Type safety and developer experience\n- **Vite** - Next-generation build tool with HMR\n- **CSS3** - Custom styling (no framework needed)\n\n### Dependencies\n\n```json\n{\n  \"dependencies\": {\n    \"react\": \"^18.2.0\",\n    \"react-dom\": \"^18.2.0\"\n  },\n  \"devDependencies\": {\n    \"@types/react\": \"^18.2.43\",\n    \"@types/react-dom\": \"^18.2.17\",\n    \"@vitejs/plugin-react\": \"^4.2.1\",\n    \"typescript\": \"^5.2.2\",\n    \"vite\": \"^5.0.8\"\n  }\n}\n```\n\n---\n\n## 📁 Project Structure\n\n```\nhummbl-io/\n├── public/\n│   └── models.json          # All 120 mental models (data source)\n├── src/\n│   ├── App.tsx              # Main application component\n│   ├── App.css              # Component styles\n│   ├── index.css            # Global styles\n│   └── main.tsx             # Application entry point\n├── index.html               # HTML template\n├── package.json             # Dependencies and scripts\n├── tsconfig.json            # TypeScript configuration\n├── vite.config.ts           # Vite configuration\n└── vercel.json              # Deployment configuration\n```\n\n---\n\n## 🎨 Usage\n\n### Searching Models\n\nUse the search bar to find models by:\n\n- **Model name** (e.g., \"First Principles\")\n- **Model code** (e.g., \"P1\")\n- **Keywords** in definitions (e.g., \"feedback\", \"decomposition\")\n\nThe search is case-insensitive and searches across all model fields.\n\n### Filtering by Transformation\n\nClick transformation filter buttons to view models by type:\n\n- **All** - View all 120 models\n- **P - Perspective** - Models focused on viewpoint shifts\n- **IN - Inversion** - Models using reverse thinking\n- **CO - Composition** - Models about combining elements\n- **DE - Decomposition** - Models about breaking down complexity\n- **RE - Recursion** - Models with self-referential patterns\n- **SY - Meta-Systems** - Models for systems-level thinking\n\n### Viewing Model Details\n\nClick any model card to expand and view:\n\n- Complete definition\n- Practical example application\n- Transformation classification\n- Tier level (1-20)\n\nClick outside or on another card to close the detail view.\n\n---\n\n## 🔧 Customization\n\n### Adding or Modifying Models\n\nModels are stored in `public/models.json`. Each model follows this structure:\n\n```json\n{\n  \"code\": \"P1\",\n  \"name\": \"First Principles Framing\",\n  \"transformation\": \"P\",\n  \"tier\": 1,\n  \"definition\": \"Reduce complex problems to foundational truths...\",\n  \"example\": \"When redesigning pricing strategy, start with unit costs...\"\n}\n```\n\nAfter modifying `models.json`, restart the development server.\n\n### Styling\n\n- **Global styles:** `src/index.css`\n- **Component styles:** `src/App.css`\n- **Colors, spacing, typography** can be customized in CSS files\n\n---\n\n## 🐛 Troubleshooting\n\n### Build Issues\n\n**Error: \"Command 'vite build' exited with 127\"**\n\n- **Solution:** Ensure build command in deployment platform is set to `npm run build`, not `vite build`\n\n**Error: \"Module not found\"**\n\n- **Solution:** Delete `node_modules` and `package-lock.json`, then run `npm install`\n\n**TypeScript errors during build**\n\n- **Solution:** Run `npm run build` locally first to catch type errors\n- Check `tsconfig.json` configuration\n\n### Development Server Issues\n\n**Port 5173 already in use**\n\n- **Solution:** Kill the existing process or change port in `vite.config.ts`:\n  ```ts\n  export default defineConfig({\n    plugins: [react()],\n    server: { port: 3000 },\n  });\n  ```\n\n**Hot reload not working**\n\n- **Solution:** Check browser console for errors\n- Restart dev server with `npm run dev`\n\n---\n\n## 📚 About HUMMBL Framework\n\nThe HUMMBL Mental Models Framework is a comprehensive collection of 120 cognitive tools for strategic thinking, organized into six transformations with 20 tiers each.\n\n**Framework Structure:**\n\n- **Base6**: 6 foundational models (one per transformation)\n- **Base42**: 42 core models (first 7 tiers)\n- **Base90**: 90 essential models (first 15 tiers)\n- **Base120**: Complete collection (all 20 tiers)\n\nFor more information about the framework itself, visit the documentation (coming soon).\n\n---\n\n## 🤝 Contributing\n\nContributions are welcome! Areas for contribution:\n\n- **Bug reports** - Found an issue? Open a GitHub issue\n- **Feature requests** - Have an idea? Suggest it via issues\n- **Model improvements** - Suggest edits to definitions or examples\n- **UI/UX enhancements** - Improve the interface\n- **Documentation** - Help improve this README or add guides\n\n### Development Workflow\n\n1. Fork the repository\n2. Create a feature branch (`git checkout -b feature/amazing-feature`)\n3. Make your changes\n4. Test locally (`npm run dev` and `npm run build`)\n5. Commit your changes (`git commit -m 'Add amazing feature'`)\n6. Push to the branch (`git push origin feature/amazing-feature`)\n7. Open a Pull Request\n\n---\n\n## 📄 License\n\nThis project is licensed under the MIT License - see the LICENSE file for details.\n\n---\n\n## 🌟 Acknowledgments\n\n- **HUMMBL Framework** - Original mental models framework\n- **React Team** - For the excellent UI library\n- **Vite Team** - For the blazing-fast build tool\n- **Vercel** - For seamless deployment platform\n\n---\n\n## 📧 Contact\n\n**Website:** [hummbl.io](https://hummbl.io)\n\nFor questions, feedback, or bug reports:\n\n- Open an issue on GitHub\n- Visit the live site for more information\n\n---\n\n**HUMMBL Mental Models Framework v1.0** - Base120 Complete Collection\n\n---\n\n🚀 **CI/CD Status:** Automated testing and deployment enabled via GitHub Actions\n\n\u003c!-- Deployment test 2025-10-22 --\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhummbl-dev%2Fhummbl-io","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhummbl-dev%2Fhummbl-io","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhummbl-dev%2Fhummbl-io/lists"}