Create and deploy a containerized web app

Learn how to create a containerized web app using the Cloud Shell Editor, test it locally, and then deploy it to a Google Kubernetes Engine (GKE) cluster.


For step-by-step guidance on this task directly in Cloud Shell Editor, click Guide me:

Guide me


The following sections take you through the same steps as clicking Guide me.

Before you begin

  1. In the Google Cloud console, go to the project selector page.

    Go to project selector

  2. Select or create a Google Cloud project.

Create your web app

Use the Cloud Shell Editor as your environment for creating your app. The editor comes preloaded with the tools needed for Cloud development.

To create your app:

  1. Launch the Cloud Code menu from the status bar.
  2. Select New Application.
  3. Select Kubernetes application as the type of sample app.
  4. From the list of sample Kubernetes apps, select Go:Hello World.
  5. Select a folder for your app location and then click Create New Application.

Cloud Shell Editor loads your app in a new workspace. After it reloads, your app is accessible with the explorer view.

Test your app in a local cluster

Now that you've created your app, you can run it in a local Kubernetes cluster in Cloud Shell:

  1. To open a Cloud Shell terminal, click Terminal > New Terminal.
  2. To start your local minikube cluster, from the terminal command prompt, run the following command:

    minikube start
    

    It might take a minute to set up the minikube cluster.

  3. If prompted to authorize Cloud Shell to make Cloud API calls, click Authorize.

    After your cluster is set up, a message similar to the following appears:

    Done! kubectl is now configured to
    use "minikube" cluster...
    

After the local cluster is configured, build and run this app:

  1. Launch the Cloud Code menu from the status bar.
  2. Select Run on Kubernetes.
  3. If prompted, confirm that you want to use the current minikube context.

    This process takes a few minutes and you can view the deployment status in the Development sessions view.

    Clicking different nodes in the Development sessions view displays log excerpts pertaining to the selected deployment phase.

  4. After your app finishes building and deploying, find the port forward node for your service: In the Development sessions view, expand Port Forward URLs > service > go-hello-world-external.

  5. To launch your app, hold the pointer over go-hello-world-external and then click Open URL.

Edit your app

To understand the Hello World app's components, see the diagram in the app's readme.md file. At a high level, the app consists of:

  • A basic go-hello-world web app, main.go, that returns a templated "It's running!" response to all received requests.
  • A load balancer go-hello-world-external service, hello.service.yaml, that exposes the app by describing a Kubernetes Service.

To modify the app:

  1. Modify your main.go file to print "It's redeployed!". The file saves automatically.
  2. Give your app a minute to finish building and deploying, and monitor your app's progress as it's rebuilt using the Development sessions view.

  3. After your app finishes building and deploying, find the port forward node for your service: Development sessions > Port Forward URLs > service > go-hello-world-external.

  4. To launch your app, hold the pointer over go-hello-world-external and click Open URL.

View app logs

To analyze your app while it's running, use the Log Viewer to monitor its logs:

  1. Launch the Log Viewer by opening the command palette (accessible with Ctrl/Cmd+Shift+P or View > Command Palette) and then running Cloud Code: View Logs.

    This view allows you to filter and navigate the logs for your app.

  2. Specify the Deployment filters to view the logs for your app, go-hello-world.

  3. Switch to the tab with your app that shows "It's redeployed!" Reload the page in the browser and then switch back to the Cloud Shell tab.

  4. To view the newly generated logs in the Log Viewer, click Refresh.

Create a Google Kubernetes Engine cluster

To create a new Google Kubernetes Engine cluster to deploy your app to: 1. To open the Kubernetes Explorer, click Cloud Code - Kubernetes.

  1. Click Add a Cluster to the KubeConfig and then click Google Kubernetes Engine in the Quick pick menu.

  2. When prompted to enable container.googleapis.com, click Yes.

  3. Click + Create a New GKE Cluster.

  4. Choose Standard as the cluster type.

  5. Click Open to permit Cloud Shell to open the console.

  6. In console, use the project you created, set the zone to us-central1-a, and set the cluster name to my-first-cluster.

  7. Click Create. Cluster creation takes a few minutes.

  8. After the cluster is created, in the Quick pick menu, click Refresh Kubernetes cluster view Refresh.

  9. After the name of your new cluster appears in the list, click the cluster name. Your new cluster is added to the configuration and configured to be the active context.

Deploy your app to a GKE cluster

To deploy your app to the new cluster:

  1. From the Cloud Code menu, accessible using the status bar, select Run on Kubernetes.

  2. Confirm your newly created cluster as the context for your app.

  3. Confirm the default option for your image registry.

  4. Give your app a minute to finish building and deploying, and monitor your app's progress as it's rebuilt using the Development sessions view.

  5. After your app finishes building and deploying, find the port forward node for your service: In the Development sessions view, expand Port Forward URLs > service > go-hello-world-external.

  6. To launch your app, hold the pointer over go-hello-world-external and click Open URL.

Cleaning up

To delete just the cluster you created for this quickstart:

  1. Hold the pointer over your cluster name and then click Open in console icon Open in console.
  2. Click Delete and then click Delete.

To delete your project (and associated resources, including any clusters):

  1. Go to the Projects page in the console:

    Go to the Projects page

  2. Select the project that you created for this quickstart and then click Delete.

  3. Type the project ID to confirm and then click Shut down.

    This shuts down the project and schedules it for deletion.

What's next