How to Deploy a Next.js 13 Website on Google Cloud Run and Expose it to the Internet in 5 minutes
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.