Google Cast demo

Google Cast is pretty cool. Especially Chromecast, of course. You can cast pretty much any media on this super cheap device. But even better, you can build your own apps that run on the Chromecast.

To build an app, you need to create:

Also, to test all of this in development, you need to register your device for development (super easy!).


🔥 See it in action 🔥


A study in dragging and dropping in the browser.

🔥 See it in action 🔥

Edge-rendered components

Wouldn’t it be awesome if you could just insert some dynamic elements on an otherwise static page? So you could just update the logged-in user’s name or add a country-specific discount when needed? Why yes, yes it would.

Just somehow render the needed HTML structure:

<edge-component title="My page" src="Country">
  <p>Not really sure where you're from...</p>

Note that this (static) HTML is what users will see if no edge-rendering is done. It should work on its own - that way the edge rendering can be a “progressive enhancement” that should update a page but doesn’t have to update a page.

Then, create your actual component:

export const Country = (props, ctx) => (
    <p>Hello, user from {ctx.country}</p>

This component is then compiled and sent to a Cloudflare Worker that acts as a proxy for your static content. It will receive the attributes of the element in the props object, and the request context in the ctx object, and update this part of the page in real-time.

🔥 See it in action 🔥

Simple text editor

This is a test of the Filesystem API. It’s a very simple text editor. Use at your own risk… 😏

The Filesystem API is freaking amazing. With it you can magically open local files and also save them back! The API is in “Origin trial” from Chrome 78 onwards, and available as a flag in previous versions.

The API is pretty damn cool, if you ask me. This is a quite nice looking text editor with a contenteditable pre tag, and the code is not many lines long. Soon the days of native desktop apps are over! 😝

Technologies used

See more

Google developers post

🔥 See it in action 🔥


See your Google calendar events for today.

Working domain


Note: You need to authorize the OAuth client for a particular URL. This URL needs to be on a whitelisted domain, which in turn needs to be a private top-level domain.

This project also showcases using Google Sign-In to request for additional permissions on demand (incremental authorization). Note that it’s apparently not possible to bypass the account selection when doing this.

The Calendar API is restricted and requires validation by Google before usage. It still works without validation, but shows a very scary warning.

Quick start docs

🔥 See it in action 🔥

PWA Weather App

An installable PWA that shows todays weather compared to yesterday.

🔥 See it in action 🔥