Deploy your NextJs dApp in 60 sec

4 min readDec 9, 2022

With Spheron Network, you can deploy your NextJs Application to a decentralized storage network in just 6o seconds.

Spheron protocol: The future of Decentralised Web hosting

Spheron Network, the next-gen leader in the web3 space, provides a developer marketplace where users can leverage the benefits of Spheron’s ecosystem and strategic partners to decentralize or permanently host their front end. To unleash the power of decentralized Infra, Spheron builds and scales Web hosting and compute layer abstraction for Web2 and Web3 biz.

Spheron’s Explainatory video << Link >>

Let’s delve into seeing the step-by-step process of Deploying a Next.js site with Spheron..

Step 1: Add the code of your Next.js project to a Git repository

The marvel of Spheron is that every push to any branch in your GitHub, GitLab, or Bitbucket repo causes a new build and deployment of your project.

Step 2: Update Your Next.js Project for Deployment on Decentralized Storage

Spheron Protocol suggests the below-mentioned preferred configuration to be made to your next.js source code. The user may encounter errors if they fail to include this.

Add the below-mentioned configuration to your next.config.js file

module.exports = {
…,
images: {
loader: ‘akamai’,
path: ‘’,
},
trailingSlash: true,
}

When you see the Error: Image Optimization using Next.js’ default loader is incompatible with ‘next export.’ while deploying your app using Spheron use the below-mentioned snippet in your file

{
“loader”: “akamai”,
“path”: “”
}

In IPFS, the trailingSlash: true will resolve the routing refresh problem.
Otoh, you must alter the next.config.js file with the following configuration if you see images that are not present in your other routes

const isProd = process.env.NODE_ENV === “production”;
module.exports = {
…,
assetPrefix: isProd ? “https://your-domain.com" : “”,
}

Step 3: Deploy your next.js app using the Spheron Platform UI

Visit Spheron Protocol, and utilize the platform UI to establish a new Spheron project.

Select your preferred Git provider- GitHub, GitLab, or Bitbucket, then grant Spheron access to the repository you wish to deploy to.

Select your Next.js app from the list in your Spheron organization.

Choose the protocol you like to use for the deployment of your static build. Presently, the Spheron protocol supports IPFS, Filecoin, Pinata, Arweave, and Skynet.

Note: Switch to the Pro plan to leverage the benefits of deploying to Arweave. Filecoin and Pinata can be accessed in the starter pack.

We are almost there! The third step is all about where to create the project and how to build it. On the basis of the indicated framework, all the parameters have already been pre-filled.

Build Settings:

If your app structure resembles that of a monorepo, select the branch to deploy from the dropdown and enter the root directory.
Make yarn install as the install command.
Specify the next build && next export on the build command line.
Put out in the publish directory
Before the build, you can add a few environment variables.
You can also modify the deployment’s node engine.
Select Deploy.

Once your Next.js project has been deployed on Spheron, you can leverage the power of all its features as well as Next.js’s features like Preview Mode and Static site rendering. Spheron features include a custom deployment environment, continuous deployment whenever you push to your repository, and much more.

After deployment, a.spheron.app suffixed domain will be immediately allocated to your new Next.js project.

Note: The Custom Domain of your choice can be added.

What makes Spheron Unique?

In terms of facilitating the adoption of Web3, Spheron protocol, the industry giant in offering decentralized hosting solutions, enables devs to choose among Spheron’s ecosystem and strategic partners to utilize their infrastructures quickly and effectively. The underlying ethos is to reduce the learning curve and leverage the power of web3 infra. Spheron’s Alpha release has harnessed the compute integration by the Akash network, where users can deploy their instance to spheron in just two simple steps.

Subscribe to Spheron’s Newsletter: https://bit.ly/3TypIuU

Check our Spheron AQUA

Deploy your NextJs dApp in 60 sec

Let’s delve into seeing the step-by-step process of Deploying a Next.js site with Spheron..

Written by Spheron Network