Serverless Quickstart API

Quickly install, run and play a Flappy Bird in minutes!

Overview

This example runs using the dapp-server-js repository to deploy a serverless API. It provides a default implementation of a Mobius DApp backend running on Webtask.io and exposes some generic endpoints like /api/balance and /api/charge. If your DApp frontend requires something different, you can fork the repo and extend the API up to your needs.


Getting Started

Cloning flappy-dapp Repository##

All Flappy Bird examples are contained in a single repository. Clone the flappy-dapp repository to get started.

$ git clone https://github.com/mobius-network/flappy-dapp.git

Generating Key Pairs##

If this is the first time running one of the examples, you will need to generate testnet key pairs along with a dev-wallet.html file.

Navigate to the root directory of the repository and use mobius-cli create dev-wallet to generate a new dev-wallet.html file and account key pairs.

🚧

Installing Mobius CLI

If Mobius CLI has not yet been installed on your machine run gem install mobius-client. See Installation docs for more details on generating key pairs.


Backend Configuration

Install the backend dependencies, register a Webtask account, setup the server and run it.

Installing Dependencies##

Navigate to backend/serverless-quickstart and install dependencies.

# Navigate to Folder
$ cd backend/serverless-quickstart

# Install Dependencies
$ yarn install

Register Account##

If you have never used Webtask.io before, quickly register an account with webtask.io by running: $ yarn wt profile init

🚧

Installing Webtask CLI

If Webtask CLI has not been installed on your machine, see Webtask's official docs.

Server Setup##

Run the following command to configure backend settings and key environment variables.

$ yarn setup

The setup will ask 4 quick questions:

QuestionAnswer
What network will your DApp operate on?Test SDF Network ; September 2015
What is your DApp secret key?Open dev-wallet.html file and use application private key.
What is your DApp Name?Flappy Bird
What is your DApp Domain?flappy.mobius.network - used for setting JSON web token issuer.

Running the Server##

Run the server locally and note the port that the server is running on, by default the port will be set to 8080.

$ yarn dev

Frontend Configuration

Install the frontend dependencies, set the correct endpoints and run it.

Installing Dependencies##

In a new terminal window navigate to the frontend/ from the root directory and install dependencies.

# Navigate to frontend folder
$ cd frontend

# Install Dependencies
$ yarn install

Setting Endpoints##

Set the API endpoints to connect to for functions such as /charge or /balance according to the address your server is running on.

  1. Open main.js found at frontend/public/js/main.js.
  2. On line #18, change the DAPP_API variable to match your current servers address followed by /api.
// Server running in on localhost:8080
const DAPP_API = 'http://localhost:8080/api';

// or

// Server running in production on webtask.io after using '$yarn deploy'
const DAPP_API = 'https://wt-your-id.sandbox.auth0-extend.com/your-app/api';

🚧

/api

Make sure Flappy Bird DAPP_API variable ends with /api.

Running the Frontend##

At the root of the frontend/ folder run the project locally and take note of the localhost address it is running on.

# Run the localhost server
$ yarn dev

dev-wallet Configuration

Entering the Flappy Bird DApp requires authentication, this would be the process of a user opening your DApp from the DApp Store. To simulate this for development environments, open dev-wallet.html in your browser.

Set Auth Endpoint##

The Auth Endpoint is where the authorization requests will be sent too, this needs to be adjusted either in the browser or in the HTML itself.

# Using the port the server is currently running on
http://localhost:8080/auth

# or

# Server running in production on webtask.io after using '$yarn deploy'
https://wt-your-id.sandbox.auth0-extend.com/your-app/auth

🚧

/auth

Make sure the Auth Endpoint value ends with /auth.

Set Redirect URI##

The Redirect URI is where the user is redirected to with a Token after being successfully authorized. This is the localhost address that the frontend of the example is currently running on. If you are having trouble finding this address see Running the Frontend.

# Using the port the frontend is currently running on
http://localhost:3000

Playing Flappy Bird

Once the endpoints are set, the backend and frontend servers are running, and the dev-wallet.html file has been correctly set with the auth endpoint and redirect URI, the project can be run.

Use the "Open" button under "Normal Account" to use an authenticated and funded user account to play Flappy Bird using testnet MOBI!

📘

dapp-server-js

This example is running using the dapp-server-js repository available on GitHub. Clone for quick project reuse or fork for customization and quickly deploy a serverless solution for your Mobius DApps.


What’s Next

View the API endpoints built into this example.