This box comes with everything you need to build upgradable-proxy contracts. We also have a simple react-app shipped along with it that you can use to see how you can update a contract without losing any data.
First ensure that you are in an empty repository.
- Create a new directory and unbox the box using
unbox
command using truffle
mkdir proxyBox
cd proxyBox
truffle unbox pranav-singhal/upgradable-proxy-box
- Install the box dependencies
yarn install
- Run the development console
truffle dev
OR
truffle develop
- In the console now open run the
compile
andmigrate
compile // compile the contracts
migrate // migrate the contracts
This will compile and migrate your contracts. It will also create the ABIs and put them inside the app
folder
- Go into your
app
folder andyarn install
the react app
cd app
yarn install
- In the same folder,
yarn start
the react app
yarn start
The box has three parts
- Contracts
There are 4 Primary Contracts
- TokenStorage.sol - The contract that stores all the storage variables, their getter and setter functions. All storage variables must be defined inside this contract
- TokenProxy.sol - This contract acts as the face of entire Dapp, all the calls from the client (web3) are made to this contract and this contract delagates request to the implementation contract.
- Token_V0.sol - The first version of the implementation contract
- Token_V1.sol - The second version of the implementation contract
For Providing upgradeable nature to the Dapp, we write deploy 3 different contracts instead of just one. These contracts work hand in hand as shown in the flow chart below. ###Flow Chart
The basic idea is to separate the storage from the business logic. Hence the Storage( TokenStorage.sol ) (which includes, mappings and all the state variables) is deployed in a separate contract
with all the getters and setters.
The Implementation Contract( Token_V0.sol & Token_V1.sol ) makes use of the storage contract for all of it's state variables.
The Proxy Contract( Token Proxy.sol ) acts as the face of all the contracts. This contract delegates call to the implementation contract which then uses Storage Contract.
Now, everytime we need to upgrade our implementation logic, we just need to deploy a new Implementation Contract, and then call the upgradeTo
function on Proxy Contract so that it starts delegating its call to the
latest implementation contract. And hence, the storage is preserved and the calls from the browser are still made to the same Proxy Contract.
You can read more about how these contracts work here
- Web3
the
Web3
folder inside the app directory gives you code for how to use the web3.js library to write Dapp code that can be used between different versions of your dapp.
- React App
using the contracts and the web3 code, we have built a sample dapp that provides a dynamic interface that changes with different versions of the Dapp.
Also checkout this box that we've previously built to see how to use express with your Dapp