sveltekit-template Svelte Themes

Sveltekit Template

Deploy SvelteKit to Google Cloud Run with Terraform and a full GitOps pipeline.

SvelteKit + Terraform + GCP Template

This repository is a reusable template for building SvelteKit applications with a production-ready infrastructure on Google Cloud Platform (GCP). It includes a pre-configured setup for SvelteKit, TailwindCSS, and a complete GitOps pipeline using Cloud Build and Cloud Deploy, provisioned via Terraform.

🚀 Features

📂 Project Structure

  • svelte-app/: The source code for the SvelteKit application.
  • terraform/: Terraform configurations to provision Google Cloud infrastructure.
  • clouddeploy/: Kubernetes/Knative manifests for Cloud Deploy (Cloud Run services).
  • cloudbuild.yaml: Configuration for the build pipeline.
  • skaffold.yaml: Configuration for deployment rendering.
  • Dockerfile: Docker build for the application.

🛠 Prerequisites & Setup

Before you begin, you'll need to set up your environment and accounts.

1. Install Required Tools

We recommend using Homebrew on macOS and Linux to manage these dependencies.

Homebrew (if not installed):

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Install Development Tools:

# Node.js (Runtime) and npm (Package Manager)
brew install node

# Terraform (Infrastructure as Code)
brew install terraform

# GitHub CLI
brew install gh

# Google Cloud CLI (Interaction with GCP)
brew install --cask google-cloud-sdk

Verify Installations:

node -v
terraform -v
git --version
gh --version
gcloud version

2. Google Cloud Platform (GCP) Setup

  1. Authenticate Locally: Login to your Google Cloud account via the CLI:

    gcloud auth login
    
  2. Define Project ID: Export your desired project ID as an environment variable to use in subsequent commands. Note: Project IDs must be globally unique and length between 6 and 30 characters.

    export PROJECT_ID="my-sveltekit-app"
    
  3. Create a GCP Project:

    gcloud projects create $PROJECT_ID --name="My SvelteKit App"
    
  4. Link a Billing Account: Cloud Run and Cloud Build require an active billing account.

    • Check for existing billing accounts:
      gcloud beta billing accounts list
      
    • If you DO NOT have a billing account: You must create one in the Google Cloud Console Billing Page. The CLI cannot collect payment information securely. Once created, run the list command above to get your Billing Account ID.
    • Link the billing account to your project: Replace BILLING_ACCOUNT_ID with the ID from the previous step.
      gcloud beta billing projects link $PROJECT_ID --billing-account=BILLING_ACCOUNT_ID
      
  5. Set Active Project: Configure your local environment to use this new project by default:

    gcloud config set project $PROJECT_ID
    
  6. Authenticate for Terraform: Terraform needs Application Default Credentials to provision resources on your behalf:

    gcloud auth application-default login
    
  7. Domain Verification (Optional): If you plan to use a custom domain, you must verify ownership in GCP before applying Terraform:

    1. Acquire a domain (e.g., example.com).
    2. Go to the Google Search Console Verification page (replace example.com with your domain).
    3. Complete domain ownership verification by adding the required TXT DNS record in your domain registrar's DNS management settings via your domain registrar service. and clicking Verify.

3. GitHub Setup

  1. Get the Template Code: Choose your app name and clone this repository to your local machine:

    export my_repo_name=my-sveltekit-app
    git clone https://github.com/henrisaksi/sveltekit-template.git $my_repo_name
    cd $my_repo_name
    # Remove the existing git history to start fresh
    rm -rf .git
    
  2. Authenticate Git and GitHub CLI: Configure your git user identity and authenticate the GitHub CLI:

    git config --global user.name "Your Name"
    git config --global user.email "[email protected]"
    gh auth login
    
  3. Create a Repository: Initialize a new git repository and push it to GitHub using the CLI:

    git init
    git add .
    git commit -m "initial commit"
    gh repo create --source=. --private --push
    
  4. GitHub Personal Access Token (PAT):

    • Go to User navigation menu (top right) > Settings > Developer settings > Personal access tokens > Tokens (classic).
    • Generate a new token with the following scopes:
      • repo (Full control of private repositories)
      • read:org (Read org and team membership)
      • read:user (Read all user profile data - required to verify access to the installation)
    • Save this token; you will need it for terraform.tfvars.
  5. Cloud Build GitHub App Installation:

    • Install the Google Cloud Build GitHub App on your repository.
    • Select the project that you created earlier.
    • Note: No need to configure the trigger in Google Cloud Console!! Just install the app.
    • After installation, go to https://github.com/settings/installations , click "Configure" and note the Installation ID from the URL (e.g., https://github.com/settings/installations/12345678 -> ID is 12345678).

4. Infrastructure Setup

  1. Create Terraform State Bucket: Terraform needs a GCS bucket to store its state. Create one manually (must be globally unique):

    # Choose a unique name, e.g., your-project-id-tfstate and valid location (https://cloud.google.com/about/locations).
    export TF_STATE_BUCKET="${PROJECT_ID}-tfstate"
    export TF_STATE_BUCKET_LOCATION="europe-west1"
        
    gcloud storage buckets create gs://$TF_STATE_BUCKET --location=$TF_STATE_BUCKET_LOCATION
    
  2. Navigate to the terraform directory:

    cd terraform
    
  3. Copy the example variables file:

    cp terraform.tfvars.example terraform.tfvars
    
  4. Edit terraform.tfvars with the details you gathered in the "Prerequisites" section.

  5. Initialize Terraform with the state bucket:

    terraform init -backend-config="bucket=$TF_STATE_BUCKET"
    
  6. Apply the infrastructure:

    terraform apply
    # reply yes when prompted
    

    Note: Sometimes it takes a few minutes for the APIs to be enabled. There is a time_sleep resource that waits for the APIs to be enabled, but it might not be enough. If you encounter an error about an API not being enabled, wait a few minutes and try again.

    Note: The initial terraform apply deploys a placeholder image (gcr.io/cloudrun/hello) to Cloud Run. The actual SvelteKit application will be deployed when you trigger the first build (next step).

  7. Note the cloud_run_url that you can use to access your application:

  terraform output
  # cloud_run_url = "https://svelte-app-asdfasdf-lz.a.run.app"

5. Trigger Deployment

The build pipeline is triggered by pushes to the main branch. To deploy your application for the first time:

  1. Commit and push a change to GitHub (or use an empty commit):

    git commit --allow-empty -m "Trigger deployment"
    git push origin main
    
  2. Watch the build status in the Cloud Build Console. It should show 3 builds with green checkmarks.

  3. Wait for the build to complete and then visit the Cloud Run URL to see your application running.

6. Post-Deployment DNS Configuration (Optional)

If you configured a domain_name in terraform.tfvars and Terraform successfully created the domain mapping:

  1. Go to the Cloud Run Domain Mappings console.
  2. Click DNS records for your service.
  3. Copy all those DNS records (A, AAAA, or CNAME) (CNAME is for subdomains) to your domain registrar's DNS management settings via your domain registrar service.
  4. Wait for DNS propagation (can take up to 24 hours, but usually faster).

7. Local Development

To run the application locally:

  1. Navigate to the app directory:

    cd svelte-app
    
  2. Install dependencies:

    npm install
    
  3. Start the development server:

    npm run dev
    

    The app will be available at http://localhost:5173.

🗑 Cleanup & Teardown

To avoid incurring charges, you should clean up the resources created by this project.

The simplest way to clean up is to shut down the entire project.

gcloud projects delete $PROJECT_ID

Author

This template was created by Henri Saksi and tested on 2026-02-15.

Top categories

Loading Svelte Themes