Ganache: Create a dApp Hosted on IPFS

Learn how to create a dApp hosted on IPFS.

What is a dApp?

Decentralized applications, known as dApps, are open-source applications developed using cryptocurrency and smart contracts, then deployed on a blockchain network.

Read below to learn how to create a dApp hosted on IPFS.

circle-check

Prerequisites:

1. First, we need a Filebase IPFS bucket.

To do this, navigate to console.filebase.comarrow-up-right. If you don’t have an account already, sign uparrow-up-right, then log in.

2. Select ‘Buckets’ from the left side bar menu, or navigate to console.filebase.com/bucketsarrow-up-right.

Select ‘Create Bucket’ in the top right corner to create a new bucket.

3. Enter a bucket name and choose the IPFS storage network to create the bucket.

circle-exclamation

4. Next, download and installarrow-up-right S3FS-FUSE on a Linux or macOS system.

5. Set up an Access Key file for use with S3FS-FUSE.

Set up a credentials file for S3FS at ${HOME}/.passwd-s3fs. You will need to save your Filebase Access and Secret keys to this file and give it owner permissions. You can do so with the following commands:

echo ACCESS_KEY_ID:SECRET_ACCESS_KEY > ${HOME}/.passwd-s3fs

chmod 600 ${HOME}/.passwd-s3fs

ACCESS_KEY_ID is your Filebase Access key, and SECRET_ACCESS_KEY is your Filebase Secret key. For more information on Filebase access keys, see herearrow-up-right.

6. Mount your bucket.

You can mount a Filebase IPFS bucket with the command:

s3fs mybucket /path/to/mountpoint -o passwd_file=${HOME}/.passwd-s3fs -o url=https://s3.filebase.com

  • mybucket: name of your Filebase bucket

  • /path/to/mountpoint

7. Now, navigate into the mounted Filebase bucket.

cd /path/to/mounted/bucket

8. Next, git clone the quick dApp template:

git clone https://github.com/MatthieuScarset/quick-dapp.git

9. Navigate into the newly cloned directory:

cd quick-dapp

10. Start the dApp with the command:

yarn start

11. Once started, a browser window will open at localhost:3000. You’ll be prompted to authorize the connection to your cryptowallet:

After authorizing your wallet, you will see the following default dApp screen:

13. To use the dApp, retrieve the Ganache wallet address from the ganache.json file:

Note: Do not use this app in a production environment!

cat ganache.json

{"addresses":{"0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1":"0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1"},"private_keys":{"0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1":"0x4f3edf983ac636a65a842ce7c78d9aa706d3b113bce9c46f30d7d21715b23b1d"}}

14. Open your wallet provider and select ‘Import Account’:

15. Then select ‘JSON File’ and choose the ganache.json file from the quick-dapp directory.

16. Next, you can customize the backend of the app by creating custom smart contracts in the /contracts folder.

To test your smart contracts, use the yarn test command.

Then, to redeploy your dapp with your new smart contracts, use yarn migrate, yarn stop && yarn start.

Last updated

Was this helpful?