Host static website with IPFS

Step 1: InterPlanetary File System (IPFS) is a protocol and network designed to create a content-addressable, peer-to-peer method of storing and sharing hypermedia in a distributed file system. It's a great way to host static websites in a decentralized way. Here's a step-by-step guide on how to do it:

Step 2: IPFS is already installed on your setup so we can skip installation. You can check the IPFS version by running this command on a terminal.

Step 3: You need to initialize IPFS. Open a terminal and run the command. This will create a new IPFS repository in your home directory and output your new node's peer identity.

Step 4: This will start the IPFS daemon (in background) which allows your node to connect to the IPFS network.

Step 5: Let's check all connected peers.

Step 6: IPFS stores content on the network and locate it using CID (Content Identifiers). A CID can be compared to a URL. However, unlike a URL which points to the server's location, a CID represents the actual content, independent of its location.

Step 7: Let's add some dummy content (in this case a string 'IPFS Test 1') to IPFS and store CID in a variable.

Step 8: Print the CID value stored in the variable.

Step 9: View the content corresponding to a CID.

Step 10: Now, let's store a static HTML page on IPFS.

Step 11: Open VS Code, create a new file index.html and paste the provided HTML code to it. It is a very simple static HTML website.

Step 12: Add the webpage to IPFS. This will store the webpage on IPFS and issue a CID.

Step 12: Save the cid obtained in previous step in CID variable. This way, we won't have to copy-paste it repeatedly.

Step 13: Publish the single page website to IPFS.

Step 14: The page is now available to access. Use curl to access the page on localhost.

Step 15: We learned how to host a file or website page on IPFS.