Fluence workshop at the Web3Summit (Oct, 2018)
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
pics
resources Docker image tag updated Oct 19, 2018
sql-client
todo-list
.gitignore
README.md Fix README & comment some code Oct 21, 2018
cluster.sh Minor update in cluster.sh Oct 18, 2018

README.md

Join the chat at https://gitter.im/fluencelabs/workshop

Welcome to the Fluence workshop at the Web3Summit (Oct, 2018)

We will demonstrate the core of the Fluence platform and show how developers can use it to set up an infrastructure for the real-time data processing in decentralized environment.

At the workshop you will:

Learn about the nature of Fluence: the architecture overview and roadmap, the Fluence network, its composition, and how a developer could use it to power up a serverless application.

Have your own experience:

  • set up a local Fluence cluster,
  • launch a legacy SQL database (written in Rust) inside it,
  • test it: store and load data by running SQL queries in web browser,
  • implement a persistence layer in a simple web app (ToDo list) using Fluence js client.

This document will guide you through the process step-by-step. If you’ve discovered any bugs or faced difficulties replicating the results, please, feel free to poke us on Gitter!

Requirements

All you need is an installed npm and Docker.

You can get Docker for your platform here:

macOS users, kindly note that brew install docker is not enough, you will also need a Docker daemon. To install: download, open, copy Docker.app to Applications and run Docker.app from the Applications folder.

Start the cluster

Clone this repo by executing

git clone https://github.com/fluencelabs/workshop-2018-oct

In terminal, go to the workshop-2018-oct folder and launch the cluster by running

./cluster.sh

or, depending on your OS and Docker settings, you may need to use sudo as in

sudo ./cluster.sh

this will run 4 docker containers listening for client connections on the ports 25057, 25157, 25257, 25357.

Fluence keys, configuration and working directories are placed to $HOME/.fluence.

Showcase: LlamaDB SQL database running on Fluence

  1. Open sql-client/index.html file in the web browser.
  2. You can see cluster nodes statuses on the left, like this:

  1. Copy all queries from the Example queries block to the Type queries block:

  1. Push the Submit query button:

  1. Wait for the result in the Result block:

  1. You can see logs of what's happening in the web console:

Showcase: ToDo-list backed by LlamaDB and Fluence

We've seen Fluence run LlamaDB and execute plain SQL queries, now it's time to apply that knowledge to an actual web application.

  1. Go to workshop-2018-oct/todo-list directory.
  2. Open index.html file in the web browser.

You can see a TODO list app where you can add tasks, flag them as done and delete them.

But there is no persistence! All tasks will be gone after a page reload :(

Let's fix it!

But first, let's take a look at our Javascript API

  1. Open terminal and go to todo-list directory.
  2. Add Fluence Javascript client: npm install js-fluence-client@0.0.21.
  3. Open index.html in your favorite browser or reload if it was already open.
  4. Open web console in the browser. (also called Developer Tools in Chrome)
  5. To create session for interaction with the cluster, enter in web console:
let session = fluence.createDefaultSession("localhost", 25057);
  1. To create a table in the database, enter in web console:
session.invoke("do_query", "CREATE TABLE TODO_LIST(task varchar(128))");
  1. Add some tasks with an SQL command. To get the query result you can use result() method that will return promise. Enter in web console:
let result = session.invoke("do_query", "INSERT INTO TODO_LIST VALUES ('Fly to the moon'),( 'Conquer the world')").result();
  1. asString() will convert the result from bytes to string:
result.then((result) => console.log(result.asString()))
  1. Reload the page, new tasks will be available.

Implement persistence layer in ToDo app

  1. In todo-list directory open index.js in your favorite text editor.
  2. Navigate to the function addTask().
  3. That's the function called on the press of the Add button.
  4. We have already prepared function addTaskToFluence that sends task to Fluence when you press Add button. It works by sending an INSERT statement like we just did in the Web Console. Let's uncomment call to that function so the tasks are persisted on creation:
addTaskToFluence(task, todo_table);
  1. Navigate to function completeTask() and uncomment calls to deleteFromFluence and addTaskToFluence, so tasks completion would also be persisted:
deleteFromFluence(task, todo_table);
addTaskToFluence(task, done_table);
  1. Save index.js.
  2. In todo-list directory run npm install to install webpack.
  3. Run npm run build.
  4. Reload index.html in web browser.
  5. Now you can add tasks through interface and they will be persisted!

Stop the cluster

You can stop running Fluence nodes by going to the workshop directory workshop-2018-oct and running

./cluster.sh stop

To cleanup Fluence local files, remove $HOME/.fluence directory:

rm -rf $HOME/.fluence