Nuxt3 Project Template

Welcome. This template is designed to help you quickly set up and start developing your Nuxt3 applications. It comes pre-configured with several essential packages to make your life easier.

Happy coding!

Table of Contents

• 🚀 Getting Started
• 📖 Linting
• 🏠 Environment Variables
• 🧩 Packages / Stack

Getting Started

Install the packages as following:

pnpm install

Run locally

pnpm run dev

Build

pnpm run build

Linting

Check for linting errors:

pnpm run lint

Autofix linting errors:

pnpm run lint:fix

Environment Variables

Use the .env.example file as a template

# .env

NUXT_PUBLIC_BASE_URL=http://localhost:3000

You can change the BASE_URL to a development API url for testing/implementing. If you want to add more environment variables make sure to include them in nuxt.config.ts under runtimeConfig

# nuxt.config.ts

runtimeConfig: {
  public: {
    BASE_URL: '',
    YOUR_NEW_ENV_VARIABLE: '',
  },
}

Project packages / stack

Each package has a link to useful documentation

Category	Package
Packages	PNPM
Formatting	AntFu ESLINT
i18n	@nuxtjs/i18n with customRoutePaths (locales folder)
CSS	@nuxtjs/tailwindcss
Validation	Zod
Animations	GSAP
Sliders	Keen Slider / SwiperJS (If need for complicated sliders)
Auth	Self-written
State	Nuxt useState / Pinia
Data Fetching	Custom API plugin → useAPI composable