I've created the following app in order to get familiar with Solidity, truffle, web3, and IPFS. It's a simple drive app where files are saved in IPFS and the ethereum smart contract links the files with an account.
The frontend displays the dropzone and the list of the files linked to each ethereum wallet. Dropping a file into the dropzone saves it in IPFS distributed storage. After that the hash, the filename, the timestamp, etc. are saved in ethereum storage smart contract which links the files with an account. On change of the account in Metamask, the frontend reloads, access the storage smart contracts and render a list of the files. On click on the file, the user is redirected to the IPFS directory with the file.
The frontend is an easy react project.
- Clone the repo
- Install truffle
- Install Ganache local blockchain for Ethereum
- Start Ganache Ethereum server. It should run on localport on port 7545
- Compile smart contracts
truffle compile
- Deploy the smartcontract into the local blockchain -
truffle migrate
- Go to client directory -
cd client
- instal packages -
npm install
- start server -
npm start
Drop the file to the dropzone.
Metamask window will appear to confirm the blockchian transaction of storing the file info in blockchian. In paralel the file is stored in IPFS.
To access the file stored in IPFS just press it and you will be redirected.