Deploy to GCP

You can host and share your Toolpad Studio apps on Google Cloud Platform (GCP) in a few minutes, for free.

GCP offers an ecosystem of products to help you build, manage, and scale any web service. This guide uses Cloud Run and Cloud Build to deploy a Toolpad Studio app from a GitHub repository.

Prerequisites

• A GCP account
• A GitHub account
• A GitHub repository containing your Toolpad Studio app. Check out pushing your Toolpad Studio app to GitHub for this step.

Setting a new app on GCP

1. Login in to Google Cloud console and from the header bar choose the project where you want to setup the web service.

2. From the navigation menu icon, click on Cloud Run.

3. Click on Create Service to set up your web app.

4. In the Create service UI, choose Continuously deploy from a repository and give a name to your service from the Service name input. Further click on Setup with cloud build button.

5. This opens a drawer menu. From the drop-down, choose the repository that contains your Toolpad Studio app and click Next.

6. The branch input shows main by default and it can remain unchanged. From the radio buttons, choose the second option as it is a Node.js app. The other configurations can be kept unchanged. Click Save.

7. With the drawer closed, on the Cloud Run setup UI, choose Allow unauntheticated invocations to create a public app that needs no authentication and scroll down.

8. The last step is to expand the 'Container(s), Volumes, Networking, Security' caret. The first input Container port needs to be updated to 3000. Click the Create button to start the service.

9. The next screen shows that the deployment is in progress and the build is being prepared, which can take 3-5 minutes. You can click on the logs link (pending state) to see the live build logs in Cloud Build UI.

10. Once this is successfully complete, go back to the Cloud Run page and access your Toolpad Studio app from the created URL .

That's it! The app is up and running in a few minutes. Make changes, push to GitHub, and your app automatically redeploys each time.

Common pitfalls

1. GCP chooses npm as the default package manager, you might have to change. Check out Building a Node.js application for more.

2. You might have to enable account permissions and APIs within the Google Cloud console. These are the security measures that GCP puts in place. For instance, this deployment required enabling a few GCP services from the Cloud Build Settings UI.

3. You may have to update your root directory in the Build context directory input in step 6.

In case you need more information, you can check Deploy a Node.js service to Cloud Run quickstart guide from Google.