Orderbook view

Orderbook view

What is Order Book?

An Order Book is an application that usually displays some kind of information related to buying and selling stuff.

<aside> πŸ’‘ The most common use case is showing data for various assets, such as stocks, bonds, currencies and even cryptocurrencies.


What Are We Building?

In this tutorial, we will see how to build an Order Book web application, that is going to be used to display real-time cryptocurrencies info.

We will use React with Typescript for creating the UI, Redux for managing the application state and styled-components for applying the styling. And last, but not least, WebSockets for fetching the data feeds.


If you want to skip the reading, here πŸ’ is the GitHub repository with a detailed README πŸ™Œ, and here you can see the live demo.

Why Would I Need an Order Book?

In practice Order Books are used by traders to watch the fluctuations of the bidding price and the asking price of certain products - currencies, stocks, etc. This is happening real time, hence the changes could be very rapid. Here is where WebSockets will come in handy, as you will see later.

In the past people did similar thing on paper, but the β€˜real-time' part was impossible, of course.

A regular Order Book usually has two sides - buying (or bidding), shown in green on the left side and selling (or asking), red, on the right.

Classic Orderbook

Classic Orderbook

The Plan