🤔 Got questions? Schedule an office hours session.
Workshops
Build, Stage, Deploy
Act 4: CI

Act 4: CI

Estimated time: 10 min

In this act, you’ll get your build in Github Actions.

đź’ˇ

If you’ve skipped Act 3, you must do:

Create a workflow file

  1. Create the file .github/workflows/stage-dapp.yaml your Dapp Staging Github Action
  2. Copy the yaml below to the stage-dapp.yaml
Github Action config file (.github/workflows/stage-dapp.yaml)
name: Stage Dapp
 
env:
  TENDERLY_ACCOUNT_ID: ${{ secrets.TENDERLY_ACCOUNT_ID }}
  TENDERLY_PROJECT_ID: ${{ secrets.TENDERLY_PROJECT_ID }}
  TENDERLY_ACCESS_TOKEN: ${{ secrets.TENDERLY_ACCESS_TOKEN }}
on:
  pull_request:
    branches:
      - main
  push:
    branches:
      - tenderly/dapp-staging
jobs:
  ci:
    runs-on: ${{ matrix.os }}
 
    strategy:
      matrix:
        os: [ ubuntu-latest ]
        node: [ lts/* ]
 
    steps:
      - uses: actions/setup-node@v2
        with:
          node-version: ${{ matrix.node }}
      - uses: actions/cache@v2
        with:
          path: '**/node_modules'
          key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
 
      - name: Install Yarn
        run: npm install -g yarn
 
      - name: Install Tenderly CLI
        run: curl https://raw.githubusercontent.com/Tenderly/tenderly-cli/master/scripts/install-linux.sh | sudo sh
 
      - name: Authenticate Tenderly CLI
        run: tenderly login --access-key ${{ secrets.TENDERLY_ACCESS_TOKEN }} --authentication-method access-key
 
      - name: Install
        run: yarn install
 
      - name: Checkout
        uses: actions/checkout@master
 
      - name: Setup node env
        uses: actions/setup-node@v3
        with:
          node-version: ${{ matrix.node }}
          cache: yarn
 
      - name: Install dependencies
        run: yarn install --immutable
 
      # New chains
      - name: Create an environment
        run: |
          npm run stage:new now 1 34443 8453
          source .environment
          npm run stage:activate $ENVIRONMENT_NAME
        working-directory: packages/tenderly
 
      # Hardhat
      - name: Hardhat Deploy
        run: |
          source .environment
          npm run stage:connect:hardhat $ENVIRONMENT_NAME
          cd ../hardhat
          rm -rf deployments
          npx hardhat deploy --network virtual_mainnet
          npx hardhat deploy --network virtual_base
          npx hardhat deploy --network virtual_mode
        working-directory: packages/tenderly
 
      # Next.js
      - name: Frontend Deploy
        run: |
          source .environment
          npm run stage:connect:nextjs $ENVIRONMENT_NAME
          echo "Insert vercel deploy here"
        working-directory: packages/tenderly
 
      # TheGraph
      - name: TheGraph Deploy
        run: |
          source .environment
          npm run stage:connect:thegraph $ENVIRONMENT_NAME
          echo "TODO: Build TheGraph files"
          echo "Build the Graph and deploy a node with custom RPC"
        working-directory: packages/tenderly

Set up secrets

In your github action, set up Secrets with the following environment variables:

  • TENDERLY_ACCOUNT_ID and TENDERLY_PROJECT_ID (guide)
  • TENDERLY_ACCESS_TOKEN (guide).

Push

Commit any changes you got and push to your fork:

git add .
git commit -m "build"

Observe

  • Go to “Actions” in your repo
  • Notice all newly created testnets
  • Check your virtual_mainnet for contract deployments

Homework

We didn’t want to favor one hosting provider over another, so we let you integrate your favorite one for

  • Next.js hosting
  • TheGraph Node hosting. You need to host your own Node because we’re using a custom RPC.