Need help with truffle-next?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

adrianmcli
138 Stars 29 Forks 76 Commits 1 Opened issues

Description

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

Services available

!
?

Need anything else?

Contributors list

# 29,597
truffle...
nextjs
solidit...
reasonm...
52 commits
# 363,005
nat-tra...
truffle...
nextjs
Nim
3 commits
# 497,678
ethereu...
truffle...
truffle
JavaScr...
3 commits
# 157,534
Shell
truffle...
nextjs
solidit...
1 commit
# 290,128
Python
ethereu...
truffle...
nextjs
1 commit
# 87,713
solidit...
Webpack
truffle
ethereu...
1 commit

Truffle and Next.js


comet

Rapid Ethereum Dapp Development

made for ethereum to the moon MIT license


A Minimal Smart Contract Development Boilerplate

Truffle is great for developing Solidity smart contracts, but building a React frontend for a smart contract is often a chore. Next.js is one of the easiest ways to build such a frontend and the integration between Truffle and Next.js is what this boilerplate is trying to demonstrate.

There are two major features:

  • A plain

    truffle init
    project is used as the base (along with a SimpleStorage example contract).
  • A Next.js project resides in the

    client
    directory with a symlink to the output folder of the contract ABI definitions. The Next.js app also provides a simple skeleton for connecting to and interacting with the smart contract on a network.

For more information on how the frontend works, go read the README.md located in the

client
directory.

Installation

  1. Install Truffle globally.

    bash
    npm install -g truffle
    
  2. Download the box. This also takes care of installing the necessary dependencies.

    bash
    truffle unbox adrianmcli/truffle-next
    
  3. Run the development console.

    bash
    truffle develop
    
  4. Compile and migrate the smart contracts. Note inside the development console we don't preface commands with

    truffle
    .
    bash
    compile
    migrate
    
  5. Run the next.js server for the front-end. Smart contract changes must be manually recompiled and migrated.

    bash
    // Change directory to the front-end folder
    cd client
    // Serves the front-end on http://localhost:3000
    npm run dev
    
  6. Truffle can run tests written in Solidity or JavaScript against your smart contracts. Note the command varies slightly if you're in or outside of the development console. ```bash // If inside the development console. test

    // If outside the development console.. truffle test ```

Running with MetaMask

Since

truffle develop
exposes the blockchain onto port
9545
, you'll need to add a Custom RPC network of
http://localhost:9545
in your MetaMask to make it work.

Running with TestRPC

We highly recommend using

truffle develop
over
testrpc
, but if you want to use
testrpc
, there are a couple things you need to do:
  • Change Line 6 of
    client/lib/getWeb3.js
    to use
    localhost:8545
    instead of
    localhost:9545
    so we refer to
    testrpc
    instead of
    truffle develop
    .
  • Run your
    testrpc
    with the following command (because reasons):
   testrpc --gasLimit 6721975 --gasPrice 100000000000

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.