Getting Started

Integrating Gnosis Safe Proxy Kit with the frontend (Compound App Example) App can be found live here: https://gnosis.github.io/cpk-compound-tutorial/

Introduction

This tutorial will teach you how you can use Gnosis Safe Contract Proxy Kit to perform batched transactions and interact with smart contracts. This tutorial is meant for those with a basic knowledge of Ethereum and Solidity. Furthermore, you should have some basic knowledge of JavaScript.

In this tutorial we will cover:

• How to install and initialize CPK
• How to interact with the CPK JavaScript library
• How to perform a transaction
• How to interact with a smart contract
• How to use batched transactions

Web3/Ethers.js

Gnosis Safe Proxy Kit is a smart contract on the Ethereum blockchain. There are two popular libraries for interacting with the blockchain: web3.js and ethers.js. Your users will need a wallet that supports web3, in this tutorial we will use web3connect library which provides integrations with the majority of popular wallets.

Background information

Our example project will be a React application bootstrapped with create-react-app. We are also going to use TypeScript as our language. For more information on those projects, visit their websites. We assume you are familiar with those technologies as our tutorial will only cover things you need to integrate the Gnosis Safe Contract Proxy kit and not, for example, how to set up a React project.

Useful links

• Contract Proxy Kit documentation
• Video introduction to Building with Safe Apps SDK & Contract Proxy Kit
• Source code for the example app: Compound integration app
• Source code for the example app: CPK configuration app
• Web3.js docs

Installing contract-proxy-kit

To install the CPK, run following command in the root directory of your project:

If you are using yarn:

yarn add contract-proxy-kit

Or if npm

npm i contract-proxy-kit