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:
Question | Answer |
---|---|
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.
- Open
main.js
found atfrontend/public/js/main.js
. - 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.
Updated almost 7 years ago