> ## Documentation Index
> Fetch the complete documentation index at: https://docs.tenderly.co/llms.txt
> Use this file to discover all available pages before exploring further.

# Act 4: CI

> Set up GitHub Actions for continuous integration with Virtual Environments.

<small>Estimated time: <b>10 min</b></small>

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

<Info>
  If you've skipped [Act 3](/guides/workshops/build-stage-deploy/act-3), you must do:

  * [Step 1](/guides/workshops/build-stage-deploy/act-3#configure-the-tenderly-package)
  * [Step 2](/guides/workshops/build-stage-deploy/act-3#populate-environment-variables)
</Info>

<Steps>
  ### Create a workflow file

  1. Create the file `.github/workflows/stage-dapp.yaml`
     your [Dapp Staging Github Action](https://docs.github.com/en/actions/quickstart)
  2. Copy the yaml below to the `stage-dapp.yaml`

  <details>
    <summary>Github Action config file (`.github/workflows/stage-dapp.yaml`)</summary>

    ```yaml title='.github/workflows/stage-dapp.yaml' showLineNumbers theme={"theme":{"light":"catppuccin-latte","dark":"catppuccin-mocha"}}
    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
    ```
  </details>

  ### Set up secrets

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

  * `TENDERLY_ACCOUNT_ID` and  `TENDERLY_PROJECT_ID` ([guide](/platform/account/projects/slug))
  * `TENDERLY_ACCESS_TOKEN` ([guide](/platform/account/projects/api-tokens)).

  ### Push

  Commit any changes you got and push to your fork:

  ```bash theme={"theme":{"light":"catppuccin-latte","dark":"catppuccin-mocha"}}
  git add .
  git commit -m "build"
  ```

  ### Observe

  * Go to "Actions" in your repo
  * Notice all newly created Virtual Environments
  * 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.
</Steps>
