This repository contains all frontend and backend code used for creating hiveonboard.com - a landing page for people who are interested in the HIVE blockchain project and want to get involved. One of most important use cases is a simple to use account creation flow.
The app is build on ReactJS for frontend, NodeJS for backend and makes use of several open source libs - covered at the end of this file.
More about the project is covered on @hiveonboard blog on HIVE: https://peakd.com/@hiveonboard
This project uses Firebase for easy deployable and scalable infrastructure. In order to deploy this project you have to create a free account.
It's also possible to run this app on a linux machine with self hosted webserver, db and nodejs backend. Feel free to make a fork and adjust it to your needs.
- Fork the repository
git clone https://github.com/christianfuerst/hiveonboard
- Install frontend dependencies
cd hiveonboard
npm install
- Install backend dependencies
cd functions
npm install
- Change back to root directory and install Firebase CLI
cd ..
npm install -g firebase-tools
- Sign into Firebase using your Google account
firebase login
-
Go to Firebase console -> Create new project
-
Go to Firebase project -> Create Web-App and follow the instructions
-
Create a new file
/config/firebase.json
using the template file in the same folder -
Put in your settings from the Web-App you just created
-
Go to Firebase project -> Database and create a cloud firestore instance in your region
-
Go to Firebase project -> Authentication and enable Phone Sign-In
-
Create file
.firebaserc
on root folder using this template and insert your project name
{
"projects": {
"default": "your-project-name"
}
}
- Create a new file
/functions/config.json
from the template file in the same folder
{
"account": "INSERT-HIVE-ACCOUNT",
"password": "INSERT-HIVE-ACTIVE-KEY",
"rcThreshold": 30,
"creator_instances": [
{
"creator": "NAME-OF-WHALE-ACCOUNT",
"endpoint": "ENDPOINT-URI",
"apiKey": "YOUR-API-KEY"
}
]
}
- The file contains the HIVE account which will be used to claim account creation tickets and create accounts from this tickets
- Optional: Add API enabled https://github.com/fbslo/creator instances to use additional account, where keys aren't under your control. If no instance is available leave an empty array
[]
.
- Build a production build for the React app
npm run build
- Deploy to Firebase
firebase deploy
npm start
- @hiveio/hive-js: Hive.js the JavaScript API for Hive blockchain
- @material-ui/core: React components that implement Google's Material Design.
- @material-ui/lab: Material-UI Lab - Incubator for Material-UI React components.
- @mui-treasury/components:
- @testing-library/jest-dom: Custom jest matchers to test the state of the DOM
- @testing-library/react: Simple and complete React DOM testing utilities that encourage good testing practices.
- @testing-library/user-event: Simulate user events for react-testing-library
- clsx: A tiny (229B) utility for constructing className strings conditionally.
- firebase: Firebase JavaScript library for web and Node.js
- formik: Forms in React, without tears
- lodash: Lodash modular utilities.
- react: React is a JavaScript library for building user interfaces.
- react-dom: React package for working with the DOM.
- react-phone-input-2: A react component to format phone numbers
- react-router-dom: DOM bindings for React Router
- react-scripts: Configuration and scripts for Create React App.
- reactfire: Firebase library for React
- yup: Dead simple Object schema validation
- @hivechain/dhive: Hive blockchain RPC client library
- axios: Promise based HTTP client for the browser and node.js
- firebase-admin: Firebase admin SDK for Node.js
- firebase-functions: Firebase SDK for Cloud Functions
- lodash: Lodash modular utilities.