Deploy static Astro website to Google App Engine

· google-app-enginedeploymentastrojsastros

There seemed to be no information on deploying a static site to Google App Engine so here it is.

Photo by Pawel Czerwinski on Unsplash

Pros of App Engine

  1. App Engine has a fairly generous free tier for each project you create in Google Cloud.
  2. It is serverless. So it scales easily and is pay as you go.

It’s Simple

  1. Make sure you have a Google Cloud project created. You can only create one App Engine instance per project.
  2. Once ready to deploy, in your terminal type:
>> npm astro build

  1. Your files will be built into a folder called dist

  2. Write your app.yaml

runtime: nodejs18

handlers:
  # Serve the root URL (/) with secure option
  - url: /
    secure: always
    static_files: dist/index.html
    upload: dist/index.html

  # Serve CSS, JS, images, fonts, and other static assets
  - url: /(.+)\.(.+)
    static_files: dist/\1.\2
    upload: dist/(.+)\.(.+)

  # Serve specific pages based on their URL path (using index.html files)
  - url: /(.*)
    static_files: dist/\1/index.html
    upload: dist/(.*)/index.html

Quick regex tip: (.*) matches a pattern and \1 and \2 is the value of the match.

  1. Deploy with gcloud and your done!
>>> gcloud app deploy

Please like!