Skip to main content

Environment

Now that your installation is complete, let's configure the development environment for Scaffold Stylus.

1. Initialize a Local Blockchainโ€‹

In the first terminal, start a local Stylus-compatible network:

yarn chain

This command starts a local Arbitrum network using the Nitro dev node. The network runs on your local machine and can be used for testing and development. You can customize the Nitro dev node configuration in packages/stylus/nitro-devnode.

2. Deploy Your Smart Contractโ€‹

In the second terminal, deploy the test contract:

yarn deploy

This command deploys a test smart contract to the local network. The contract can be modified to suit your needs and can be found in packages/stylus/your-contract/src. The deployment script is located in packages/stylus/scripts/deploy.ts.

3. Launch Your NextJS Applicationโ€‹

In the third terminal, start your NextJS app:

yarn start

Visit your app at: http://localhost:3000. You can interact with your smart contract using the Debug Contracts page or the example UI in the frontend.

What's Nextโ€‹

  • Edit your smart contract in packages/stylus/your-contract/src
  • Edit your deployment scripts in packages/stylus/scripts/deploy.ts
  • Edit your frontend homepage at packages/nextjs/app/page.tsx. For guidance on routing and configuring pages/layouts, check out the Next.js documentation.
  • Edit the app config in packages/nextjs/scaffold.config.ts
  • Edit your smart contract test and run tests with yarn stylus:test. Check test documentation for more guidances.