Truffle Next

screenshot of Truffle Next

Truffle Next

🛰️ A boilerplate Truffle Box project with Next.js for rapid Ethereum Dapp development


This article discusses a minimal smart contract development boilerplate that combines Truffle, a popular tool for developing Solidity smart contracts, with Next.js, a framework for building React frontends. The article highlights the integration between Truffle and Next.js and provides information on the features and installation process of the boilerplate.


  • Plain Truffle init project: The boilerplate utilizes a plain Truffle init project as the base, along with a SimpleStorage example contract.
  • Next.js project: A Next.js project is included in the client directory, with a symlink to the output folder of the contract ABI definitions. The Next.js app also provides a skeleton for connecting and interacting with the smart contract on a network.


To install the smart contract development boilerplate, follow these steps:

  1. Install Truffle globally.
  2. Download the boilerplate, which also installs the necessary dependencies.
  3. Run the development console.
  4. Compile and migrate the smart contracts. Note that inside the development console, commands are not prefaced with "truffle".
  5. Run the Next.js server for the front-end. Remember that any changes to the smart contracts must be manually recompiled and migrated.


The smart contract development boilerplate discussed in this article combines the ease of use of Truffle for Solidity smart contract development with the capabilities of Next.js for building React frontends. The integration between Truffle and Next.js simplifies the process of creating frontends for smart contracts and provides a foundation for connecting and interacting with smart contracts on a network. The installation process is straightforward and involves installing Truffle, downloading the boilerplate, and running the necessary commands.


Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.


React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components