Nuxt3 + Firebase v9 + Tailwind CSS Template

This is a template repository for building fast, scalable, and modern web applications using Nuxt 3, Firebase v9, and Tailwind CSS.
Firebase Admin SDK is also included for server-side authentication.

Setup

Make sure to install the dependencies:

yarn install
# or `npm install` if you prefer npm

Configuration

⚠️ You don't need to use a service account if you are deploying to Firebase Hosting or any other Google Cloud environment. You can use Application Default Credentials (ADC) instead. Checkout the documentation for more information. A service account is required only when you are using a non-Google environment like Vercel.

Create a copy of .env.example and rename it to .env.
Replace the values with your own Firebase project credentials.

If you want to use Firebase Admin SDK, copy fields from your service account JSON file to .env file. All service account fields are prefixed with FIREBASE_SA_. You must replace all newlines with \n the private key field. It should look like this:

FIREBASE_SA_PRIVATE_KEY="-----BEGIN PRIVATE KEY-----\nMI...k=\n-----END PRIVATE KEY-----\n"

Development Server

Start the development server on http://localhost:3000

yarn dev

Production

Build the application for production:

yarn build

Locally preview production build:

NITRO_PRESET=firebase yarn build
firebase emulators:start

Deployment

To deploy your web application on Firebase Hosting, run:

NITRO_PRESET=firebase yarn build
firebase deploy

You can deploy your application to any other hosting provider mentioned in Nuxt 3 deployment documentation.