vibes-plug 2.5.0 → 2.11.0

package/skills/wordpress-headless-expert/SKILL.md

@@ -0,0 +1,144 @@
+---
+name: wordpress-headless-expert
+description: "Expert guide for headless WordPress architecture — WPGraphQL, ACF Pro, Faust.js, Next.js/Astro frontend, webhooks, and caching / Panduan ahli arsitektur WordPress headless."
+author: "Roedy Rustam"
+---
+
+# WordPress Headless Expert (2026 Edition)
+
+[English](#english) | [Bahasa Indonesia](#bahasa-indonesia)
+
+---
+
+<a name="english"></a>
+## English
+
+### Orchestration & Integration
+- **`headless-cms-expert`**: Comparing and migrating between CMS backends.
+- **`nextjs-app-router-expert`**: Next.js App Router integration with WPGraphQL.
+- **`astro-framework-expert`**: Static site generation and content pipelines from WordPress.
+- **`seo`**: Syncing Yoast SEO / Rank Math metadata to modern frontend head tags.
+- **`performance-web-vitals`**: Caching and Edge SSR optimization for decoupled WordPress.
+
+### Description
+Production guide for architecting, deploying, and maintaining headless WordPress systems. Covers decoupled WordPress backends with WPGraphQL and Advanced Custom Fields (ACF Pro), frontend rendering with Next.js 15 or Astro 5, Faust.js framework integration, webhook-triggered on-demand revalidation, authentication (JWT / Application Passwords), and WooCommerce headless setups.
+
+### Trigger Conditions
+- Decoupling an existing WordPress site into a headless architecture with Next.js/Astro.
+- Querying WordPress content using WPGraphQL and ACF Pro field groups.
+- Synchronizing SEO metadata (Yoast / RankMath) with modern frontend metadata APIs.
+- Setting up on-demand ISR revalidation hooks from WordPress publish events.
+
+---
+
+### Core Architecture & Patterns
+
+#### 1. WPGraphQL Query Integration (Next.js 15 Server Component)
+```typescript
+const WP_GRAPHQL_ENDPOINT = process.env.WORDPRESS_API_URL || 'https://cms.example.com/graphql';
+
+interface PostPreview {
+  id: string;
+  title: string;
+  slug: string;
+  date: string;
+  excerpt: string;
+  featuredImage?: {
+    node: {
+      sourceUrl: string;
+      altText: string;
+    };
+  };
+}
+
+export async function fetchWordPressPosts(): Promise<PostPreview[]> {
+  const query = `
+    query GetLatestPosts {
+      posts(first: 10, where: { orderby: { field: DATE, order: DESC } }) {
+        nodes {
+          id
+          title
+          slug
+          date
+          excerpt
+          featuredImage {
+            node {
+              sourceUrl
+              altText
+            }
+          }
+        }
+      }
+    }
+  `;
+
+  const res = await fetch(WP_GRAPHQL_ENDPOINT, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ query }),
+    next: { tags: ['wordpress:posts'], revalidate: 3600 },
+  });
+
+  const { data } = await res.json();
+  return data?.posts?.nodes ?? [];
+}
+```
+
+#### 2. Yoast / RankMath SEO Metadata Extraction
+```typescript
+export async function generateMetadata({ params }: { params: { slug: string } }) {
+  const query = `
+    query GetPostSEO($slug: ID!) {
+      post(id: $slug, idType: SLUG) {
+        title
+        seo {
+          title
+          metaDesc
+          opengraphTitle
+          opengraphDescription
+          opengraphImage {
+            sourceUrl
+          }
+        }
+      }
+    }
+  `;
+
+  const res = await fetch(WP_GRAPHQL_ENDPOINT, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ query, variables: { slug: params.slug } }),
+  });
+
+  const { data } = await res.json();
+  const seo = data?.post?.seo;
+
+  return {
+    title: seo?.title || data?.post?.title,
+    description: seo?.metaDesc,
+    openGraph: {
+      title: seo?.opengraphTitle,
+      description: seo?.opengraphDescription,
+      images: seo?.opengraphImage ? [{ url: seo.opengraphImage.sourceUrl }] : [],
+    },
+  };
+}
+```
+
+---
+
+<a name="bahasa-indonesia"></a>
+## Bahasa Indonesia
+
+### Integrasi Orkestrasi
+- **`headless-cms-expert`**: Pemilihan dan perbandingan CMS backend.
+- **`nextjs-app-router-expert`**: Integrasi Next.js App Router dengan query WPGraphQL.
+- **`seo`**: Sinkronisasi data meta Yoast/RankMath ke tag metadata frontend modern.
+
+### Deskripsi
+Panduan produksi untuk membangun dan memelihara arsitektur WordPress headless. Menggunakan WPGraphQL, ACF Pro, Faust.js, Next.js 15, atau Astro 5, revalidasi ISR instan via webhook, autentikasi aman, dan integrasi WooCommerce decoupled.
+
+### Kondisi Pemicu
+- Memisahkan frontend WordPress ke arsitektur decoupled (Next.js/Astro).
+- Mengambil konten WordPress via WPGraphQL dan grup field ACF Pro.
+- Mengonfigurasi revalidasi instan saat konten diterbitkan di WordPress.

package/skills/zero-to-prod-orchestrator/SKILL.md

@@ -13,6 +13,9 @@ author: "Roedy Rustam"
 <a name="english"></a>
 ## English
 
+### Orchestration & Integration
+Connects and orchestrates with relevant domain skills like `brainstorming`, `zero-to-prod-orchestrator`, and `project-context-mapper` to ensure cohesive execution.
+
 ### Overview
 The **Zero to Production Orchestrator** is the ultimate master skill designed to orchestrate the entire `vibes-plug` ecosystem as a highly interconnected **engineering swarm**. By acting as the central conductor, it ensures that no sub-skill is executed in isolation. It guides fullstack developers through the complete software engineering lifecycle — from concept discovery to AI integration, multi-platform backend architecture, design systems, automated testing, GEO/AEO optimization, and production deployment.
 
@@ -42,7 +45,7 @@ Launch/Deploy <--- Security/GEO <--- Testing/QA  <--- Frontend/UI
 ```
 
 #### PHASE 1: Discovery & AI PRD Architectural Planning
-**Orchestrates:** `prd-architect`, `brainstorming`, `mcp-server-architect`, `session-context-loader`, `dependency-upgrade-migrator`, `saas-mvp-launcher`, `web-scraper`, `website-design-cloner`, `hyper-context-synthesizer`
+**Orchestrates:** `prd-architect`, `brainstorming`, `mcp-server-architect`, `session-context-loader`, `dependency-upgrade-migrator`, `app-analyzer-optimizer`, `seo`, `project-context-mapper`, `self-evolving-memory-graph`, `saas-mvp-launcher`, `web-scraper`, `website-design-cloner`, `headless-cms-expert`, `wordpress-headless-expert`, `documentation-site-expert`, `asisten-ramah`, `skill-baru`
 - [ ] Conduct structured dialogue to clarify product intent, target audience, and non-functional goals.
 - [ ] Automatically draft a comprehensive Product Requirements Document (PRD.md), Entity Relationship Diagram (ERD.md), and Documentation (DOKUMENTASI.md) alongside the Roadmap (ROADMAP.md).
 - [ ] Plan AI/LLM integration strategy (Vercel AI SDK, MCP Server tools, or Multi-Agent Graph).
@@ -50,41 +53,45 @@ Launch/Deploy <--- Security/GEO <--- Testing/QA  <--- Frontend/UI
 - [ ] Initialize `BLUEPRINT.md` and `PROGRESS.md`.
 
 #### PHASE 2: Project Foundation & Monorepo Setup
-**Orchestrates:** `monorepo-architect`, `micro-frontend-architect`, `bun-runtime-expert`, `python-programming-expert`, `go-programming-expert`, `ci-cd-devops-architect`, `rust-programming-expert`, `typescript-expert`
+**Orchestrates:** `monorepo-architect`, `micro-frontend-architect`, `bun-runtime-expert`, `python-programming-expert`, `go-programming-expert`, `ci-cd-devops-architect`, `rust-programming-expert`, `typescript-expert`, `biome-linter-formatter-expert`
 - [ ] Initialize monorepo (Turborepo + pnpm workspaces) or single repo foundation.
-- [ ] Set up language runtimes: Node.js 22 LTS / Bun 1.2+ / Python 3.12+ (uv) / Go 1.23+.
-- [ ] Configure `Ruff`, `ESLint`, `Prettier`, and TypeScript strict configurations.
+- [ ] Set up language runtimes: Node.js 24 LTS / Bun 1.2+ / Python 3.14+ (uv) / Go 1.25+ / Rust 2024.
+- [ ] Configure `Biome v2` (Rust-based linter + formatter) or `Ruff`, `ESLint`, `Prettier`, and TypeScript strict configurations.
 - [ ] Setup initial CI/CD pipeline template (GitHub Actions, Docker).
 
 #### PHASE 3: Database & Multi-Tenant Core Architecture
-**Orchestrates:** `fullstack-expert`, `database-orm-expert`, `saas-multi-tenant`, `supabase-migration`, `supabase-security-expert`, `edge-serverless-db-expert`, `senior-fullstack`
-- [ ] Design normalized relational schemas and document models.
-- [ ] Configure ORM layer (Drizzle ORM / Prisma 6 / SQLx / sqlc).
+**Orchestrates:** `fullstack-expert`, `database-migration-versioning-expert`, `database-orm-expert`, `domain-driven-design-expert`, `saas-multi-tenant`, `supabase-migration`, `supabase-security-expert`, `edge-serverless-db-expert`, `data-pipeline-etl-expert`, `search-engine-expert`, `geospatial-maps-expert`, `graph-rag-knowledge-expert`
+- [ ] Design normalized relational schemas, document models, and geospatial PostGIS structures.
+- [ ] Configure ORM layer (Drizzle ORM / Prisma 6 / SQLx / sqlc) and full-text search indexing (Typesense/Meilisearch).
 - [ ] Implement Row-Level Security (RLS) policies and tenant isolation.
 - [ ] Apply initial database migrations and connection poolers (PgBouncer/Supavisor/Neon).
 
 #### PHASE 4: Backend APIs, Microservices & AI Agents
-**Orchestrates:** `js-backend-expert`, `go-programming-expert`, `graphql-apollo-expert`, `ai-llm-integration-expert`, `multi-agent-orchestration`, `mcp-server-architect`, `authentication-identity-expert`, `email-notification-expert`, `cron-scheduler-expert`, `rate-limit-abuse-prevention`, `file-upload-media-expert`, `async-queue-temporal-expert`, `doku-mcp-server`, `event-driven-architect`, `gemini-agent-booster`, `mobile-push-notification-expert`, `realtime-collaboration-expert`, `llm-cost-arbitrage-router`
+**Orchestrates:** `js-backend-expert`, `go-programming-expert`, `graphql-apollo-expert`, `openapi-swagger-codegen-expert`, `ai-llm-integration-expert`, `ai-prompt-engineering-expert`, `ai-media-generation-expert`, `multi-agent-orchestration`, `mcp-server-architect`, `authentication-identity-expert`, `email-notification-expert`, `cron-scheduler-expert`, `rate-limit-abuse-prevention`, `file-upload-media-expert`, `async-queue-temporal-expert`, `background-jobs-queue-expert`, `doku-mcp-server`, `event-driven-architect`, `gemini-agent-booster`, `mobile-push-notification-expert`, `realtime-collaboration-expert`, `api-gateway-proxy-expert`, `wasm-edge-computing-expert`, `sse-websocket-streaming-expert`, `n8n-automation-expert`, `chatbot-messaging-expert`, `pdf-document-generation-expert`, `ecommerce-expert`, `blockchain-web3-expert`, `local-slm-edge-ai-expert`, `voice-ai-realtime-agent`, `graph-rag-knowledge-expert`
 - [ ] Build high-throughput REST / GraphQL / gRPC APIs using Fastify 5, NestJS, Hono, Gin, or Axum.
 - [ ] Implement authentication (Clerk, Auth.js, Supabase Auth) and RBAC middleware.
 - [ ] Build MCP Server tools or stateful LangGraph multi-agent workflows with human-in-the-loop gates.
+- [ ] Integrate AI media generation (Flux/ElevenLabs/Whisper), chatbot platforms (WhatsApp/Telegram/Discord), and n8n automations.
 - [ ] Implement background processing queues (BullMQ + Redis), scheduled jobs, and rate limiters.
-- [ ] Set up transactional email pipeline (Resend/Postmark) and notification system.
+- [ ] Set up transactional email pipeline (Resend/Postmark) and PDF generation.
 - [ ] Implement file upload with presigned URLs (S3/R2) and media processing.
 
 #### PHASE 5: Frontend, Design Systems & Mobile Apps
-**Orchestrates:** `design-system-architect`, `senior-frontend`, `vue-frontend-expert`, `tailwind-expert`, `tanstack-query-expert`, `spa-orchestrator`, `mobile-expo-expert`, `apple-ecosystem-expert`, `tauri-expert`, `form-validation-expert`, `ui-components-expert`, `web-3d-graphics-expert`, `web-game-engine-expert`, `glsl-shader-expert`, `webxr-ar-vr-expert`, `visual-qa-vision-agent`, `hig`, `global-a11y-i18n-expert`, `bootstrap-to-modern`, `monday-design-aesthetic`, `state-management-expert`, `ui-ux-pro-max`, `ui-ux-expert`
+**Orchestrates:** `modern-web-guidance`, `design-system-architect`, `senior-frontend`, `nextjs-app-router-expert`, `vue-frontend-expert`, `astro-framework-expert`, `svelte-sveltekit-expert`, `solidjs-expert`, `angular-expert`, `tailwind-expert`, `tanstack-query-expert`, `spa-orchestrator`, `mobile-expo-expert`, `apple-ecosystem-expert`, `tauri-expert`, `desktop-electron-expert`, `form-validation-expert`, `ui-components-expert`, `svg-animation-motion-expert`, `web-3d-graphics-expert`, `web-game-engine-expert`, `glsl-shader-expert`, `webxr-ar-vr-expert`, `visual-qa-vision-agent`, `hig`, `global-a11y-i18n-expert`, `bootstrap-to-modern`, `monday-design-aesthetic`, `state-management-expert`, `ui-ux-pro-max`, `data-visualization-expert`, `rich-text-editor-expert`, `documentation-site-expert`, `blockchain-web3-expert`, `modern-css-native-expert`, `pwa-offline-first-expert`
+- [ ] **MANDATORY**: Run `modern-web-guidance` FIRST before implementing any frontend HTML/CSS/JS features to ensure compliance with modern Google standards.
 - [ ] Implement design tokens (OKLCH) and Tailwind CSS v4 `@theme` directive tokens.
 - [ ] Construct accessible component primitives using Radix UI / Base UI and CVA variants.
-- [ ] Build React 19 / Next.js 15 pages utilizing Server Components, Server Actions (`useActionState`, `useOptimistic`), advanced animations (GSAP/Anime.js), or Expo Router v4 for Mobile / Tauri v2 for Desktop.
+- [ ] Integrate data visualizations (Recharts/Tremor/D3) and rich text editors (Tiptap/Lexical).
+- [ ] Build React 19 / Next.js 15, Vue 3, Astro 5, Svelte 5, SolidJS 2, or Angular 19+ apps with state management and Web3 wallets.
+- [ ] **MANDATORY**: Automatically scaffold standard pages: About, Profile, Contact, Terms of Reference/Service, and Privacy Policy.
 - [ ] Implement complex forms with React Hook Form + Zod validation.
 - [ ] If SPA architecture — coordinate with `spa-orchestrator` for routing (TanStack Router), state (TanStack Query v5), and decoupled API layer.
 - [ ] Integrate frontend state management with TanStack Query v5.
 
 #### PHASE 6: Automated Testing, Error Resilience & Security Audit
-**Orchestrates:** `e2e-testing-expert`, `secure-fuzz-testing`, `firebase-security-expert`, `error-resilience-expert`, `logging-error-tracking-expert`, `vibe-code-gardener`, `coderabbit`, `autonomous-tdd-debugger`, `browser-automation-expert`, `zero-trust-secret-vault`, `autonomous-red-teamer`, `post-quantum-crypto-migrator`
+**Orchestrates:** `e2e-testing-expert`, `accessibility-testing-expert`, `secure-fuzz-testing`, `firebase-security-expert`, `error-resilience-expert`, `logging-error-tracking-expert`, `vibe-code-gardener`, `coderabbit`, `autonomous-tdd-debugger`, `browser-automation-expert`, `zero-trust-secret-vault`, `autonomous-red-teamer`, `post-quantum-crypto-migrator`, `compliance-gdpr-privacy-expert`, `ai-evals-benchmark-expert`
 - [ ] Write unit and integration tests with Vitest and pytest.
-- [ ] Write resilient E2E browser tests with Playwright.
+- [ ] Write resilient E2E browser tests with Playwright and automated WCAG 2.2 accessibility tests with `@axe-core/playwright` and Pa11y.
 - [ ] Execute security fuzz testing (Atheris / cargo-fuzz / native Go fuzzing).
 - [ ] Implement Error Boundaries, retry patterns, circuit breakers, and graceful degradation.
 - [ ] Set up structured logging (Pino) and error tracking (Sentry) with source map uploads.
@@ -111,6 +118,9 @@ Launch/Deploy <--- Security/GEO <--- Testing/QA  <--- Frontend/UI
 <a name="bahasa-indonesia"></a>
 ## Bahasa Indonesia
 
+### Integrasi Orkestrasi
+Terhubung dan mengorkestrasi skill domain yang relevan seperti `brainstorming`, `zero-to-prod-orchestrator`, dan `project-context-mapper` untuk memastikan eksekusi yang kohesif.
+
 ### Ringkasan
 **Zero to Production Orchestrator** adalah skill master utama yang dirancang untuk mengorkestrasi seluruh ekosistem `vibes-plug` sebagai sebuah **engineering swarm** yang saling terhubung erat. Dengan bertindak sebagai konduktor pusat, skill ini memastikan tidak ada sub-skill yang dieksekusi secara terisolasi. Skill ini memandu pengembang *fullstack* melalui seluruh siklus hidup rekayasa perangkat lunak — mulai dari tahap ide awal hingga integrasi AI, arsitektur backend multi-platform, design system, pengujian otomatis, optimasi GEO/AEO, dan deployment produksi.
 
@@ -131,7 +141,7 @@ Launch/Deploy <--- Security/GEO <--- Testing/QA  <--- Frontend/UI
 ### Master Pipeline Fullstack 8-Fase
 
 #### FASE 1: Discovery & Perencanaan Arsitektur PRD AI
-**Mengorkestrasi:** `prd-architect`, `brainstorming`, `mcp-server-architect`, `session-context-loader`, `dependency-upgrade-migrator`, `app-analyzer-optimizer`, `seo`, `project-context-mapper`, `self-evolving-memory-graph`, `saas-mvp-launcher`, `web-scraper`, `website-design-cloner`, `hyper-context-synthesizer`
+**Mengorkestrasi:** `prd-architect`, `brainstorming`, `mcp-server-architect`, `session-context-loader`, `dependency-upgrade-migrator`, `app-analyzer-optimizer`, `seo`, `project-context-mapper`, `self-evolving-memory-graph`, `saas-mvp-launcher`, `web-scraper`, `website-design-cloner`, `headless-cms-expert`, `wordpress-headless-expert`, `documentation-site-expert`, `asisten-ramah`, `skill-baru`
 - [ ] Dialog terstruktur untuk memperjelas tujuan produk, audiens target, dan persyaratan non-fungsional.
 - [ ] Secara otomatis menyusun Product Requirements Document (PRD.md), Entity Relationship Diagram (ERD.md), dan Dokumentasi (DOKUMENTASI.md) yang komprehensif beserta Roadmap (ROADMAP.md).
 - [ ] Merencanakan integrasi AI/LLM (Vercel AI SDK, alat MCP Server, atau Graf Multi-Agen).
@@ -139,41 +149,45 @@ Launch/Deploy <--- Security/GEO <--- Testing/QA  <--- Frontend/UI
 - [ ] Menginisialisasi `BLUEPRINT.md` dan `PROGRESS.md`.
 
 #### FASE 2: Pondasi Proyek & Setup Monorepo
-**Mengorkestrasi:** `monorepo-architect`, `micro-frontend-architect`, `bun-runtime-expert`, `python-programming-expert`, `go-programming-expert`, `ci-cd-devops-architect`, `spa-orchestrator`, `mpa-orchestrator`, `multiple-entry-points`, `mvc-expert`, `scalability-clean-code`, `api-design-expert`, `legacy-code-translator`, `web-3d-graphics-expert`, `web-game-engine-expert`, `glsl-shader-expert`, `webxr-ar-vr-expert`, `rust-programming-expert`, `typescript-expert`
+**Mengorkestrasi:** `monorepo-architect`, `micro-frontend-architect`, `bun-runtime-expert`, `python-programming-expert`, `go-programming-expert`, `ci-cd-devops-architect`, `spa-orchestrator`, `mpa-orchestrator`, `multiple-entry-points`, `mvc-expert`, `scalability-clean-code`, `api-design-expert`, `legacy-code-translator`, `web-3d-graphics-expert`, `web-game-engine-expert`, `glsl-shader-expert`, `webxr-ar-vr-expert`, `rust-programming-expert`, `typescript-expert`, `biome-linter-formatter-expert`
 - [ ] Inisialisasi monorepo (Turborepo + pnpm workspaces) atau repositori tunggal.
-- [ ] Menyiapkan runtime bahasa: Node.js 22 LTS / Bun 1.2+ / Python 3.12+ (uv) / Go 1.23+.
-- [ ] Konfigurasi `Ruff`, `ESLint`, `Prettier`, dan TypeScript ketat.
+- [ ] Menyiapkan runtime bahasa: Node.js 24 LTS / Bun 1.2+ / Python 3.14+ (uv) / Go 1.25+ / Rust 2024.
+- [ ] Konfigurasi `Biome v2` (Rust linter & formatter) atau `Ruff`, `ESLint`, `Prettier`, dan TypeScript ketat.
 - [ ] Menyiapkan template pipeline CI/CD awal (GitHub Actions, Docker).
 
 #### FASE 3: Database & Arsitektur Multi-Tenant
-**Mengorkestrasi:** `fullstack-expert`, `database-orm-expert`, `saas-multi-tenant`, `supabase-migration`, `supabase-security-expert`, `edge-serverless-db-expert`, `senior-fullstack`
-- [ ] Merancang skema relasional ter-normalisasi dan pemodelan dokumen.
-- [ ] Konfigurasi lapisan ORM (Drizzle ORM / Prisma 6 / SQLx / sqlc).
+**Mengorkestrasi:** `fullstack-expert`, `database-migration-versioning-expert`, `database-orm-expert`, `domain-driven-design-expert`, `saas-multi-tenant`, `supabase-migration`, `supabase-security-expert`, `edge-serverless-db-expert`, `data-pipeline-etl-expert`, `search-engine-expert`, `geospatial-maps-expert`, `graph-rag-knowledge-expert`
+- [ ] Merancang skema relasional ter-normalisasi, pemodelan dokumen, dan struktur geospasial PostGIS.
+- [ ] Konfigurasi lapisan ORM (Drizzle ORM / Prisma 6 / SQLx / sqlc) dan indexing mesin pencari (Typesense/Meilisearch).
 - [ ] Mengimplementasikan kebijakan Row-Level Security (RLS) dan isolasi tenant.
 - [ ] Menerapkan migrasi database awal dan connection poolers (PgBouncer/Supavisor/Neon).
 
 #### FASE 4: Backend API, Microservices & Agen AI
-**Mengorkestrasi:** `js-backend-expert`, `go-programming-expert`, `graphql-apollo-expert`, `ai-llm-integration-expert`, `multi-agent-orchestration`, `mcp-server-architect`, `authentication-identity-expert`, `email-notification-expert`, `cron-scheduler-expert`, `rate-limit-abuse-prevention`, `file-upload-media-expert`, `saas-billing`, `payment-gateway-expert`, `vector-db-rag-expert`, `mcp-client-orchestrator`, `autonomous-swarm-director`, `async-queue-temporal-expert`, `doku-mcp-server`, `event-driven-architect`, `gemini-agent-booster`, `mobile-push-notification-expert`, `realtime-collaboration-expert`, `llm-cost-arbitrage-router`
+**Mengorkestrasi:** `js-backend-expert`, `go-programming-expert`, `graphql-apollo-expert`, `openapi-swagger-codegen-expert`, `ai-llm-integration-expert`, `ai-prompt-engineering-expert`, `ai-media-generation-expert`, `multi-agent-orchestration`, `mcp-server-architect`, `authentication-identity-expert`, `email-notification-expert`, `cron-scheduler-expert`, `rate-limit-abuse-prevention`, `file-upload-media-expert`, `saas-billing`, `payment-gateway-expert`, `vector-db-rag-expert`, `mcp-client-orchestrator`, `async-queue-temporal-expert`, `background-jobs-queue-expert`, `doku-mcp-server`, `event-driven-architect`, `gemini-agent-booster`, `mobile-push-notification-expert`, `realtime-collaboration-expert`, `api-gateway-proxy-expert`, `wasm-edge-computing-expert`, `sse-websocket-streaming-expert`, `n8n-automation-expert`, `chatbot-messaging-expert`, `pdf-document-generation-expert`, `ecommerce-expert`, `blockchain-web3-expert`, `local-slm-edge-ai-expert`, `voice-ai-realtime-agent`, `graph-rag-knowledge-expert`
 - [ ] Bangun API REST / GraphQL / gRPC *high-throughput* menggunakan Fastify 5, NestJS, Hono, Gin, atau Axum.
 - [ ] Mengimplementasikan autentikasi (Clerk, Auth.js, Supabase Auth) dan middleware RBAC.
 - [ ] Membangun alat MCP Server atau alur kerja multi-agen LangGraph berbasis state dengan gerbang *human-in-the-loop*.
+- [ ] Mengintegrasikan generasi media AI (Flux/ElevenLabs/Whisper), bot perpesanan (WhatsApp/Telegram/Discord), dan otomasi n8n.
 - [ ] Mengimplementasikan antrean pemrosesan latar belakang (BullMQ + Redis), tugas terjadwal, dan rate limiter.
-- [ ] Menyiapkan pipeline email transaksional (Resend/Postmark) dan sistem notifikasi.
+- [ ] Menyiapkan pipeline email transaksional (Resend/Postmark), pembuatan PDF, dan sistem notifikasi.
 - [ ] Mengimplementasikan upload file dengan presigned URL (S3/R2) dan pemrosesan media.
 
 #### FASE 5: Frontend, Design System & Mobile App
-**Mengorkestrasi:** `design-system-architect`, `senior-frontend`, `vue-frontend-expert`, `tailwind-expert`, `tanstack-query-expert`, `spa-orchestrator`, `mobile-expo-expert`, `apple-ecosystem-expert`, `tauri-expert`, `form-validation-expert`, `ui-components-expert`, `web-3d-graphics-expert`, `web-game-engine-expert`, `glsl-shader-expert`, `webxr-ar-vr-expert`, `visual-qa-vision-agent`, `hig`, `global-a11y-i18n-expert`, `bootstrap-to-modern`, `monday-design-aesthetic`, `state-management-expert`, `ui-ux-pro-max`, `ui-ux-expert`
+**Mengorkestrasi:** `modern-web-guidance`, `design-system-architect`, `senior-frontend`, `nextjs-app-router-expert`, `vue-frontend-expert`, `astro-framework-expert`, `svelte-sveltekit-expert`, `solidjs-expert`, `angular-expert`, `tailwind-expert`, `tanstack-query-expert`, `spa-orchestrator`, `mobile-expo-expert`, `apple-ecosystem-expert`, `tauri-expert`, `desktop-electron-expert`, `form-validation-expert`, `ui-components-expert`, `svg-animation-motion-expert`, `web-3d-graphics-expert`, `web-game-engine-expert`, `glsl-shader-expert`, `webxr-ar-vr-expert`, `visual-qa-vision-agent`, `hig`, `global-a11y-i18n-expert`, `bootstrap-to-modern`, `monday-design-aesthetic`, `state-management-expert`, `ui-ux-pro-max`, `data-visualization-expert`, `rich-text-editor-expert`, `documentation-site-expert`, `blockchain-web3-expert`, `modern-css-native-expert`, `pwa-offline-first-expert`
+- [ ] **MANDATORY**: Jalankan `modern-web-guidance` PERTAMA KALI sebelum mengimplementasikan fitur frontend HTML/CSS/JS untuk memastikan kepatuhan dengan standar modern Google.
 - [ ] Implementasikan token desain (OKLCH) dan konfigurasi tema Tailwind CSS v4.
 - [ ] Bangun komponen primitif aksesibel menggunakan Radix UI / Base UI dan CVA.
-- [ ] Buat halaman React 19 / Next.js 15 memanfaatkan RSC, Server Actions (`useActionState`), animasi tingkat lanjut (GSAP/Anime.js), atau Expo Router v4 (Mobile) / Tauri v2 (Desktop).
+- [ ] Integrasikan visualisasi data (Recharts/Tremor/D3) dan editor rich text (Tiptap/Lexical).
+- [ ] Buat halaman React 19 / Next.js 15, Vue 3, Astro 5, Svelte 5, SolidJS 2, atau Angular 19+ dengan wallet Web3.
+- [ ] **MANDATORY**: Otomatis buat halaman standar: About, Profile, Contact, Terms of Reference/Service, dan Privacy Policy.
 - [ ] Mengimplementasikan formulir kompleks dengan React Hook Form + validasi Zod.
 - [ ] Jika arsitektur SPA — koordinasikan dengan `spa-orchestrator` untuk routing (TanStack Router), state (TanStack Query v5), dan API layer terpisah.
 - [ ] Mengintegrasikan manajemen state frontend dengan TanStack Query v5.
 
 #### FASE 6: Pengujian Otomatis, Ketahanan Error & Audit Keamanan
-**Mengorkestrasi:** `e2e-testing-expert`, `secure-fuzz-testing`, `firebase-security-expert`, `error-resilience-expert`, `logging-error-tracking-expert`, `vibe-code-gardener`, `coderabbit`, `autonomous-tdd-debugger`, `browser-automation-expert`, `zero-trust-secret-vault`, `autonomous-red-teamer`, `post-quantum-crypto-migrator`
+**Mengorkestrasi:** `e2e-testing-expert`, `accessibility-testing-expert`, `secure-fuzz-testing`, `firebase-security-expert`, `error-resilience-expert`, `logging-error-tracking-expert`, `vibe-code-gardener`, `coderabbit`, `autonomous-tdd-debugger`, `browser-automation-expert`, `zero-trust-secret-vault`, `autonomous-red-teamer`, `post-quantum-crypto-migrator`, `compliance-gdpr-privacy-expert`, `ai-evals-benchmark-expert`
 - [ ] Menulis unit test dan integration test dengan Vitest dan pytest.
-- [ ] Menulis pengujian browser E2E yang tangguh menggunakan Playwright.
+- [ ] Menulis pengujian browser E2E Playwright dan pengujian aksesibilitas WCAG 2.2 otomatis (`@axe-core/playwright` dan Pa11y).
 - [ ] Menjalankan pengujian fuzzing keamanan (Atheris / cargo-fuzz / native Go fuzzing).
 - [ ] Mengimplementasikan Error Boundary, pola retry, circuit breaker, dan degradasi anggun.
 - [ ] Menyiapkan logging terstruktur (Pino) dan pelacakan error (Sentry) dengan upload source map.
@@ -181,7 +195,7 @@ Launch/Deploy <--- Security/GEO <--- Testing/QA  <--- Frontend/UI
 - [ ] Menjalankan audit kualitas kode untuk membersihkan AI slop dan pembusukan arsitektur.
 
 #### FASE 7: Hardening Pra-Peluncuran, Monitoring & DevOps Sentinel
-**Mengorkestrasi:** `production-ready-hardener`, `app-analyzer-optimizer`, `seo`, `seo-geo`, `seo-aeo-landing-page-writer`, `logging-error-tracking-expert`, `proactive-background-watcher`, `ai-cost-token-optimizer`, `data-telemetry-expert`, `feature-flag-analytics-expert`, `autonomous-chaos-monkey`, `self-healing-cloud-orchestrator`
+**Mengorkestrasi:** `production-ready-hardener`, `app-analyzer-optimizer`, `seo`, `logging-error-tracking-expert`, `proactive-background-watcher`, `ai-cost-token-optimizer`, `data-telemetry-expert`, `feature-flag-analytics-expert`, `autonomous-chaos-monkey`, `self-healing-cloud-orchestrator`
 - [ ] Audit pra-peluncuran pada Core Web Vitals (LCP, INP, CLS) dan ukuran bundle.
 - [ ] Mengonfigurasi monitoring produksi, aturan alerting, dan notifikasi on-call.
 - [ ] Mengoptimalkan GEO untuk AI Overviews, Perplexity, ChatGPT Search, dan merilis `/llms.txt`.
@@ -204,3 +218,14 @@ This generated image MUST be explicitly used as:
 3. The Open Graph (OG) image for SEO metadata (`og:image`).
 
 Do not use placeholders for these assets. Generate and integrate them automatically.
+
+---
+### 📄 Standard Pages Mandate (CRITICAL)
+**MANDATORY**: Whenever you are building a new application, landing page, or website, you MUST automatically create the following standard pages:
+1. **About Page** (`/about`)
+2. **Profile Page** (`/profile`)
+3. **Contact Page** (`/contact`)
+4. **Terms of Reference / Terms of Service** (`/terms`)
+5. **Privacy Policy** (`/privacy-policy`)
+
+These pages must be generated with standard boilerplate content that can later be customized to fit the specific application. Do not wait for the user to ask for them; they are a strict requirement for all web projects. / **WAJIB**: Otomatis buatkan halaman standar (About, Profile, Contact, Terms, Privacy Policy) pada setiap pembuatan aplikasi/website baru dengan konten boilerplate yang bisa disesuaikan nanti.

package/skills/zero-trust-secret-vault/SKILL.md

@@ -1,40 +1,88 @@
----
-name: zero-trust-secret-vault
-description: "Expert guide for Zero-Trust Secret Management (Infisical, HashiCorp Vault, Doppler), automated API key rotation, and environment security / Panduan ahli manajemen rahasia Zero-Trust, rotasi kunci API, dan keamanan variabel lingkungan."
+---
+name: zero-trust-secret-vault
+description: "Expert guide for Zero-Trust Secret Management (Infisical, HashiCorp Vault, Doppler), automated API key rotation, and environment security / Panduan ahli manajemen rahasia Zero-Trust, rotasi kunci API, dan keamanan variabel lingkungan."
 author: "Roedy Rustam"
----
-
-# Zero-Trust Secret Vault & Credential Security Expert
-
-[English](#english) | [Bahasa Indonesia](#bahasa-indonesia)
-
----
-
-<a name="english"></a>
-## English
-
-### Purpose & Overview
-Production-grade security standards for managing application secrets, environment variables, API keys, database credentials, and TLS certificates using Zero-Trust Secret Managers — Infisical, HashiCorp Vault, and Doppler — featuring automated secret rotation, dynamic credentials, and zero plain-text leaks in repositories or CI/CD pipelines.
-
-### Key Capabilities
-- **Zero Plain-Text Secrets**: Injecting encrypted secrets at runtime without storing `.env` files in production artifacts.
-- **Automated Rotation**: Programmatic rotation of API keys, JWT secrets, and database passwords.
-- **Audit Logging**: Tracking secret access, version history, and permission policies across development teams.
-
-```bash
-# Infisical CLI Runtime Secret Injection
-infisical run -- env | grep DATABASE_URL
-```
-
----
-
-<a name="bahasa-indonesia"></a>
-## Bahasa Indonesia
-
-### Deskripsi
-Standar keamanan tingkat produksi untuk pengelolaan rahasia aplikasi, variabel lingkungan, kunci API, kredensial database, dan sertifikat TLS menggunakan Secret Manager Zero-Trust — Infisical, HashiCorp Vault, dan Doppler — dengan rotasi rahasia otomatis dan jaminan tanpa kebocoran teks polos di repositori atau pipeline CI/CD.
-
-### Fitur Utama
-- **Zero Plain-Text Secrets**: Injeksi rahasia terenkripsi saat runtime tanpa menyimpan file `.env` di artefak produksi.
-- **Rotasi Otomatis**: Rotasi terprogram untuk kunci API, rahasia JWT, dan kata sandi database.
-- **Audit Logging**: Pelacakan akses rahasia, riwayat versi, dan kebijakan izin di seluruh tim pengembangan.
+---
+
+# Zero-Trust Secret Vault & Credential Security Expert
+
+[English](#english) | [Bahasa Indonesia](#bahasa-indonesia)
+
+---
+
+<a name="english"></a>
+## English
+
+### Purpose & Overview
+Production-grade security standards for managing application secrets, environment variables, API keys, database credentials, and TLS certificates using Zero-Trust Secret Managers — Infisical, HashiCorp Vault, and Doppler — featuring automated secret rotation, dynamic credentials, and zero plain-text leaks in repositories or CI/CD pipelines.
+
+### Key Capabilities
+- **Zero Plain-Text Secrets**: Injecting encrypted secrets at runtime without storing `.env` files in production artifacts.
+- **Automated Rotation**: Programmatic rotation of API keys, JWT secrets, and database passwords.
+- **Audit Logging**: Tracking secret access, version history, and permission policies across development teams.
+
+```bash
+# Infisical CLI Runtime Secret Injection
+infisical run -- env | grep DATABASE_URL
+```
+
+### Implementation Checklist
+- [ ] Install Infisical CLI or Vault agent in the deployment environment.
+- [ ] Map environment variables (Development, Staging, Production) in the Secret Manager.
+- [ ] Configure CI/CD pipeline to inject secrets dynamically rather than using `.env` files.
+- [ ] Set up auto-rotation for database credentials and high-privilege API keys (e.g., every 30 days).
+
+### Example: Node.js Infisical SDK
+```javascript
+import { InfisicalClient } from "@infisical/sdk";
+
+const client = new InfisicalClient({
+  clientId: process.env.INFISICAL_CLIENT_ID,
+  clientSecret: process.env.INFISICAL_CLIENT_SECRET
+});
+
+const dbPassword = await client.getSecret("DATABASE_PASSWORD", {
+  environment: "prod",
+  path: "/database"
+});
+```
+
+## Orchestration & Integration
+- Integrates with: `ci-cd-devops-architect`, `authentication-identity-expert`, `mcp-server-architect`.
+
+---
+
+<a name="bahasa-indonesia"></a>
+## Bahasa Indonesia
+
+### Deskripsi
+Standar keamanan tingkat produksi untuk pengelolaan rahasia aplikasi, variabel lingkungan, kunci API, kredensial database, dan sertifikat TLS menggunakan Secret Manager Zero-Trust — Infisical, HashiCorp Vault, dan Doppler — dengan rotasi rahasia otomatis dan jaminan tanpa kebocoran teks polos di repositori atau pipeline CI/CD.
+
+### Fitur Utama
+- **Zero Plain-Text Secrets**: Injeksi rahasia terenkripsi saat runtime tanpa menyimpan file `.env` di artefak produksi.
+- **Rotasi Otomatis**: Rotasi terprogram untuk kunci API, rahasia JWT, dan kata sandi database.
+- **Audit Logging**: Pelacakan akses rahasia, riwayat versi, dan kebijakan izin di seluruh tim pengembangan.
+
+### Checklist Implementasi
+- [ ] Instal Infisical CLI atau agen Vault di lingkungan deployment.
+- [ ] Petakan variabel lingkungan (Development, Staging, Production) di Secret Manager.
+- [ ] Konfigurasi pipeline CI/CD untuk menyuntikkan rahasia secara dinamis (jangan gunakan file `.env`).
+- [ ] Atur rotasi otomatis untuk kredensial database dan kunci API berhak istimewa (misal: setiap 30 hari).
+
+### Contoh: Node.js Infisical SDK
+```javascript
+import { InfisicalClient } from "@infisical/sdk";
+
+const client = new InfisicalClient({
+  clientId: process.env.INFISICAL_CLIENT_ID,
+  clientSecret: process.env.INFISICAL_CLIENT_SECRET
+});
+
+const dbPassword = await client.getSecret("DATABASE_PASSWORD", {
+  environment: "prod",
+  path: "/database"
+});
+```
+
+## Integrasi Orkestrasi
+- Terintegrasi dengan: `ci-cd-devops-architect`, `authentication-identity-expert`, `mcp-server-architect`.

package/.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,20 +0,0 @@
----
-name: Feature request
-about: Suggest an idea for this project
-title: ''
-labels: ''
-assignees: ''
-
----
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.

package/.github/workflows/publish.yml

@@ -1,20 +0,0 @@
-name: Publish to npm
-
-on:
-  release:
-    types: [published]
-  workflow_dispatch:
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      # Setup .npmrc file to publish to npm
-      - uses: actions/setup-node@v4
-        with:
-          node-version: '20.x'
-          registry-url: 'https://registry.npmjs.org'
-      - run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}