Automatically publish changes to your static website using CloudBuild and Github
A static website typically consists of HTML, CSS, and JavaScript files that are served directly to the user's browser without any server-side processing. These files are pre-built and do not change dynamically based on user input or other factors.
A static website can be enhanced with dynamic content by integrating it with a third-party service that provides dynamic content. In this example, we will demonstrate how to integrate a static AI website hosted in Cloud Storage with a Cloud Functions service. The Cloud Functions service will handle user requests to Gemini AI and display the response to the users.
When a user visits the static website, the website will make a request to the Cloud Functions service, which will in turn make a request to the Gemini AI service. The Gemini AI service will process the request and return the response to the Cloud Functions service, which will then return the response to the user.
This example demonstrates how to automatically deploy a static website to Google Cloud Storage whenever changes are made to the website's content in a Github repository. The deployment process is triggered by a Cloud Build job that builds the static website and deploys it to Cloud Storage.
- Developer makes a change to the static website's content in the Github repository.
- The developer pushes the changes to the Github repository and merges the changes to the main branch.
- Github triggers a Cloud Build job to build the static website.
- Terraform deploys the static website to Cloud Storage.
-
Create a secret in Google Cloud Secret Manager with the name
xplorers-gemini-ai-api-key
and the value of your Gemini AI API key. For more information on how to obtain an API key, refer to the Gemini AI API documentation. -
Create a secret in Google Cloud Secret Manager with the name
cloudflare-api-key
and the value of your Cloudflare API key. For more information on how to obtain an API key, refer to the Cloudflare API documentation.
Create a Cloud Storage bucket and update configuration/defaults.conf
with the name of the bucket
Update the default values in configuration/defaults.conf
with your project ID, region, and other values.
The variable STATIC_AI_WEBSITE_BUCKET_NAME
should be set to the name of the bucket where the static website will be deployed.