James Bachini

How To Deploy A Website Or dApp To IPFS | Fleek Tutorial

Fleek IPFS Tutorial

Gm, in this tutorial we are going to be deploying a website to IPFS to create a decentralized frontend. To do this I’ll be using Fleek which has a free tier and which suits our needs.

James On YouTube

We will start by getting our site on Github. We can either build it locally or Fleek can run build scripts. My recommendation would be to build locally and put the build folder in the Github repository.

I’m going to be using a plain HTML/JS/CSS site which is currently hosted on Github Pages at https://EthereumHacker.com and the source code is at: Github Repo (note the website is in the docs/ directory).

Now if we go to https://fleek.co we can create a free account by connecting Metamask or Github.

Fleek IPFS Tutorial

Once connected we can click “Add New Site” and then choose which Github repository we want to pull code from.

Host Site On IPFS With Fleek

In the next step we can choose between deploying to IPFS (inter-planetary file system) or ICP (Internet Computer).

And then we have some build settings and options

Build Site With Fleek Tutorial

Because I’ve already built the files locally I just need to enter the base directory which is docs/ and click deploy site.

It’ll think about things for a few minutes and then give you a link to the IPFS site. Note that it will take 2-3 minutes for the IPFS network to migrate the site.

If you then go to “Hosting” on the left hand menu you’ll and select the build you just created.

IPFS Hosting

Then you should get a link to “Verify on IPFS” which will lead you to something like this:


You can then take the hash at the end of that URL and put it on other IPFS gateways such as: https://ipfs.io/ipfs/QmSu5SuFHFyVLtKTbTpsfwa7dk7iHVmJCsTAQ1hi4NRSQd/

There are additional options in the settings tab for linking an ENS name, migrating to Filecoin and blocking OFAC countries (which is a bit weird considering the point of decentralized backends is censorship resistance).

I hope you’ve enjoyed this tutorial and it’s inspired you to create your own decentralized applications. If you want to learn more about blockchain development, digital assets and emerging technology in decentralized finance then get the free newsletter at https://bachini.substack.com

Get The Blockchain Sector Newsletter, binge the YouTube channel and connect with me on Twitter

The Blockchain Sector newsletter goes out a few times a month when there is breaking news or interesting developments to discuss. All the content I produce is free, if you’d like to help please share this content on social media.

Thank you.

James Bachini

Disclaimer: Not a financial advisor, not financial advice. The content I create is to document my journey and for educational and entertainment purposes only. It is not under any circumstances investment advice. I am not an investment or trading professional and am learning myself while still making plenty of mistakes along the way. Any code published is experimental and not production ready to be used for financial transactions. Do your own research and do not play with funds you do not want to lose.