Nuxt3 Directus Starter

screenshot of Nuxt3 Directus Starter
nuxt
tailwind
directus

Nuxt 3 starter for Directus with Tailwind CSS and lots of other goodies

Overview:

The Nuxt 3 / Directus Starter is a starter template designed to help developers build internal or client applications faster. It includes built-in support for Directus 9 as a backend, API, or headless CMS. With features like Tailwind CSS, authentication and user store configuration, common components, utilities, dark mode support, and integration with various plugins and libraries, this starter template provides a comprehensive set of tools to streamline the development process.

Features:

  • Built-in Directus 9 support: Allows users to use Directus as their backend, API, or headless CMS.
  • Tailwind CSS with all plugins: Includes Tailwind CSS with all plugins like HeadlessUI and Heroicons, making it easy to style and customize the application.
  • Authentication and user store configuration: Provides pre-configured authentication and user store, saving developers time and effort in setting up these components.
  • Ready to use common components: Includes common components like modals, dropdowns, and file upload input, eliminating the need for developers to build these components from scratch.
  • Common utilities: Offers utilities like relative time and currency formatting, reducing the number of additional packages required.
  • ESLint and Prettier configuration: Comes with pre-configured ESLint and Prettier settings for code consistency and formatting.
  • Dark mode support: Supports dark mode, allowing users to switch between light and dark themes.
nuxt
Nuxt

nuxt.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

tailwind
Tailwind

Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.

directus
Directus

A website that uses Directus as an open source headless CMS to manage content. This includes features such as a customizable content model, role-based access control, and API-based content delivery to support a wide range of digital experiences.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

postcss
Postcss

PostCSS is a popular open-source tool that enables web developers to transform CSS styles with JavaScript plugins. It allows for efficient processing of CSS styles, from applying vendor prefixes to improving browser compatibility, ultimately resulting in cleaner, faster, and more maintainable code.

Recoil

Recoil is a state management library for React that provides an intuitive and flexible API for managing and sharing state across components. It supports a range of features, including derived state, asynchronous updates, and time-travel debugging, and is designed to work well with the React ecosystem and other state management solutions.