{"id":32194982,"url":"https://github.com/zenkiet/ngx-feature-proxy","last_synced_at":"2025-10-22T02:08:40.841Z","repository":{"id":319109888,"uuid":"1074838681","full_name":"zenkiet/ngx-feature-proxy","owner":"zenkiet","description":"Angular feature flag library with Unleash integration, provides reactive programing, type-safe feature flag management with zero-configuration setup.","archived":false,"fork":false,"pushed_at":"2025-10-16T17:02:38.000Z","size":525,"stargazers_count":13,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-17T17:10:43.238Z","etag":null,"topics":["angular","bem","dashboard","feature-flags","library","reactive-programming","rxjs","scss","tool","unleash"],"latest_commit_sha":null,"homepage":"","language":"SCSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zenkiet.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","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":null,"dco":null,"cla":null}},"created_at":"2025-10-12T15:20:35.000Z","updated_at":"2025-10-17T15:54:29.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/zenkiet/ngx-feature-proxy","commit_stats":null,"previous_names":["zenkiet/ngx-feature-proxy"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/zenkiet/ngx-feature-proxy","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenkiet%2Fngx-feature-proxy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenkiet%2Fngx-feature-proxy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenkiet%2Fngx-feature-proxy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenkiet%2Fngx-feature-proxy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zenkiet","download_url":"https://codeload.github.com/zenkiet/ngx-feature-proxy/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenkiet%2Fngx-feature-proxy/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":280365621,"owners_count":26318385,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-22T02:00:06.515Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["angular","bem","dashboard","feature-flags","library","reactive-programming","rxjs","scss","tool","unleash"],"created_at":"2025-10-22T02:01:44.067Z","updated_at":"2025-10-22T02:08:40.835Z","avatar_url":"https://github.com/zenkiet.png","language":"SCSS","funding_links":[],"categories":["Architecture and Advanced Topics"],"sub_categories":["Feature Flags"],"readme":"# 🚀 ngx-feature-proxy\n\n\u003cdiv align=\"center\"\u003e\n\n\u003cimg align=\"center\" src=\"https://raw.githubusercontent.com/zenkiet/ngx-feature-proxy/refs/heads/main/assets/images/icon.png\" width=\"350\" height=\"350\" alt=\"Icon\"\u003e\n\n[![npm version](https://img.shields.io/npm/v/ngx-feature-proxy?style=flat-square\u0026logo=npm\u0026logoColor=white)](https://www.npmjs.com/package/ngx-feature-proxy)\n[![npm downloads](https://img.shields.io/npm/dm/ngx-feature-proxy?style=flat-square\u0026logo=npm\u0026logoColor=white)](https://www.npmjs.com/package/ngx-feature-proxy)\n[![npm bundle size](https://img.shields.io/bundlephobia/min/ngx-feature-proxy?style=flat-square\u0026logo=npm\u0026logoColor=white)](https://www.npmjs.com/package/ngx-feature-proxy)\n[![npm type definitions](https://img.shields.io/npm/types/ngx-feature-proxy?style=flat-square\u0026logo=typescript\u0026logoColor=white)](https://www.npmjs.com/package/ngx-feature-proxy)\n\n[![GitHub issues](https://img.shields.io/github/issues/zenkiet/ngx-feature-proxy?style=flat-square\u0026logo=github)](https://github.com/zenkiet/ngx-feature-proxy/issues)\n[![GitHub stars](https://img.shields.io/github/stars/zenkiet/ngx-feature-proxy?style=flat-square\u0026logo=github)](https://github.com/zenkiet/ngx-feature-proxy/stargazers)\n[![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/zenkiet/ngx-feature-proxy/release.yml?style=flat-square\u0026logo=github)](https://github.com/zenkiet/ngx-feature-proxy/actions)\n[![License](https://img.shields.io/github/license/zenkiet/ngx-feature-proxy?style=flat-square)](LICENSE)\n\n**🎯 Type-safe Angular Feature Flag Library with Unleash Integration**\n\n_Reactive programming • Zero-configuration setup • Enterprise-ready_\n\n[📦 NPM](https://www.npmjs.com/package/ngx-feature-proxy) • [🚀 Quick Start](#-quick-start) • [💬 Discussions](https://github.com/zenkiet/ngx-feature-proxy/discussions)\n\n\u003c/div\u003e\n\n[![Demo](https://img.youtube.com/vi/K-2rLjG7qyQ/maxresdefault.jpg)](https://youtu.be/K-2rLjG7qyQ)\n\n---\n\n## 📑 Table of Contents\n\n- [🌟 Features](#-features)\n- [📖 What is Unleash?](#-what-is-unleash)\n- [🏗️ Architecture](#️-architecture)\n- [🚀 Quick Start](#-quick-start)\n  - [📦 Installation](#-installation)\n  - [⚙️ Basic Setup](#️-basic-setup)\n  - [🎯 Your First Feature Flag](#-your-first-feature-flag)\n- [🎮 Usage Guide](#-usage-guide)\n  - [🔧 Service Usage](#-service-usage)\n  - [🎨 Directive Usage](#-directive-usage)\n    - [🎯 Simple Feature Check](#-simple-feature-check)\n    - [🎯 Complex Feature Check](#-complex-feature-check)\n  - [🛡️ Route Guards](#️-route-guards)\n    - [🎪 Advanced Guard Patterns](#-advanced-guard-patterns)\n- [🐳 Docker Setup with Unleash](#-docker-setup-with-unleash)\n  - [🐳 Complete Docker Compose Setup](#-complete-docker-compose-setup)\n  - [🌐 Access Your Unleash](#-access-your-unleash)\n- [🤝 Contributing](#-contributing)\n  - [🐛 Bug Reports](#-bug-reports)\n  - [✨ Feature Requests](#-feature-requests)\n  - [🛠️ Development Workflow](#️-development-workflow)\n  - [📝 Commit Convention](#-commit-convention)\n- [📄 License](#-license)\n- [🙏 Acknowledgments](#-acknowledgments)\n- [📞 Support](#-support)\n  - [🤝 Get Help \\\u0026 Connect](#-get-help--connect)\n  - [📊 Project Stats](#-project-stats)\n  - [🌟 Ready to get started?](#-ready-to-get-started)\n\n---\n\n## 🌟 Features\n\n| Feature                    | Description                                  |\n| -------------------------- | -------------------------------------------- |\n| 🐞 **Debug Tool**          | Built-in debug info for easy troubleshooting |\n| ✨ **Type-Safe**           | Full TypeScript support with strict typing   |\n| 🚀 **Performance**         | Optimized with caching and smart updates     |\n| 🛡️ **Route Protection**    | Support for guards to protect routes         |\n| 🎨 **Template Directives** | Declarative feature flag usage in templates  |\n| 🔧 **Flexible**            | Support for complex feature flag expressions |\n| 🌐 **Enterprise Ready**    | Can be deployed in large-scale applications  |\n\n## 📖 What is Unleash?\n\nUnleash is an open-source feature flag management platform that enables you to:\n\n| Capability                 | Benefit                                                            |\n| -------------------------- | ------------------------------------------------------------------ |\n| 🎛️ **Toggle Features**     | Enable/disable features instantly without deployments              |\n| 🎯 **Targeted Rollouts**   | Gradual feature rollouts to specific user segments                 |\n| 🧪 **A/B Testing**         | Run experiments with different feature variants                    |\n| 📊 **Analytics**           | Track feature usage and performance metrics                        |\n| 🔒 **Enterprise Security** | Role-based access control and audit logs                           |\n| 🌍 **Multi-Environment**   | Separate feature configurations for **develop/staging/production** |\n\n---\n\n## 🏗️ Architecture\n\n```mermaid\ngraph TB\n    subgraph APP[\"📱 Angular Application (Frontend)\"]\n        COMP[\"🧩 Components\"]\n        SERV[\"⚙️ FeatureProxyService\u003cbr/\u003e- Manage Feature Flags\u003cbr/\u003e- Check Access\"]\n        DIR[\"✨ FeatureProxy Directive\u003cbr/\u003e- Show/Hide UI based on Flags\"]\n        GUARD[\"🔐 FeatureProxy Guards\u003cbr/\u003e- Protect Routes\"]\n        SIGNAL[\"🔄 Signal State\u003cbr/\u003e- Reactive Updates\"]\n    end\n\n    subgraph UNLEASH[\"🚀 Unleash Infrastructure\"]\n        PROXY[\"📡 Unleash Proxy\u003cbr/\u003e- HTTP/WebSocket\u003cbr/\u003e- Real-time Updates\"]\n        SERVER[\"🎛️ Unleash Server\u003cbr/\u003e- Control Panel\u003cbr/\u003e- Manage Features\"]\n        DB[\"💾 PostgreSQL\u003cbr/\u003e- Data Storage\u003cbr/\u003e- Persistence\"]\n    end\n\n    subgraph USERS[\"👥 Users\"]\n        ENDUSER[\"👤 End Users\u003cbr/\u003e- Use Application\"]\n        DEVOPS[\"⚙️ DevOps Team\u003cbr/\u003e- Manage Flags\"]\n    end\n\n    %% Application Internal Flow\n    COMP --\u003e|\"use\"| SERV\n    COMP --\u003e|\"use\"| DIR\n    COMP --\u003e|\"use\"| GUARD\n    SERV --\u003e|\"update\"| SIGNAL\n    DIR --\u003e|\"check\"| SERV\n    GUARD --\u003e|\"verify\"| SERV\n\n    %% Communication with Unleash\n    SERV \u003c--\u003e|\"📡 HTTP/WebSocket\u003cbr/\u003e- Request Flags\u003cbr/\u003e- Real-time Sync\"| PROXY\n    PROXY \u003c--\u003e|\"🔄 Sync Flags\u003cbr/\u003e- Pull Configuration\"| SERVER\n    SERVER \u003c--\u003e|\"💾 Read/Write\u003cbr/\u003e- Feature Data\"| DB\n\n    %% User Interactions\n    ENDUSER --\u003e|\"🖱️ Interactions\u003cbr/\u003e- Trigger Features\"| COMP\n    DEVOPS --\u003e|\"⚙️ Toggle\u003cbr/\u003e- Manage Flags\"| SERVER\n\n    %% Styling\n    classDef angular fill:#DD0031,stroke:#333,stroke-width:2px,color:#fff,font-size:12px\n    classDef unleash fill:#7C3AED,stroke:#333,stroke-width:2px,color:#fff,font-size:12px\n    classDef users fill:#059669,stroke:#333,stroke-width:2px,color:#fff,font-size:12px\n\n    class COMP,SERV,DIR,GUARD,SIGNAL angular\n    class PROXY,SERVER,DB unleash\n    class ENDUSER,DEVOPS users\n```\n\n**🔄 How it Works:**\n\n1. **🎯 Feature Definition**: DevOps team defines feature flags in Unleash Server\n2. **📡 Real-time Sync**: Unleash Proxy pulls configurations and serves them via HTTP/WebSocket\n3. **🔧 Angular Integration**: ngx-feature-proxy connects to Unleash Proxy using unleash-proxy-client\n4. **📊 Reactive Updates**: Service uses Angular signals to provide real-time feature flag state\n5. **🎨 Template Magic**: Directives and guards automatically react to feature flag changes\n6. **👤 User Experience**: End users see features toggled instantly without page refreshes\n\n---\n\n## 🚀 Quick Start\n\n### 📦 Installation\n\n```bash\n# 🚀 Install the library\nnpm install ngx-feature-proxy\n```\n\n### ⚙️ Basic Setup\n\n```typescript\n// 📁 src/main.ts\nimport { bootstrapApplication } from '@angular/platform-browser';\nimport { provideFeatureProxy } from 'ngx-feature-proxy';\nimport { AppComponent } from './app/app.component';\n\nbootstrapApplication(AppComponent, {\n  providers: [\n    // 🎯 Configure feature proxy\n    provideFeatureProxy({\n      url: 'http://localhost:3000/api/proxy', // 🌐 Your Unleash proxy URL\n      clientKey: 'your-client-key', // 🔑 Your client key\n      appName: 'my-angular-app', // 📱 Your app name\n\n      // 🎛️ Optional: Advanced configuration\n      context: {\n        environment: 'development',\n      },\n      refreshInterval: 30, // ⏱️ Refresh interval in seconds\n      metricsInterval: 60, // 📊 Metrics interval in seconds\n      debug: true, // 🐞 Enable debug mode\n    }),\n    // ... other providers\n  ],\n});\n```\n\n### 🎯 Your First Feature Flag\n\n```typescript\n// 📁 src/app/app.component.ts\nimport { Component, inject } from '@angular/core';\nimport { FeatureProxyService } from 'ngx-feature-proxy';\n\n@Component({\n  selector: 'app-root',\n  template: `\n    \u003cdiv class=\"container\"\u003e\n      \u003c!-- 🎨 Using directive --\u003e\n      \u003cdiv *featureProxy=\"'newDashboard'\"\u003e🆕 Welcome to the new dashboard!\u003c/div\u003e\n\n      \u003c!-- 🎯 Using directive with expression --\u003e\n      \u003cdiv *featureProxy=\"'premiumUser \u0026\u0026 (betaAccess || adminMode)'\"\u003e\n        🚀 Access to premium beta features!\n      \u003c/div\u003e\n\n      \u003c!-- 🔧 Using service --\u003e\n      @if (isNewfeatureProxy) {\n        \u003cbutton (click)=\"tryNewFeature()\"\u003e✨ Try New Feature\u003c/button\u003e\n      }\n\n      \u003c!-- 🎭 State information --\u003e\n      \u003cdiv class=\"debug-info\"\u003e\n        \u003cp\u003e🔄 Ready: {{ $state().ready }}\u003c/p\u003e\n        \u003cp\u003e⏰ Last Update: {{ $state().lastUpdate | date: 'medium' }}\u003c/p\u003e\n      \u003c/div\u003e\n    \u003c/div\u003e\n  `,\n  standalone: true,\n  imports: [FeatureProxyDirective],\n})\nexport class AppComponent {\n  private featureService = inject(FeatureProxyService);\n\n  // 🎯 Direct feature check\n  isNewFeatureEnabled = this.featureService.isEnabled('newFeature');\n\n  // 📊 Reactive state\n  $state = this.featureService.$state;\n\n  tryNewFeature() {\n    console.log('🚀 New feature activated!');\n  }\n}\n```\n\n---\n\n## 🎮 Usage Guide\n\n### 🔧 Service Usage\n\nThe `FeatureProxyService` is the core of the library, providing programmatic access to feature flags:\n\n```typescript\nimport { Component, inject, computed, effect } from '@angular/core';\nimport { FeatureProxyService } from 'ngx-feature-proxy';\n\n@Component({\n  selector: 'app-feature-demo',\n  template: `\n    \u003cdiv class=\"feature-demo\"\u003e\n      \u003c!-- 📊 Service state --\u003e\n      \u003cdiv class=\"status-bar\"\u003e\n        \u003cspan\n          class=\"status\"\n          [class.ready]=\"$state().ready\"\n        \u003e\n          {{ $state().ready ? '🟢 Connected' : '🟡 Connecting...' }}\n        \u003c/span\u003e\n        \u003cspan class=\"last-update\"\u003e 📅 Last update: {{ $state().lastUpdate | date: 'short' }} \u003c/span\u003e\n      \u003c/div\u003e\n\n      \u003c!-- 🎯 Feature checks --\u003e\n      \u003cdiv class=\"features\"\u003e\n        \u003cdiv class=\"feature-card\"\u003e\n          \u003ch3\u003e🆕 Beta Features\u003c/h3\u003e\n          \u003cp\u003eStatus: {{ betaEnabled ? '✅ Enabled' : '❌ Disabled' }}\u003c/p\u003e\n          \u003cbutton\n            [disabled]=\"!betaEnabled\"\n            (click)=\"useBetaFeature()\"\n          \u003e\n            Try Beta Feature\n          \u003c/button\u003e\n        \u003c/div\u003e\n\n        \u003c!-- 🎭 Variant example --\u003e\n        \u003cdiv\n          class=\"feature-card\"\n          *ngIf=\"premiumVariant.enabled\"\n        \u003e\n          \u003ch3\u003e💎 Premium Feature\u003c/h3\u003e\n          \u003cp\u003eVariant: {{ premiumVariant.name }}\u003c/p\u003e\n          \u003cdiv [style.background-color]=\"premiumVariant.payload.value\"\u003e\n            Theme: {{ premiumVariant.payload.value }}\n          \u003c/div\u003e\n        \u003c/div\u003e\n      \u003c/div\u003e\n    \u003c/div\u003e\n  `,\n  standalone: true,\n})\nexport class FeatureDemoComponent {\n  private featureService = inject(FeatureProxyService);\n\n  // 📊 Reactive state\n  $state = this.featureService.$state;\n\n  // 🎯 Simple feature check\n  betaEnabled = computed(() =\u003e this.featureService.isEnabled('betaFeatures'));\n\n  // 🎭 Get variant with payload\n  premiumVariant = computed(() =\u003e this.featureService.getVariant('premiumTheme'));\n\n  // 🔄 Complex feature expression\n  advancedMode = computed(() =\u003e\n    this.featureService.features('premiumUser \u0026\u0026 (betaAccess || adminMode)')\n  );\n\n  constructor() {\n    // 👂 React to impression events\n    effect(() =\u003e {\n      const impression = this.featureService.$impression();\n      if (impression.eventType === 'isEnabled') {\n        console.log('🎯 Feature accessed:', impression.featureName);\n      }\n    });\n  }\n\n  useBetaFeature() {\n    console.log('🧪 Beta feature activated!');\n  }\n\n  // 🔄 Update user context\n  async updateUserContext(userId: string) {\n    await this.featureService.updateContext({ userId }).toPromise();\n    console.log('👤 User context updated');\n  }\n\n  // 📡 Manual refresh\n  async refreshFlags() {\n    await this.featureService.refresh().toPromise();\n    console.log('🔄 Feature flags refreshed');\n  }\n}\n```\n\n### 🎨 Directive Usage\n\nThe `*featureEnabled` directive provides declarative feature flag control in templates:\n\n#### 🎯 Simple Feature Check\n\n```html\n\u003cdiv *featureEnabled=\"'newDashboard'\"\u003e🆕 Welcome to the new dashboard!\u003c/div\u003e\n```\n\n#### 🎯 Complex Feature Check\n\n```html\n\u003cdiv *featureEnabled=\"'premiumUser \u0026\u0026 (betaAccess || adminMode)'\"\u003e\n  🚀 Access to premium beta features!\n\u003c/div\u003e\n```\n\n### 🛡️ Route Guards\n\nProtect your routes with feature flag-based guards:\n\n```typescript\nimport { Routes } from '@angular/router';\nimport { featureProxyGuard } from 'ngx-feature-proxy';\n\nexport const routes: Routes = [\n  {\n    path: 'dashboard',\n    loadComponent: () =\u003e import('./dashboard/dashboard.component'),\n    canActivate: [\n      // 🎯 Simple feature guard\n      featureProxyGuard({\n        expression: 'newDashboard',\n        redirectTo: '/legacy-dashboard',\n      }),\n    ],\n  },\n  {\n    path: 'admin',\n    loadChildren: () =\u003e import('./admin/admin.routes'),\n    canActivate: [\n      // 🛡️ Complex permission guard\n      featureProxyGuard({\n        expression: 'adminAccess \u0026\u0026 (betaTester || superUser)',\n        redirectTo: '/not-authorized',\n      }),\n    ],\n  },\n  {\n    path: 'user',\n    loadComponent: () =\u003e import('./user/user.component'),\n    canActivate: [\n      // 👤 User-specific feature guard\n      featureProxyGuard({\n        condition: (service) =\u003e service.isEnabled('userFeatures') \u0026\u0026 service.getVariant('userTier').name === 'gold',\n        redirectTo: '/upgrade',\n      }),\n    ],\n  }\n  {\n    path: 'premium',\n    loadChildren: () =\u003e import('./premium/premium.routes'),\n    canActivateChild: [\n      // 💎 Premium feature guard for child routes\n      featureProxyGuard({\n        expression: 'premiumUser \u0026\u0026 validSubscription',\n        redirectTo: '/subscribe',\n      }),\n    ],\n  },\n];\n```\n\n#### 🎪 Advanced Guard Patterns\n\n```typescript\n// 🔧 Custom guard with complex logic\nexport const premiumGuard = featureProxyGuard({\n  condition: (service) =\u003e {\n    const isPremium = service.isEnabled('premiumUser');\n    const isValidSubscription = service.isEnabled('validSubscription');\n    const variant = service.getVariant('premiumTier');\n\n    return isPremium \u0026\u0026 isValidSubscription \u0026\u0026 ['gold', 'platinum'].includes(variant.name);\n  },\n  redirectTo: '/upgrade',\n});\n\n// 🌍 Geo-based feature guard\nexport const geoFeatureGuard = featureProxyGuard({\n  condition: (service) =\u003e {\n    return service.features('featureEnabled \u0026\u0026 (region_US || region_EU)');\n  },\n  redirectTo: '/geo-restricted',\n});\n\n// 📱 Device-specific guard\nexport const mobileFeatureGuard = featureProxyGuard({\n  condition: (service) =\u003e {\n    const isMobile = service.getVariant('deviceType').name === 'mobile';\n    return isMobile \u0026\u0026 service.isEnabled('mobileFeatures');\n  },\n  redirectTo: '/desktop-only',\n});\n```\n\n---\n\n## 🐳 Docker Setup with Unleash\n\n### 🐳 Complete Docker Compose Setup\n\nCreate a `docker-compose.yml` file for a complete Unleash setup:\n\n```yaml\n# 🐳 docker-compose.yml\nservices:\n  unleash:\n    image: unleashorg/unleash-server:${UNLEASH_VERSION:-6}\n    container_name: unleash\n    restart: ${RESTART_POLICY:-unless-stopped}\n    ports:\n      - '4242:4242'\n    networks:\n      - unleash_net\n    environment:\n      # 🗄️ Database configuration\n      DATABASE_URL: 'postgres://postgres:${UNLEASH_DATABASE_PASSWORD:-unleash}@unleash-db/postgres'\n      DATABASE_SSL: 'false'\n\n      # 📊 Logging and performance\n      LOG_LEVEL: 'warn'\n\n      # 🔑 API tokens (generate secure tokens for production)\n      INIT_FRONTEND_API_TOKENS: ${INIT_FRONTEND_API_TOKENS:-*:*.unleash-insecure-frontend-api-token}\n      INIT_BACKEND_API_TOKENS: ${INIT_BACKEND_API_TOKENS:-*:*.unleash-insecure-api-token}\n\n      # 🌐 Server configuration\n      UNLEASH_URL: 'https://${UNLEASH_DOMAIN:-localhost:4242}'\n\n      # 👤 Default admin credentials\n      UNLEASH_DEFAULT_ADMIN_PASSWORD: ${UNLEASH_DEFAULT_ADMIN_PASSWORD:-admin123}\n      UNLEASH_DEFAULT_ADMIN_USERNAME: ${UNLEASH_DEFAULT_ADMIN_USERNAME:-admin}\n\n      # ⚡ Performance optimizations\n      UNLEASH_PROXY_SECRETS: ${UNLEASH_PROXY_SECRETS:-some-secret}\n    depends_on:\n      unleash-db:\n        condition: service_healthy\n    healthcheck:\n      test: wget --no-verbose --tries=1 --spider http://localhost:4242/health || exit 1\n      interval: 1s\n      timeout: 1m\n      retries: 5\n      start_period: 15s\n    volumes:\n      # 📁 Optional: Custom configuration\n      - ./unleash-config:/opt/unleash/config:ro\n\n  unleash-db:\n    image: postgres:17-alpine\n    container_name: unleash-db\n    restart: ${RESTART_POLICY:-unless-stopped}\n    volumes:\n      - ${DATA_PATH:-./data}/unleash/postgresql/data:/var/lib/postgresql/data\n    expose:\n      - '5432'\n    networks:\n      - unleash_net\n    environment:\n      - POSTGRES_DB=postgres\n      - POSTGRES_USER=postgres\n      - POSTGRES_PASSWORD=${UNLEASH_DATABASE_PASSWORD:-unleash123}\n    healthcheck:\n      test: ['CMD', 'pg_isready', '--username=postgres', '--host=127.0.0.1', '--port=5432']\n      interval: 2s\n      timeout: 1m\n      retries: 5\n      start_period: 10s\n\n  # 🚀 Optional: Unleash Proxy (for better performance)\n  unleash-proxy:\n    image: unleashorg/unleash-proxy:latest\n    container_name: unleash-proxy\n    restart: ${RESTART_POLICY:-unless-stopped}\n    ports:\n      - '3000:3000'\n    networks:\n      - unleash_net\n    environment:\n      UNLEASH_URL: 'http://unleash:4242/api'\n      UNLEASH_API_TOKEN: ${INIT_BACKEND_API_TOKENS:-*:*.unleash-insecure-api-token}\n      UNLEASH_APP_NAME: 'unleash-proxy'\n      UNLEASH_INSTANCE_ID: 'unleash-proxy-1'\n    depends_on:\n      unleash:\n        condition: service_healthy\n\nnetworks:\n  unleash_net:\n    driver: bridge\n\nvolumes:\n  unleash_data:\n    driver: local\n```\n\nCreate a `.env` file for easy configuration:\n\n```bash\n# 📁 .env\n# 🐳 Docker configuration\nUNLEASH_VERSION=5.7\nRESTART_POLICY=unless-stopped\nDATA_PATH=./data\n\n# 🌐 Domain and URLs\nUNLEASH_DOMAIN=localhost:4242\n\n# 🗄️ Database\nUNLEASH_DATABASE_PASSWORD=unleash123\n\n# 👤 Admin credentials (CHANGE IN PRODUCTION!)\nUNLEASH_DEFAULT_ADMIN_USERNAME=admin\nUNLEASH_DEFAULT_ADMIN_PASSWORD=admin123\n\n# 🔑 API Tokens (GENERATE SECURE TOKENS FOR PRODUCTION!)\nINIT_FRONTEND_API_TOKENS=*:development.unleash-insecure-frontend-api-token\nINIT_BACKEND_API_TOKENS=*:development.unleash-insecure-api-token\nUNLEASH_PROXY_SECRETS=proxy-secret-123\n\n# 🎯 Optional: Context fields\nUNLEASH_CONTEXT_FIELDS=userId,sessionId,environment,region\n```\n\nCommands to manage the Docker setup:\n\n```bash\n# 🏃 Start the stack\ndocker-compose up -d\n\n# 📊 View logs\ndocker-compose logs -f unleash\n\n# 🔍 Check health\ndocker-compose ps\n\n# 🗑️ Clean up\ndocker-compose down -v\n\n# 📈 Scale proxy (for high traffic)\ndocker-compose up -d --scale unleash-proxy=3\n```\n\n### 🌐 Access Your Unleash\n\nAfter running `docker-compose up -d`:\n\n- **🎛️ Unleash Dashboard**: http://localhost:4242\n- **🔑 Login**: admin / admin123 (or your configured credentials)\n- **⚡ Proxy Endpoint**: http://localhost:3000/proxy\n- **📊 Health Check**: http://localhost:4242/health\n\n---\n\n## 🤝 Contributing\n\nWe welcome contributions! Here's how you can help:\n\n### 🐛 Bug Reports\n\n1. 🔍 Search existing issues\n2. 📝 Create detailed bug report\n3. 🏷️ Use appropriate labels\n\n### ✨ Feature Requests\n\n1. 💡 Discuss in GitHub Discussions\n2. 📋 Create feature request issue\n3. 🚀 Submit pull request\n\n### 🛠️ Development Workflow\n\n```bash\n# 🍴 Fork and clone\ngit clone https://github.com/your-username/ngx-feature-proxy.git\ncd ngx-feature-proxy\n\n# 🌿 Create feature branch\ngit checkout -b feat/amazing-feature\n\n# ✅ Commit changes\ngit commit -m \"✨ Add amazing feature\"\n\n# 🚀 Push and create PR\ngit push origin feat/amazing-feature\n```\n\n### 📝 Commit Convention\n\nWe use [Conventional Commits](https://www.conventionalcommits.org/):\n\n- `✨ feat:` New features\n- `🐛 fix:` Bug fixes\n- `📚 docs:` Documentation\n- `🎨 style:` Code formatting\n- `♻️ refactor:` Code restructuring\n- `🚀 perf:` Performance improvements\n- `🚨 test:` Testing\n- `🔧 chore:` Maintenance\n\n---\n\n## 📄 License\n\nThis project is licensed under the **MIT License** - see the [LICENSE](LICENSE) file for details.\n\n```\nMIT License\n\nCopyright (c) 2025 Kiet Le\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n```\n\n---\n\n## 🙏 Acknowledgments\n\nThis project wouldn't be possible without these amazing technologies:\n\n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd align=\"center\" width=\"150px\"\u003e\n\u003cimg src=\"https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/png/angular.png\" width=\"60\" height=\"60\" alt=\"Angular\"\u003e\n\u003cbr\u003e\u003cstrong\u003e\u003ca href=\"https://angular.dev\"\u003eAngular\u003c/a\u003e\u003c/strong\u003e\n\u003cbr\u003e\u003cem\u003eThe best Framework ever\u003c/em\u003e\n\u003c/td\u003e\n\n\u003ctd align=\"center\" width=\"150px\"\u003e\n\u003cimg src=\"https://cdn.simpleicons.org/reactivex\" width=\"48\" height=\"48\" alt=\"RxJS\"\u003e\n\u003cbr\u003e\u003cstrong\u003e\u003ca href=\"https://rxjs.dev\"\u003eRxJS\u003c/a\u003e\u003c/strong\u003e\n\u003cbr\u003e\u003cem\u003eReactive Programming\u003c/em\u003e\n\u003c/td\u003e\n\n\u003ctd align=\"center\" width=\"150px\"\u003e\n\u003cimg src=\"https://avatars.githubusercontent.com/u/23053233?s=200\u0026v=4\" width=\"48\" height=\"48\" alt=\"Unleash\"\u003e\n\u003cbr\u003e\u003cstrong\u003e\u003ca href=\"https://www.getunleash.io/\"\u003eUnleash\u003c/a\u003e\u003c/strong\u003e\n\u003cbr\u003e\u003cem\u003eFeature Flag Management\u003c/em\u003e\n\u003c/td\u003e\n\n\u003ctd align=\"center\" width=\"150px\"\u003e\n\u003cimg src=\"https://cdn4.iconfinder.com/data/icons/logos-and-brands/512/97_Docker_logo_logos-512.png\" width=\"48\" height=\"48\" alt=\"Docker\"\u003e\n\u003cbr\u003e\u003cstrong\u003e\u003ca href=\"https://www.docker.com/\"\u003eDocker\u003c/a\u003e\u003c/strong\u003e\n\u003cbr\u003e\u003cem\u003eContainerization\u003c/em\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n---\n\n## 📞 Support\n\n\u003cdiv align=\"center\"\u003e\n\n### 🤝 Get Help \u0026 Connect\n\n[![Email](https://img.shields.io/badge/Email-zenkiet0906%40gmail.com-red?style=for-the-badge\u0026logo=gmail\u0026logoColor=white)](mailto:zenkiet0906@gmail.com)\n[![GitHub Issues](https://img.shields.io/badge/Issues-GitHub-green?style=for-the-badge\u0026logo=github\u0026logoColor=white)](https://github.com/zenkiet/ngx-feature-proxy/issues)\n[![Discussions](https://img.shields.io/badge/Discussions-GitHub-blue?style=for-the-badge\u0026logo=github\u0026logoColor=white)](https://github.com/zenkiet/ngx-feature-proxy/discussions)\n[![Docker Hub](https://img.shields.io/badge/Docker-Hub-blue?style=for-the-badge\u0026logo=docker\u0026logoColor=white)](https://hub.docker.com/r/zenkiet/ngx-feature-proxy)\n\n### 📊 Project Stats\n\n![GitHub contributors](https://img.shields.io/github/contributors/zenkiet/ngx-feature-proxy?style=flat-square)\n![GitHub last commit](https://img.shields.io/github/last-commit/zenkiet/ngx-feature-proxy?style=flat-square)\n![GitHub repo size](https://img.shields.io/github/repo-size/zenkiet/ngx-feature-proxy?style=flat-square)\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n### 🌟 Ready to get started?\n\n**[📦 Install Now](https://www.npmjs.com/package/ngx-feature-proxy) • [📖 View Docs](#-table-of-contents) • [💬 Join Discussion](https://github.com/zenkiet/ngx-feature-proxy/discussions)**\n\n---\n\n**⭐ If this project helped you, please consider giving it a star! ⭐**\n\n_Made with ❤️ by [ZenKiet](https://github.com/zenkiet)_\n\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzenkiet%2Fngx-feature-proxy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzenkiet%2Fngx-feature-proxy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzenkiet%2Fngx-feature-proxy/lists"}