Technical Details

Let's explore the key tools and libraries that power Nuxtbe, and understand the rationale behind our technology choices.

Technical Details

Let's dive into the technical details of Nuxtbe.

The kit was built with Nuxt Framework. Which means that it utilizes Nuxt's capabilities to build a robust and scalable application. Also it utilizes remarkable Nuxt modules to add additional features to the boilerplate:

  • Icons: Icon module for Nuxt with 200,000+ ready to use icons from Iconify.
  • Color Mode: Dark and Light mode for Nuxt with auto detection.
  • SEO: The complete SEO solution for Nuxt.
  • TailwindCSS and Shadcn: Styling and UI components.
  • VueUse and VueUse Motion: Collection of essential Vue Composition Utilities for Vue.
  • FormKit Auto Animate: Automatic animations for your Nuxt app with a single line of code.
  • Supabase: First class integration with Supabase. Handles authentication, database and real-time data.
  • Stripe: This Nuxt module provides an easy way to integrate Stripe in your Nuxt application, both on the client-side and server-side.
  • Fonts: Plug-and-play web font optimization and configuration for Nuxt apps.
  • Image: Optimised images for Nuxt, with progressive processing, lazy-loading, real-time resizes and providers support.
  • Content: Nuxt Content reads the content/ directory in your project, parses .md, .yml, .csv or .json files and creates a powerful data layer for your application.
  • Vee Validate with Zod: Runtime form validation for Vue.js with Zod.

Except Nuxt modules there are some other libraries and tools that are used in the boilerplate:

  • Resend: Email integration for sending emails, building audience and sending newsletters.
  • LemonSqueezy: Subscription management and billing.
  • GitHub: GitHub integration for inviting users to the GitHub repository.
  • Zod: Type safety for JavaScript.
  • Shadcn/UI: UI components for Nuxt.
Introduction
Build a SaaS application with Nuxtbe
First Steps
Build a SaaS application with Nuxtbe