Blockstack is building an ecosystem that gives your users control over their fundamental digital rights: Identity, data-ownership, privacy, and security. Join us and help build the new internet.
This week, Stephen tasked us with creating a Content-Addressed Resource on the distributed web or Dweb.
Create a resource (for example, a web page) using IPFS, Beaker Browser, Fritter, or any other distributed web application (see some of the examples here). Provide a link to the resource using any method you wish.Source
To help prepare for this task, watch the video ‘From Repositories to the Distributed Web‘ as well as these videos on IPFS and Beaker: installing IPFS, making a website with IPFS, installing Beaker.
The final results
- Click to view my IPFS site.
- Click to view my .dat site using Beaker browser (or another .dat enabled browser). I probably need to consider hosting it on hashbase.io in order to keep it available when I’m not online.
Dweb – The letter D in the popular shortened version stands for either decentralised or distributed. Here’s a visual depiction:
The conceptual framework behind the creation of a decentralised or distributed internet is an attempt to replace, improve upon, or at least run parrallel to, the current centralised web (based on the web 2.0 premise). A feature of this current web is siloed platform specific engagement.
In part, this shift in thinking has transpired as a strong reaction to the centralisation of control and power in the hands of a few giant internet and tech companies. A decentralised, distributed web would, in theory, more evenly spread the balance of power, control, etc. across a network of much more people, in the hope of removing the reliance on using web 2.0 platforms to communicate with one another, thus diluting their influence.
Further, the dweb has been brought about by the need to create an immutable way to preserve the largest open and accessible collection of human knowledge ever created.
Here’s how I did it
Following Stephen’s video’s (linked to above) was very straightforward. They are very clear and thorough. The only real hurdle I had to overcome was that I was performing the operation on my Mac laptop rather than on a Windows device. All in all, performing the operations was much the same.
Downloading and extracting IPFS
The first task I set about was downloading and installing the go-ipfs distribution implementation of the Inter-Planetary File System (IPFS).
I unzipped/extracted the go-ipfs download into my home directory (davidmoloney$ in my case). It isn’t as easy as double-clicking on the .exe file in the directory and following an installation wizard I’m afraid! You are the installation wizard!
I opened up the terminal application on my Mac to begin the process of installation. First things first, I changed directory into the new go-ipfs one which, if you remember, I had saved to my home directory.
In Stephen’s video, in order to list the subdirectories within the go-ipfs directory on his Windows device, he types:
into the Microsoft Powershell. On the Mac terminal the equivalent command is
You could also type
if you were looking for some further detail.
It’s the “ipfs” file listed on the right hand side of the “ls” screenshot above that I am initially interested in. I want to initialise this file in order to establish my IPFS node. To do this this I type
Initialising the ipfs file generates a hashed peer identity for my IPFS node on the distributed web. It also creates a link for me to progress to the next step and open the Readme file.
I copied the hashed value that had been generated in the terminal (by highlighting it and using Command+C) in order to open the Readme file, also ensuring to copy the
code that comes immediately before the hashed string. Stephen notes the importance of this in his video. Without the “cat” prefix piece the command will not run properly.
I typed and pasted the following command into the terminal to open the Readme file. You will replace the *ABCD* section in the code below with the hashed public key that is generated for you (although I think it’ll probably be the same anyway – ending in “Vv”).
../go-ipfs/ipfs cat /ipfs/*ABCD*/readme
The Readme.md file should open for you within the terminal.
Starting the daemon service
Once initialised it is important to get the IPFS service up and running by starting the daemon service
I love how Stephen pronounces daemon in his video – demon! Very Irish!
The IPFS Companion Add-on for Firefox
Ordinarily, it seems that by then browsing to the web address produced after running the daemon service (http://127.0.0.1/tcp/8080) I should be able to access IPFS via my browser. However, without the IPFS Companion add-on, I couldn’t get to that point using Firefox.
Once the IPFS Companion add-on is installed you can click the small icon in the browser bar and then select the Open Web UI option to view a dashboard interface.
Creating and hosting my simple website on IPFS
I followed Stephen’s guidance in his video and used Gio d’Amelio’s quick tutorial to get my simple website set up and hosted on IPFS.
Using the Sublime Text 3 text editor for code, I copied and pasted the sample text provided in the quick tutorial and created basic index.html and style.css files. I saved the files in a subdirectory that I similarly named “ipfssite”, following Stephen’s lead.
Adding my site to IPFS using the terminal
I opened a new terminal window and changed directory into the go-ipfs directory within my home directory again
From here, I ran the following command to add the .html and .css files within my ipfssite subdirectory to my IPFS node.
./ipfs add -r ipfssite
Doing this produces hashed values for all of the files and also the entire site. The very last hash value before the command completes is the hash value to use to browse to your IPFS site.
Finally, I decided to install the beaker browser and establish a new .dat website also. This post is already a little unwieldy so I won’t detail how that went, but it was all pretty straight forward. Ultimately, I simply followed along with Stephen’s video instruction which was excellent.