This topic describes how to deploy a Next.js application to Function Compute. Function Compute provides a method different from traditional deployment methods. You can deploy a traditional Next.js application to Function Compute and use the application for production without performing steps such as purchasing a machine. Your Next.js application can use the auto-scaling, pay-as-you-go, and O&M-free features of Function Compute.

Background information

Next.js is a React framework with server-side rendering. The framework is integrated with webpack, Babel, and Express. You can build server-side rendered (SSR) React applications by using only Next.js, React, and ReactDOM, and do not need to be concerned about routing. Next.js is highly integrated, making it easy to implement code splitting, redirection, hot updates, server rendering, and frontend rendering.

Step 1: Prepare the environment

You do not need to install Docker but only Funcraft. The easiest way to install Funcraft is to download the executable binary files.

  1. Install Funcraft. For more information, see Install Funcraft.
  2. Run the fun --version command to check whether the installation is successful.
  3. Configure Funcraft. For more information, see Configure Funcraft.

Step 2: Migrate the application

  1. Run the following command to create a Next.js project. If you already have a Next.js project, skip this step.
    npm init next-app                    
  2. Run the following command to open the project:
    cd nextjs
  3. Run the following command to run the on-premises application:
    npm run dev           
    The following results are returned:pre-view
  4. Run the following command to compile the Next.js project:
    npm run build            
  5. Run the fun deploy -y command to deploy the application to Function Compute.

    Funcraft automatically begins to deploy the application.

    During deployment, perform the following operations as prompted:

    1. When Funcraft detects that the project is not created by it, Funcraft prompts you that it can create a project for you. Press the Enter key or enter Y.
    2. After Funcraft creates a project, it prompts you to deploy the project. Press the Enter key or enter Y.
      Funcraft deploys the application to Function Compute.deploy_success

      After the application is deployed, you can check the logs to find the temporary domain name that Function Compute generated. You can use this temporary domain name to access the deployed application.

      Note The temporary domain name is used only for demonstration and development purposes. It is valid for a limited period of time. To use an application in a production environment, you must bind the application to a domain name that has obtained an Internet Content Provider (ICP) filing from Alibaba Cloud. For more information, see Bind a custom domain name.