@abtnode/webapp

Web Dashboard to manage ABT Node

Usage no npm install needed!

<script type="module">
  import abtnodeWebapp from 'https://cdn.skypack.dev/@abtnode/webapp';
</script>

README

ABT Node Web

Web Dashboard to manage ABT Node

Built upon:

  • @abtnode/qgl
  • @abtnode/client
  • @abtnode/cli

1. Configuration

  1. create .env.development
  2. copy follow texts to .env.development, change ABT_NODE_BASE_URL to your local lan ip
# CAUTION: this is required to eliminate create-react-scripts complainings
SKIP_PREFLIGHT_CHECK=true

ABT_NODE_SESSION_SECRET="49bcf865c77a15993d87245b124bbc5125d2c3997437d1fda3"
ABT_NODE_SESSION_TTL="1d"
ABT_NODE_SK="0x338003c9b11cd9cb49a8c68db3ddeb860b394ab8d926d94cd917c14c1b9a805b6d4cba304e7f957facb2bfa11132a6688c233d75fa710f8bde469be6cbba5a81"
ABT_NODE_PORT="3030"
ABT_NODE_MODE="production"
ABT_NODE_NAME="ABT Node (Dev)"
ABT_NODE_DESCRIPTION="Web Interface to manage your ABT Node"
# e.g. http://192.168.1.2:3030
ABT_NODE_BASE_URL="http://<YOUR LOCAL LAN IP>:3030"
ABT_NODE_LOG_LEVEL="info"

2. Start the webapp

You need 4 terminal windows to start the client and server separately:

cd core/webapp
DEBUG=* npm run start:hub
DEBUG=@abtnode/*,@arcblock/* npm run start:daemon
DEBUG=@abtnode/*,@arcblock/* npm run start:service
DEBUG=@abtnode/* npm run start:client

Now, you are ready to hacking the ABT Node Dashboard.

How to run as production from your local source?

Following steps requires you have a valid setup of the repo, which means you can start the dashboard in development mode.

Build the dashboard

cd core/webapp && npm run build:client && npm run build:daemon

Create symbolic link for CLI

ln -s /path/to/abtnode-repo/core/cli/bin/abtnode.js /usr/local/bin/an

Run your local copy

# optional: create a new instance for test
an stop
rm -rf ~/.abtnode*
an init

# start with latest code
an start

If your local nginx can not listen on port 80 and port 443, you can make it listen on other ports:

ABT_NODE_HTTP_PORT=8080 ABT_NODE_HTTPS_PORT=8443 an start

Then, use port forwarding to redirect traffic from 80 => 8080, and 443 => 8443:

echo "
rdr pass inet proto tcp from any to any port 80 -> 127.0.0.1 port 8080
rdr pass inet proto tcp from any to any port 443 -> 127.0.0.1 port 8443
" | sudo pfctl -ef -

Coverage

Coverage for this package contains 3 parts:

  • api: collected using jest, configured in jest.config.js, result in coverage-api
  • src: collected using react-script, configured in jest in package.json, result in coverage
  • e2e: collected using cypress, configured in nyc in package.json, result in coverage-e2e

Develop blocklet in dev server

  1. Make sure your dev server is running

  2. Goto blocklet root dir

  3. Run command <blocklet-server-source-dir>/core/cli/tool/dev.js (Replace <blocklet-server-source-dir> to your custom folder)

Create a link for dev.js

  1. Run command ln -s <blocklet-server-source-dir>/core/cli/tool/dev.js /usr/local/bin/bn-dev
  2. Then you can use bn-dev to develop blocklet in dev server

Run migration for dev server

cd core/webapp && npm run dev:migration -- --from-version <version>

e.g. npm run dev:migration -- --from-version 1.6.20 will run migration scripts greater than 1.6.20