The complete guide on Technical implementation of ICO using Open Source technologies. Part 1

Contents

[Part 1] Intro

[Part 1] Features

[Part 1] Installation steps

[Part 1] General overview

[Part 2] Smart-contracts

[Part 2] Backend

[Part 2] Frontend

[Part 2] Testing

[Part 3] Deploying to production

[Part 3] What can be done better?

[Part 3] Customisation and adding features

[Part 4] Reporting bugs

[Part 4] Contribute!

Introduction

Hi! I’m one of developers and tech lead of the team which built free Open Source ICO dashboard software https://icodashboard.space . First of all this dashboard is complicated custom software and not an ICO builder so you will need some technical knowledge to run an ICO using space ICO dashboard.

Space ICO dashboard(https://icodashboard.space) is a free software under MIT license available at GitHub(https://github.com/secret-tech/frontend-ico-dashboard and https://github.com/secret-tech/backend-ico-dashboard). This project was created in order to provide turn-key technical solution for ICO organisers. This project was created by developers for developers so if you are not developer we suggest to hire us or any other dev team to configure and deploy dashboard because the risks are too high when you work with money. In this tutorial I will show you the basic setup process step by step so you can follow this instructions to run your own copy of https://demo.icodashboard.space. Please note that this setup is built for learning and I highly recommend you not to use this setup “as it is”. Another important thing to keep in mind is that we continuously improve our software and some modules/configurations can be changed during development.

I’m sorry this tutorial is so long but I think I would better create a complete guide I can refer to in case of any problems than answering a lot of the same questions again and again.

Environment & Prerequisites

Our team is using OS X and Debian-based Linux distributions for development and production. Since all the required services are packaged into docker containers it may work on Windows machines as well but honestly we didn’t test it and don’t have this in our plans.

To run the dashboard you need to have the following skills:

  • JavaScript
  • ReactJS + Redux
  • NodeJS(express framework)
  • MongoDB, Redis
  • docker & docker-compose
  • Basic Linux knowledge and server administration skills
  • Ethereum & Solidity

If you don’t have an idea what is it all about, you’d better hire someone to help you or find more simple solution.

I personally will use OS X Mojave in this tutorial with git, Docker and NodeJS installed locally.

Features

Space ICO dashboard provides the following features:

  • User registration & login
  • 2FA (email, Google Authenticator)
  • User profile settings
  • KYC/AML (currently we support 2 service providers for KYC/AML — Shuftipro and Jumio Netverify)
  • Referral/partner program
  • Live currency updates (ETH/USD, USD/Your token, etc) using Oraclize and Kraken API
  • Native Ethereum support
  • 150+ alt coins & Bitcoin support using https://coinpayements.net
  • Cold wallets but NO MetaMask required
  • Transaction tracking(outgoing and incoming)
  • ICO status tracking
  • Custom emails
  • Investor whitelisting
https://demo.icodashboard.space Sign In screen
https://demo.icodashboard.space main screen
https://icodashboard.space User settings page

Installation steps

OK, all introduction words said so far and now we can go through overview of all the installation steps we will need to do in order to run our own copy of icodashboard.space. There are 4 the most important parts of setting up the dashboard. It’s pretty important to do the things one by one in the correct order to save the time and be able to test all the parts separately and than all together.

  1. Configure 3rd-parties
  2. Setup Infrastructure
  3. Setup Backend
  4. Setup Frontend

We use some 3rd party services to delegate all the boring tasks like sending emails and handling KYC/AML to professionals. In this tutorial by 3rd-parties I mean:

3rd party services required for backend to operate correctly. There are some ways to not to rely on other services but it will take much more time to explain it here and for this tutorial we will just ignore this part. We will configure all the third-parties by the way as soon as our backend module configuration requires it.

Backend and frontend modules are built on top of infrastructure — it’s all about where do you run this apps and how requests arrive to application. In this tutorial we will run our app in 2 environments: local and production on 5$ Linode. You will need to prepare your infrastructure before setting up backend and frontend modules.

Backend module takes care about all the business logic of our ICO dashboard. Backend module is designed to provide an API to frontend application being a single entry point for the frontend app. Frontend application is a user-friendly interface to access backend API this means that we will configure frontend at the latest stage.

General overview

Before we go to setting it up let me explain how it works in general. Let’s start from explanation of overall architecture.

Architecture overview. Communication between frontend and backend

As you can see, user interacts only with frontend app, frontend interacts only with user and backend which takes care of all the rest. Here I showed backend as a monolithic thing but in reality it consists of multiple services. And to be able to fix problems when they appear you should at least know what services are included in our backend and what do they do.

Architecture overview. Backend modules

The minimum backend configuration we will build in this tutorial will look like one on the picture and will work like our demo app at https://demo.icodashboard.space . We are using docker-compose files to describe which services we want to run for our app. An example docker-compose.yml file can be found in the repo: https://github.com/secret-tech/backend-ico-dashboard/blob/develop/docker-compose.stage.yml

In this file, lines 52–64 you can find service called ‘rpc’ which I didn’t add to the picture above. You would like to add this service in case you want to run your own full Ethereum node with rpc interface to interact with blockchain instead of using Infura.io API. In this tutorial we will not cover setting up own node and will use great free service — infura.io which provides all rpc methods we need for our dashboard by very simple API.

Now let’s back to services from the picture and cover what they are used for. Redis and MongoDB are just databases. We use redis to store the data requested frequently and some data we don’t want to store for a long time. MongoDB is used for domain-specific things(in our case it’s ICO specific things).

Auth service registers users with their username(login/email), and tenant ID(for multi tenancy support). When user makes attempt to login with his or her credentials, Auth service is trying to match credentials. If success it generates unique random session key which is used as part of the JWT secret and stores this session to database. This means that no one can validate token without making a call to Auth service because the JWT signature created using specific Auth’s secret key and random session id known only by Auth service. This session mechanism is also used to invalidate tokens. Removing session key from the database will do the trick. Auth provides an HTTP API for the ICO dashboard service for user management purpose. In order to isolate environments from each other(for instance you would like to use auth service in the other app and you don’t want it to have an access to the users of another app) we’ve implemented tenant authorization mechanism: in case you want to read and/or write data to this service as well as validate user’s JWT tokens, you have to pass tenant JWT token in the request Authorization header. We’ll take a closer look on it during our backend configuration. Get more info in API docs.

Verify is a service to verify user’s email, phone or other contact information as well as verification of actions in the application(2FA, approve action by code from email/sms, etc). The main responsibilities are:

  1. Interact with a service provider(email, phone, Google Authenticator)
  2. Validation of a received code

We use this service during the registration step in order to verify that email provided by user belongs to user by emailing 6-digit code and asking users to enter this code. The same service is used for 2FA(Google Authenticator) and transaction approval by user. To get more info check out API docs.

ICO dashboard is the service which provides an API(read docs here: https://secret-tech.github.io/backend-ico-dashboard/ ) to the frontend application and do all the business logic. Some parts of business logic delegated to the other services but ICO dashboard still manages all the processes.

In the next part we will deploy smart-contracts to the test Ethereum network, and deploy frontend and backend locally to be able to test everything before deploying to the server. We will register accounts on some 3rd-party services to be able functionality like email.

Need your own custom ICO dashboard?

Contact us by email: info@secrettech.io or Telegram https://t.me/secret_tech1

Having troubles setting up?

Join our Telegram group and discuss with developers! https://t.me/spaceicodashboard

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store