Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/directus-labs/examples
Integration Examples with Directus
https://github.com/directus-labs/examples
angular astro blitz blog directus eleventy examples gatsby iles nextjs nuxt react remix svelte vue
Last synced: 3 months ago
JSON representation
Integration Examples with Directus
- Host: GitHub
- URL: https://github.com/directus-labs/examples
- Owner: directus-labs
- License: mit
- Archived: true
- Created: 2021-10-14T13:14:17.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-01-18T13:23:49.000Z (11 months ago)
- Last Synced: 2024-08-13T00:22:43.967Z (4 months ago)
- Topics: angular, astro, blitz, blog, directus, eleventy, examples, gatsby, iles, nextjs, nuxt, react, remix, svelte, vue
- Language: CSS
- Homepage: https://directus.io/guides
- Size: 20 MB
- Stars: 252
- Watchers: 11
- Forks: 109
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
> [!WARNING]
> This repository is unmaintained and without support.
> Please take a look at the [framework guides](https://docs.directus.io/guides/frameworks) in our documentation for step-by-step tutorials on combining Directus and your favorite frameworks.
Directus Examples
These frontend examples showcase how to integrate [Directus JavaScript SDK](https://docs.directus.io/reference/sdk), GraphQL, or official Directus plugins/modules with other frameworks in order to use [Directus](https://github.com/directus/directus) as the data source.
> ℹ These examples were created for demonstration purposes. They are not intended to be production ready, but PRs that address this and any other issues are always welcome!
## 📌 Prerequisites
These examples are frontend only, you will still need a Directus instance running to use them, this can be a [Cloud](https://directus.cloud/) instance, self hosted, or locally by first running the provided [Directus project](./directus) running first before proceeding with examples.
## 🔌 Integrations
| Logo | Framework | Blog Example |
| :--------------------------------------------------------------------------------------------------------------------------------------------: | -------------------------------------------------------- | :-------------------------------: |
| 
| **[Angular `v13`](https://github.com/angular/angular)** | [source](/angular) [1] |
| 
| **[Astro `v1.0`](https://github.com/withastro/astro)** | [source](/astro) |
| 
| **[Blitz `v0.45.4`](https://github.com/blitz-js/blitz)** | [source](/blitz) |
| 
| **[Eleventy `v1`](https://github.com/11ty/eleventy)** | [source](/eleventy) |
| 
| **[Gatsby `v5`](https://github.com/gatsbyjs/gatsby)** | [source](/gatsby) |
| 
| **[îles `v0.7`](https://github.com/ElMassimo/iles)** | [source](/iles) |
| 
| **[Next.js `v13`](https://github.com/vercel/next.js)** | [source](/nextjs) |
| 
| **[Nuxt.js `v2`](https://github.com/nuxt/nuxt.js)** | [source](/nuxtjs) |
| 
| **[Nuxt.js `v3`](https://github.com/nuxt/nuxt.js)** | [source](/nuxt3) |
| 
| **[React `v17`](https://github.com/facebook/react)** | [source](/react) [1] |
| 
| **[Remix `v1`](https://github.com/remix-run/remix)** | [source](/remix) |
| 
| **[Svelte `v3`](https://github.com/sveltejs/svelte)** | [source](/svelte) [1] |
| | **[SvelteKit `beta`](https://github.com/sveltejs/kit)** | [source](/sveltekit) |
| 
| **[Vue `v3`](https://github.com/vuejs/core)** | [source](/vue) [1] |
_[1]: These additionally uses full read permissions on `articles` & `directus_users` in Public role for simplicity sake._
## 🔗 Links
- ✨ Official Website — [https://directus.io](https://directus.io)
- 📘 Documentation — [https://docs.directus.io](https://docs.directus.io)
- 👥 Community — [GitHub discussions](https://github.com/directus/directus/discussions)
- 🎬 Youtube — [Video tutorials](https://www.youtube.com/c/DirectusVideos)
- 🐦 Twitter — [@directus](https://twitter.com/directus)
- 💬 Chat — [Discord server](https://directus.chat)