{"id":20675895,"url":"https://github.com/directus/website","last_synced_at":"2025-08-20T09:27:12.143Z","repository":{"id":173085525,"uuid":"650205938","full_name":"directus/website","owner":"directus","description":null,"archived":false,"fork":false,"pushed_at":"2025-06-04T17:55:29.000Z","size":3751,"stargazers_count":30,"open_issues_count":1,"forks_count":18,"subscribers_count":9,"default_branch":"main","last_synced_at":"2025-06-04T22:58:55.148Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://directus.io","language":"Vue","has_issues":false,"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/directus.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"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}},"created_at":"2023-06-06T15:10:30.000Z","updated_at":"2025-06-04T17:55:19.000Z","dependencies_parsed_at":"2024-07-25T22:03:30.844Z","dependency_job_id":"7d10a0a0-aa31-43c7-b534-0868c065f275","html_url":"https://github.com/directus/website","commit_stats":null,"previous_names":["directus/website"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/directus%2Fwebsite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/directus%2Fwebsite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/directus%2Fwebsite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/directus%2Fwebsite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/directus","download_url":"https://codeload.github.com/directus/website/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/directus%2Fwebsite/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259078466,"owners_count":22802130,"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","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":"2024-11-16T21:11:04.225Z","updated_at":"2025-08-20T09:27:12.120Z","avatar_url":"https://github.com/directus.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Directus Website\n\nThe official Directus website - a sophisticated marketing site built with Nuxt 3, TypeScript, and a block-based CMS architecture powered by Directus headless CMS.\n\n🌐 **Live Site:** [directus.io](https://directus.io)\n🏗️ **Built with:** Nuxt 3, TypeScript, Vue 3, Tailwind CSS\n📱 **Features:** SSG, Visual Editing, Analytics, Marketplace Search\n\n## Quick Start\n\n### Prerequisites\n\n- **Node.js** \u003e= 20.0.0\n- **pnpm** \u003e= 8.15.0 (package manager is enforced)\n\n### Development\n\n```bash\n# Install dependencies\npnpm install\n\n# Start development server\npnpm dev\n\n# Build for production\npnpm build\n\n# Type checking\npnpm typecheck\n\n# Linting \u0026 formatting\npnpm lint\npnpm format\n\n# Bundle analysis\npnpm analyze\n```\n\n## Architecture\n\n### Technology Stack\n\n- **🚀 Nuxt** - Vue.js framework with SSR/SSG capabilities\n- **📘 TypeScript** - Strict typing with full type checking enabled\n- **🎨 Tailwind CSS** - Utility-first CSS framework\n- **📦 Directus SDK** - Headless CMS integration with custom schema\n- **📊 PostHog** - Analytics and feature flags (custom module)\n- **🔍 Typesense** - Search functionality for marketplace\n- **🖼️ Nuxt Image** - Optimized image handling with multiple providers\n\n### Key Features\n\n#### Block-Based CMS System\nDynamic content management with reusable blocks:\n- **PageBuilder.vue** - Core component that renders sections containing blocks\n- **PageSection.vue** - Handles section-level styling and spacing\n- **Block Components** - Located in `components/Block/`, each block type has its own component\n\n#### Directus Integration\n- **Schema Types** - Comprehensive TypeScript definitions in `types/schema/`\n- **Rate Limiting** - Built-in API throttling (10 requests per 500ms)\n- **Visual Editing** - Live preview and editing capabilities\n\n#### Marketplace\n- **Typesense Integration** - Fast search for extensions, integrations, and templates\n- **Domain Services** - Organized by collection type in `layers/marketplace/`\n- **Indexing API** - Secure endpoints for content indexing\n\n### Directory Structure\n\n```\n├── components/          # Vue components (Base, Block, Nav, etc.)\n├── composables/         # Reusable Vue composition functions\n├── layouts/            # Page layouts (default, blank, tv)\n├── pages/              # File-based routing with dynamic content\n├── plugins/            # Nuxt plugins (Directus, PostHog, etc.)\n├── middleware/         # Route middleware\n├── server/             # Server-side API endpoints\n├── types/schema/       # TypeScript definitions for Directus schema\n├── layers/marketplace/ # Marketplace functionality (Nuxt layer)\n├── modules/            # Custom Nuxt modules\n└── scripts/           # Utility scripts\n```\n\n## Environment Variables\n\nCreate your .env file by copying the .env example:\n\n```bash\ncp .env.example .env\n```\n\nThen update the following variables in your `.env` file:\n\n### Required\n\n```bash\n# CMS Integration\nDIRECTUS_URL=https://your-directus-instance.com\nDIRECTUS_TV_URL=https://your-directus-tv-instance.com\n\n# Site Configuration\nNUXT_PUBLIC_SITE_URL=https://directus.io # or http://localhost:3000\nNUXT_PUBLIC_ENABLE_VISUAL_EDITING=true\n\n# Analytics\nGOOGLE_TAG_MANAGER_ID=GTM-XXXXXXX\nPOSTHOG_API_KEY=your-posthog-key\nPOSTHOG_API_HOST=https://app.posthog.com\n```\n\n### Marketplace\n\n```bash\n# Marketplace Registry\nDIRECTUS_MARKETPLACE_REGISTRY_URL=https://registry.directus.io\nDIRECTUS_MARKETPLACE_REGISTRY_TOKEN=your-registry-token\n\n# Search (Typesense)\nTYPESENSE_URL=https://your-typesense-cluster.com\nTYPESENSE_PUBLIC_API_KEY=your-public-key\nTYPESENSE_PRIVATE_API_KEY=your-private-key\n\n# Indexing Security - generate a secure API key\nTYPESENSE_INDEXING_API_KEY=$(openssl rand -hex 32)\n```\n\n## Marketplace Indexing\n\nThe marketplace search uses Typesense for indexing extensions, integrations, and templates.\n\nWith the dev server running, use these npm scripts:\n\n```bash\n# Index all collections\npnpm run index:all\n\n# Index specific collections\npnpm run index:extensions\npnpm run index:integrations\npnpm run index:templates\n```\n\n### API Endpoints\n\n- `POST /api/search/indexing/all` - Index all collections\n- `POST /api/search/indexing/extensions` - Index extensions only\n- `POST /api/search/indexing/integrations` - Index integrations only\n- `POST /api/search/indexing/templates` - Index templates only\n\nAll endpoints require the `X-API-Key` header with your `TYPESENSE_INDEXING_API_KEY`.\n\n### Troubleshooting\n\n**\"Invalid or missing API key\"**\n- Make sure `TYPESENSE_INDEXING_API_KEY` is set in your `.env` file\n- Check that you're passing the key in the `X-API-Key` header\n\n**\"TYPESENSE_INDEXING_API_KEY not configured\"**\n- The environment variable isn't set on the server\n- Add it to your deployment environment variables\n\n**Connection errors**\n- Make sure the dev server is running\n- Check that `NUXT_PUBLIC_SITE_URL` points to the correct URL\n\n## Deployment\n\n### Netlify (Current)\n\nThe site is deployed on Netlify with automatic builds from the main branch.\n\n**Build Settings:**\n- **Build Command:** `pnpm build`\n- **Publish Directory:** `.output/public`\n- **Node Version:** 20+\n\n**Environment Variables:** Set all required environment variables in Netlify's site settings.\n\n### Performance Optimizations\n\n- **Static Site Generation** - Pre-rendered pages for optimal performance\n- **Image Optimization** - Multiple providers (Directus, Directus TV)\n- **Build Cache** - Shared prerender data and build caching enabled\n- **Bundle Analysis** - Use `pnpm analyze` to monitor bundle size\n\n## Content Management\n\n### Block System\n\nThe website uses a sophisticated block-based content system:\n\n1. **Content Editors** create pages using blocks in Directus\n2. **PageBuilder.vue** dynamically renders these blocks\n3. **Block Components** in `components/Block/` handle each block type\n4. **TypeScript Types** ensure type safety across the entire system\n\n### Content Types\n\n- **Pages** - Dynamic pages with blocks (`pages/[...permalink].vue`)\n- **Blog Posts** - Articles and announcements (`pages/blog/[slug].vue`)\n- **Features** - Product feature pages (`pages/features/[slug].vue`)\n- **Team** - Team member profiles (`pages/team/[slug].vue`)\n- **Case Studies** - Customer success stories (`pages/case-studies/[slug].vue`)\n- **TV** - Video content and shows (`pages/tv/`)\n\n### Visual Editing\n\nContent editors can use Directus Visual Editor for:\n- **Live Preview** - See changes in real-time\n- **Block-level Editing** - Edit content directly on the page\n- **Modal Interface** - Rich editing experience\n\n## Development Notes\n\n### Custom Modules\n\n- **PostHog Module** (`modules/posthog/`) - Analytics with feature flags\n- **Prerender Module** (`modules/prerender.ts`) - Static site generation config\n- **Redirects Module** (`modules/redirects.ts`) - URL redirect handling\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdirectus%2Fwebsite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdirectus%2Fwebsite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdirectus%2Fwebsite/lists"}