This is a demo project that uses CNB to automatically package a Next.js application and push it to the artifact repository.

This project uses the App Router. Please refer to Next.js official documentation: Project Structure

• Copy the push stage configuration from cnb.yml to your project's CNB configuration
• Copy the Dockerfile to your project root directory and modify the configuration
• Set output to standalone in your project's next.config.ts
• Push code to CNB for automatic building

Pull the CNB image to your local machine. You'll need to authenticate using your access token to log in to the CNB artifact repository.

docker login -u cnb docker.cnb.cool
# Enter your access token when prompted
docker pull docker.cnb.cool/xxxxx/xxxxxx:latest
# Run the container
docker run -p 9000:9000 docker.cnb.cool/xxxxx/xxxxxx:latest

Access http://localhost:9000 to view the application.

push:
- services:
   - docker
  stages:
     # Build and push image with same name
   - name: docker build
          script: docker build -t ${CNB_DOCKER_REGISTRY}/${CNB_REPO_SLUG_LOWERCASE}:latest .
   - name: docker push
          script: docker push ${CNB_DOCKER_REGISTRY}/${CNB_REPO_SLUG_LOWERCASE}:latest

This configuration enables automatic image building and pushing when using git push to CNB. The build configuration is specified in Dockerfile.

Please check the Dockerfile directly.

We use the official multi-stage build configuration. You can customize the listening port at the end of the file.

# Listening port (must be EXPOSED)
ENV PORT=9000
EXPOSE 9000

To reduce image size, we need to build in standalone mode.

import type { NextConfig } from "next";
const nextConfig: NextConfig = {
  /* config options here */
  /**⚠️Important: Set to standalone to prevent large file size in Docker builds*/
  output: 'standalone',
};
export default nextConfig;