examples

⚠️ Warning: This repository is unmaintained and without support. For current integration guides, refer to the framework guides in Directus documentation [fa-solid fa-up-right-from-square].

Overview

This repository contains frontend examples demonstrating how to integrate Directus with various JavaScript frameworks. The examples show usage of:

• Directus JavaScript SDK
• GraphQL
• Official Directus plugins/modules

Purpose: Serve as demonstration code for using Directus as a data source in different frontend frameworks.

Target Audience: Developers looking to implement Directus in their frontend projects.

Key Features

• Examples for multiple frameworks (including Svelte and SvelteKit)
• Focus on blog implementation patterns
• Designed for educational purposes (not production-ready)

Supported Frameworks

The repository includes examples for:

• Angular
• Astro
• Blitz
• Eleventy
• Gatsby
• îles
• Next.js
• Nuxt.js (v2 & v3)
• React
• Remix
• Svelte (v3)
• SvelteKit (beta)
• Vue

Important Notes

• Requires a running Directus instance (cloud, self-hosted, or local)
• Some examples use simplified public permissions for demonstration purposes
• Community contributions are welcome via PRs

Resources

• Directus Website [fa-solid fa-up-right-from-square]
• Documentation [fa-solid fa-up-right-from-square]
• Community Discussions [fa-solid fa-up-right-from-square]
• Discord Server [fa-solid fa-up-right-from-square]