Nuxt 3 starter for Directus with Tailwind CSS and lots of other goodies
Nuxt 3 / Directus Starter
⚠️ WORK IN PROGRESS – DO NOT USE ⚠️
Opiniated starter template for Nuxt 3 using Directus 9 as a backend
Stack
Nuxt 3
Directus SDK
Tailwind CSS
Plugins
- Typography
- Forms
- Aspect Ratio
- Line Clamp
Headless UI
Heroicons
Pinia
Directus 9 Support
Can be used with Cloud or Self-Hosted versions
- Wrapped Directus SDK into Nuxt Plugin
- Auth Store
Great Examples of
- Authentication
- Fetching content from Directus
- Protecting content with Nuxt Middleware
Common Utilities
ESLint and Prettier Config
Directus Setup
1 Register for a free Directus Cloud account https://directus.cloud/register
2 Create a new project
- Directus has a free Community Cloud tier that’s perfect for tinkering
3 Create pages collection title slug content image
4 Set public permissions for Files Pages
TODO Seed starter
Nuxt Setup
Make sure to install the dependencies
yarn install
Development
Start the development server on http://localhost:3000
yarn dev
Production
Build the application for production:
yarn build
Checkout the deployment documentation.