How to Deploy a Next.js 13 Website on Google Cloud Run and Expose it to the Internet in 5 minutes

Matías Salinas
3 min readMar 13, 2023

--

Google Cloud Run is a fully managed serverless platform that allows you to run stateless containers in a serverless environment. In this article, we will show you how to deploy a Next.js 13 website on Cloud Run and expose it to the internet. We will also show you how to configure the Cloud Run IAM policy to allow all users to access your website without authentication.

Prerequisites

Before you start, you will need the following:

  • A Google Cloud Platform account
  • The Google Cloud SDK installed on your local machine
  • Node.js and npm installed on your local machine
  • Docker installed on your local machine

Step 1: Create a Next.js project

To get started, you will need to create a new Next.js project. Open your terminal and run the following command:

npx create-next-app my-app

This will create a new Next.js project called “my-app”.

Step 2: Test the Next.js project

After creating the project, you can test it locally by running the following commands:

cd my-app
npm run dev

This will start the development server, and you can access the website at http://localhost:3000.

Step 3: Create a Dockerfile

Next, you need to create a Dockerfile for your Next.js project. This file will be used to build a Docker image for your project, which you will later deploy to Cloud Run.

Create a new file called “Dockerfile” in the root directory of your Next.js project, and add the following contents:

FROM node:alpine AS build

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

FROM node:alpine AS runtime

WORKDIR /app

COPY --from=build /app/.next ./.next
COPY --from=build /app/public ./public
COPY package*.json ./

RUN npm install --only=production

EXPOSE 3000

CMD ["npm", "start"]

This Dockerfile uses a multi-stage build process to optimize the image size. It first builds the project inside a “build” stage, and then copies the production build into a “runtime” stage.

Step 4: Build and tag the Docker image

After creating the Dockerfile, you need to build and tag the Docker image. Run the following command to build the image:

docker build -t gcr.io/[PROJECT-ID]/my-app .

Replace [PROJECT-ID] with your Google Cloud project ID. This command builds the Docker image and tags it with the specified image name and version.

Step 5: Push the Docker image to Container Registry

Next, you need to push the Docker image to Container Registry, which is a private Docker image repository hosted by Google Cloud.

Run the following command to authenticate Docker to your Google Cloud account:

gcloud auth configure-docker

Then, push the Docker image to Container Registry by running the following command:

docker push gcr.io/[PROJECT-ID]/my-app

This command pushes the Docker image to Container Registry and makes it available for deployment to Cloud Run.

Replace [PROJECT-ID] with your Google Cloud project ID.

Now that the Docker image has been pushed to the Container Registry, you can deploy the application to Cloud Run. To do this, run the following command:

gcloud run deploy --image gcr.io/[PROJECT-ID]/my-app --platform managed --region [REGION] --allow-unauthenticated

Replace [PROJECT-ID] with your Google Cloud project ID and [REGION] with the region where you want to deploy your Cloud Run service.

The --allow-unauthenticated flag allows unauthenticated requests to access the service. You can remove this flag if you want to restrict access to the service.

After running the command, you will be prompted to enter a service name. Enter a name for your service, and then confirm that you want to deploy the container image.

The deployment process will take a few minutes. Once it’s complete, you will see a URL for your service. You can access your Next.js application by visiting this URL in your web browser.

That’s it! You have successfully deployed your Next.js application to Cloud Run and made it accessible on the internet.

--

--

Matías Salinas
Matías Salinas

No responses yet