Dweb: Serving the Web from the Browser along with Beaker

In this series we are addressing projects that explore what is probable when the web becomes decentralized or even distributed. These projects aren’ to affiliated with Mozilla, and some of them edit the rules of how we think about an internet browser. What they have in common: These tasks are open source, and open up for participation, and share Mozilla’ ersus mission to keep the web open plus accessible for all.

So far we’ ve covered distributed social rss feeds and sharing files in a decentralized way with some brand new tools for developers. Today we’ d like to introduce something a little different: Imagine what an entire browser experience would be like if the internet was distributed… Beaker browser will exactly this! Beaker is a large vision from a team who are showing out the distributed web throughout. Please enjoy this post from Beaker co-creator Tara Vancil. – Universalschl├╝ssel Ayala

Blue Link Labs and Beaker

We’ re Blue Link Labs , a team of 3 working to improve the Web with the Dat protocol and an experimental peer-to-peer browser called Beaker .

Blue Link Labs team

We work on Beaker because publishing and sharing is usually core to the Web’ s cast, yet to publish your own website as well as just share a document, you should know how to run a server, or have the ability to pay someone to do it for you.

So we asked ourselves, “ What if you could share a website straight from your browser? ”

Peer-to-peer protocols like dat: // allow regular user devices to web host content, so we use dat: // within Beaker to enable publishing from the internet browser, where instead of using a server, the website’ s author and its guests help host its files. It’ s kind of like BitTorrent, but for sites!


Beaker uses a distributed peer-to-peer system to publish websites and datasets (sometimes we call them “ dats” ).

dat: // websites are usually addressed with a public key because the URL, and each piece of
information added to a dat: // website will be appended to a signed log. People to a dat: //
website find one another with a tracker or DHT , then synchronize the data between each other, acting each as downloaders and uploaders, plus checking that the data hasn’ big t been tampered with in transportation.

a basic illustration from the < code> dat: //< /code> network” width=” 394″ height=” 252″ class=” alignnone size-full wp-image-32540″ /> < /a> < /p> < p> At its core, the < code> dat: //< /code> website isn’ t much different compared to an https:// website — it’ s a collection of files and files that a browser interprets according to Internet standards. But < code> dat: //< /code> websites are specific in Beaker because we’ ve added < a href= peer-to-peer Web APIs therefore developers can do things like read, compose, and watch dat: // files and develop peer-to-peer Web apps.

Create a P2P Website

Beaker makes it easy for anyone to create a brand new dat: // website with one click on (see our tour ). In case you’ re familiar with HTML, CSS, or JavaScript (even just a little bit! ) then you’ re prepared to publish your first dat: // website.

Developers can get started simply by checking out our API documentation or reading through our guides .

This example shows a web site editing itself to create and save a brand new JSON file. While this example is usually contrived, it demonstrates a common design for storing data, user single profiles, etc . in a dat: // website— rather than application data being sent aside to a server, it can be stored in the web site itself!

 // index. html

Submit information

< script src="index. js"> < /script>

 // index. js

// first get an instance of the home page's files
var files = brand new DatArchive(window. location)

document. getElementById('create-json-button'). addEventListener('click', saveMessage)

async function saveMessage () 
var timestamp = Date.now()
var filename = timestamp + '.json'
var content = 
message: document.getElementById('message').value

// write the message to a JSON file
// this file can be read later using the DatArchive.readFile API
await files.writeFile(filename, JSON.stringify(content))


Find out more

We’ re at all times excited to see what people build along with dat: // and Beaker. We specifically love seeing when someone creates a personal site or blog, or even when they experiment with Beaker’ s APIs to build an app.

There’ s lots to explore around the peer-to-peer Web!

Tara could be the co-creator of the Beaker browser . Previously the lady worked at Cloudflare and took part in the Recurse Center .

More articles by Tara Vancil…

If you liked Dweb: Serving the Web from the Browser along with Beaker by Tara Vancil Then you'll love Web Design Agency Miami

Add a Comment

Your email address will not be published. Required fields are marked *