Setup Anacleto

Anacleto's development environment consists of two NodeJS services that you can configure on any PC or Mac.

Install NodeJs and npm Docs

If you are not already using it we highly recommend using Visual Studio Code.

Anacleto Backend

Create backend project folder

mkdir sample-app-backend

Init node project

npm init

Create index.js file

require("dotenv").config({ path: __dirname + "/.env" });

const Anacleto = require("anacleto-backend");

Anacleto();

Instal anacleto-backend

npm install anacleto-backend

Add star script to package.json

package.json
{
  "name": "sample-app-backend",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node index.js"
  },
  "dependencies": {
      "anacleto-backend": "^1.0.0",
      "dotenv": "^16.0.3"
  }
}

Create .env file and save on anacleto-backend root.

.env
# environmen
## development,test,prodution
ENV=development
LOG_DIR=/tmp/logs

# Firebase service account JSON
FIREBASE_SERIVCE_ACCOUNT={...}

# Server listening port
PORT=3001

# Logs settings
LOGS_MAX_SIZE=20m
LOGS_MAX_FILE=1d

# Apps
## Firebase UID of super admin (they can access all app and all tenants)
SUPER_ADMIN=["UDhyadjTgxXIxRRgebGW6k9jbVG2","S6MhvOhlAkad4dpJzqrZOLRoahK2"]
## Sync folder
GIT_SYNC_DIR=/Users/luca.biasotto/Workspaces/ReactJS/Luca/apps
## App git data, for auth see: https://isomorphic-git.org/docs/en/authentication.html
APPS={"ANACLETO_SAMPLE":{"id":"ANACLETO_SAMPLE","name":"SampleApp","repository":"https:\/\/github.com/cicciopasticcio/anacleto_sample.git","oauth2format":"github","username":"YOUR_GITHUB_TOKEN","password":"x-oauth-basic"},"ANACLETO_SAMPLE2":{"id":"ANACLETO_SAMPLE2","name":"SampleApp2","repository":"https:\/\/github.com/cicciopasticcio/anacleto_sample_2.git","oauth2format":"github","username":"YOUR_GITHUB_TOKEN","password":"x-oauth-basic"}}
## Tenants list
TENANTS=[{"tenant":"TENANT1","description":"Tenant 1 SRL"},{"tenant":"TENANT2","description":"Tenant 2 SRL"}]

## My sql Connection
MYSQL_SETTINGS={"CONNECTION_NAME":{"connectionLimit":10,"host":"","user":"","password":"","database":""}}
  • ENV: project environment: development / test / production

  • PORT: listening port (Ex 3001)

  • LOG_DIR: log directory path

  • FIREBASE_SERIVCE_ACCOUNT: firebase service account json. To generate a private key file for your service account:

    1. In the Firebase console, open Settings > Service Accounts.

    2. Click Generate New Private Key, then confirm by clicking Generate Key.

    3. Securely store the JSON file containing the key.

    4. Copy service account JSON in this .env variable

  • LOGS_MAX_SIZE: max log file size (ex 20m)

  • LOGS_MAX_FILE: max log age (ex 1d)

  • SUPER_ADMIN: array of super admin id

  • GIT_SYNC_DIR: folder where the app sources are downloaded

  • APPS: a JSON with the apps data, you can specify a connection for each app:

    • APP

      • id

      • name

      • repository

      • username

      • password

    ex:

    {
      "ANACLETO_SAMPLE": {
        "id": "ANACLETO_SAMPLE",
        "name": "SampleApp",
        "repository": "https://github.com/cicciopasticcio/anacleto_sample.git",
        "oauth2format": "github",
        "username": "YOUR_GITHUB_TOKEN",
        "password": "x-oauth-basic"
      },
      "ANACLETO_SAMPLE2": {
        "id": "ANACLETO_SAMPLE2",
        "name": "SampleApp2",
        "repository": "https://github.com/cicciopasticcio/anacleto_sample_2.git",
        "oauth2format": "github",
        "username": "YOUR_GITHUB_TOKEN",
        "password": "x-oauth-basic"
      }
    }
  • TENANTS: array of available tenants

    [
      {
        "tenant": "TENANT1",
        "description": "Tenant 1 SRL"
      },
      {
        "tenant": "TENANT2",
        "description": "Tenant 2 SRL"
      }
    ]
  • MYSQL_SETTINGS: MySql connections

    {
      "MY_DB1": {
        "connectionLimit": 10,
        "host": "100.155.1.10",
        "user": "ciccio",
        "password": "ciccio_password",
        "database": "db1"
      },
      "MY_DB2": {
        "connectionLimit": 10,
        "host": "100.155.1.11",
        "user": "pasticcio",
        "password": "pasticcio_password",
        "database": "db2_blabla"
      }
    }
  • DATASTORE_SETTINGS: Google Datastore connection data

    {
      "type": "service_account",
      "project_id": "<project_id>",
      "private_key_id": "<private_key_id>",
      "namespace": "SVILUPPO",
      "private_key": "-----BEGIN PRIVATE KEY-----\n<private key>\n-----END PRIVATE KEY-----\n",
      "client_email": "<client_email>",
      "client_id": "<client_id>",
      "auth_uri": "https://accounts.google.com/o/oauth2/auth",
      "token_uri": "https://oauth2.googleapis.com/token",
      "auth_provider_x509_cert_url": "https://www.googleapis.com/oauth2/v1/certs",
      "client_x509_cert_url": "<client_x509_cert_url>"
    }
  • BIGQUERY_SETTINGS: Google BigQuery connection data

    {
      "BIG_QUERY_1" : {
        "location" : "europe-west2",
        "defaultDataset" : {
          "datasetId": "my_scheme",
          "projectId": "my-gcp-project"
        }
      }
    }

Start anacleto-backend module

npm start

Anacleto Frontend

Anacleto frontend is a react app, first you need to create a new React app

npx create-react-app sample-app

Install anacleto-frontend

npm install --save anacleto-frontend

Load Anacleto from index.js file

index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import {Anacleto} from 'anacleto-frontend';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <Anacleto />
  </React.StrictMode>
);

Create .env file and save on project root folder

.env
#enviroment
REACT_APP_ENV=development
# backend url
REACT_APP_BACKEND_HOST=http://localhost:3001
# login message
REACT_APP_LOGIN_MESSAGE=Login to Anacleto DEMO Apps!
# firebase config
REACT_APP_FIREBASE_CONFIG={"apiKey":"...","authDomain":"xxx.firebaseapp.com","projectId":"xxx","storageBucket":"xxx","messagingSenderId":"197970136961","appId":"xxx"}
  • REACT_APP_ENV: project enviroment: development / test / production

  • REACT_APP_BACKEND_HOST: anacleto-backend url

  • REACT_APP_LOGIN_MESSAGE: anacleto-frontend login message

  • REACT_APP_FIREBASE_CONFIG: your Firebase project configuration JSON

Before you can add Firebase to your JavaScript app, you need to create a Firebase project and register your app with that project. When you register your app with Firebase, you'll get a Firebase configuration object that you'll use to connect your app with your Firebase project resources. Docs: follow step 1

Start Anacleto frontend

npm start

Last updated