Application Design

Course Index page

In this course we’ll build a Phoenix LiveView app (called Poeticoins) that gets real-time trades from multiple cryptocurrency exchanges and, with LiveView, it displays prices, and other data, on an interactive dashboard.

app_goal.png

Since the dashboard just shows the most recent data, we won’t need any database. We’ll see how to use Elixir processes to temporarily keep all we need in memory.

Our application is actually made by two parts: the Poeticoins core and PoeticoinsWeb Phoenix web part. Once we’ve built the core functionalities, the LiveView part will heavily rely on them.

two_applications.png

Core Functionalities

Support different exchanges with multiple clients

The data we need (trades) comes from cryptocurrency exchanges. Poeticoins supports multiple exchanges, Coinbase Pro and Bitstamp at the moment. In Poeticoins, both Coinbase and Bitstamp clients connect to their Websocket API to get real-time trades.

Our goal is to build a real-time dashboard with Phoenix LiveView, which shows the price in USD and EUR of different cryptocurrencies, traded on different exchanges.

Each client runs on a GenServer process that manages its own websocket connection. All the clients are supervised by the Exchanges.Supervisor: in this way if a client crashes the supervisor restarts the process.

multiple_exchange_clients.png

PubSub

When CoinbaseClient or BitstampClient receive a trade event, this event is mapped to an internal %Trade{} Elixir struct and broadcasted to a PubSub topic. By using PubSub, we can decouple the clients from the rest of the application, and then easily subscribe from other processes to receive real-time trades.

pubsub.png

Historical

We use an Historical process to keep in memory the last trades.

Poeticoins Context

To access to these core functionalities, we use the Poeticoins context: a module that acts as a public interface, hiding the complexity of the underlying parts.

Web and LiveView

Let’s now focus on the Web and LiveView part.

When a user connects to our dashboard, a LiveView process is spawned (we will see in detail how LiveView works). To render the widgets with prices and charts, this LiveView process gets the most recent trades from Historical, and subscribes to PubSub to receive new trades.

When CoinbaseClient (or BitstampClient) receives a trade event from its exchange, it broadcasts the %Trade{} via PubSub. Then, the LiveView process receives the %Trade{} and updates the dashboard accordingly.

Full Architecture

In the image below we see the whole architecture, with all the components: the application is split in two parts (Poeticoins and PoeticoinsWeb).

full_arch_landscape.png