June 13, 2018

I built a little blockchain-in-a-browser in ClojureScript to help understand the underlying algorithms.

You can simulate a network of peers by opening multiple browser tabs. Each peer can mine blocks and make transactions independently and the resulting blockchain will resolve conflicts correctly across all tabs.

A blockchain works by laying down a chain of blocks of transaction data.

Bitcoin whitepaper SPV

Each block in the chain contains a cryptographic hash with two important properties:

  • It proves a link to the previous block.
  • It proves that difficult computational work has been done.

The proof-of-work is accomplished by iteratively updating a nonce until a low-probability hash is discovered.

These two properties mean a blockchain is digital amber.

Insect embedded in amber

If somebody wants to modify a transaction deep inside the amber it would be very difficult because they would have to re-create every layer of the blockchain by doing as much work as the original process required.

In my browser blockchain the hashing is implemented like this:

(hash-object [timestamp transactions previous-hash nonce])

As you can see the previous block's hash is included in the current block.

The hashing is performed iteratively in a loop until a hash with at least one byte of leading zeroes is found:

(loop [c 0]
  (let [candidate-block (make-block (now) transactions previous-hash new-index (make-nonce))]
    (if (not= (aget (candidate-block :hash) 0) 0)
      (recur (inc c))
      candidate-block)))

Oct. 11, 2017

A non-exhaustive list of technologies that I used this year which happen to be built by women:

I feel grateful to these people for enriching technology with their contributions.

Sept. 11, 2016

I built these sci fi user interfaces using ClojureScript, React, and SVG:

Tap or click to interact with them.

 

 

 

 

 

More here.

Source code here.

May 28, 2016

My wife and I needed a collaborative shopping list that we could update from our phones. There are proprietary solutions to this but after some research I was surprised to discover that there is no Free Software application that meets the following criteria:

  • Web based.
  • Easy to deploy.
  • Self-hosted & FLOSS.
  • Allows multiple people to update a list.
  • Simple text based format for easy editing.
  • Mobile friendly - "Add to Home Screen" webapp.
  • Satisfies the single use-case of collaborative TODO editing.

Of course I built one with ClojureScript.

Screenshot of 
OMGNATA

We've been using this "in production" for 3 months and so far it fills our need without issue.

  • Authentication can be accomplished with a .htaccess file or similar.
  • The text-file format is designed so that you can edit lists with a text-editor directly if you want to.
  • If you want to support multiple users you can set up two instances in two different folders and symlink the textfile of the list you want to share between them. Each folder can have its own authentication.
  • You can also do other textfile things like make a symlink into a Syncthing folder which enables you to modify your TODO lists on your laptop or server as well as through the web app.

The realtime updating is accomplished via long-polling. Primarily I used this instead of websockets because when it comes to browsers, older tech is more robust to different operating environments than newer tech.

I resorted to using PHP for a very lightweight server backend because it has the property that basically anybody with web hosting is able to upload a PHP script and I think it's good to give software as egalitarian a deployment surface as possible. Luckily it is only 150 lines of not-too-painful PHP.

Click here to get the source and download/install it.

Dec. 11, 2015

Zero Asset Game Mockup

A "zero asset game" is a game that does not use any external art assets.

Game art is instead generated procedurally or by using artifacts of the rendering environment.

The following is a screenshot of a tiny game engine I built a little while ago in ClojureScript.

Tiny CLJS Game Engine Screenshot

The renderer runs on Facebook's React library so it is just a couple of lines of code.

I've spread it over several lines here for readability:

; DOM "scene grapher"
[:div {:id "game-board"}
  (doall
    (map
      (fn [[id e]]
        [:div {:class (str "sprite c" (:color e))
           :key id
           :style (compute-position-style e)
           :on-click (fn [ev] (sfx/play :blip))}
        (:symbol e)])
      (:entities @game-state)))]

The sprites are utf8 characters which are instantiated like this:

(make-entity {:symbol "◍"
              :color 0
              :pos [-20 300]
              :angle 0
              :behaviour behaviour-rock})

The function behaviour-rock here gets called once per frame and returns the new immutable entity-state for the next frame.

When you click on something the blip sound is generated procedurally in the browser using jsfxr.