IPFS with React: Loading IPFS Assets from Your Distributed IPFS Gateways

How to access IPFS assets geographically and load them in React apps

Ross Bulat
12 min readDec 14, 2018

IPFS, a distributed filesystem, offers a more decentralised way of storing and delivering web assets. This article explores how to integrate IPFS with React by fetching content from an IPFS gateway and loading those assets into React. To make the experience streamlined, the assets will be lazy loaded and faded in. But before we do this, your IPFS gateway and hosting VPS needs to be configured correctly. We will cover how to do this.

If you have not explored IPFS but wish to deploy it in alongside your React apps, then read my introduction on IPFS before continuing this article:

The above article focuses on setting up IPFS nodes on your own VPS, and then configuring a gateway to serve IPFS hosted assets. It acts as a necessary fundamental introductory to IPFS; it will get your nodes set up quickly and efficiently.

--

--

Ross Bulat
Ross Bulat

Written by Ross Bulat

Programmer and Author. @ Parity Technologies, JKRB Investments