chapter nine

9 Developing a browser-based blockchain node

 

This chapter covers:

  • Creating a web client to a blockchain
  • Creating a small library for hash generation
  • Running the blockchain web app and debugging TypeScript in the browser

Just to remind you, in chapter 8, we developed an app that would create an instance of the blockchain and provided the script for adding blocks to it. We launched that app from a command line, and it ran under the Node.js runtime.

In this chapter, we’ll review code of the blockchain app that runs in the browser. It has a pretty basic UI as we didn’t use any web framework here; we used the standard browser API like document.getElementById() or addEventListener() for implementing UI.

In this app, each block can store data about several transactions, which won’t be simple strings as in chapter 8 but will be implemented as TypeScript custom types. We accumulate several transactions and then create the block to be inserted in the blockchain. Also, we created a small library that contains the code for mining blocks and generating the proper hash, and this library can be re-used in a browser as well as in the Node.js environment.

We’ll start by presenting the project structure and running our blockchain web app. After that, we’ll do a detailed code review.

9.1  Running the blockchain web app

9.1.1  The project structure

9.1.2  Deploying the app using npm scripts

9.1.3  Working with the blockchain web app

9.2  The web client

9.3  Mining blocks

9.4  Using crypto APIs for hash generation

9.5  The standalone blockchain client

9.6  Debugging TypeScript in the browser

9.7  Summary