Giter Club home page Giter Club logo

hysds_ui_with_auth's Introduction

Pre-Requisites

  • Node (>=6 & < 13) installed on machine
  • npm installed

Create config file

# create config file (if developing locally)
cp src/config/index.local-development.template.js src/config/index.js

set your Elasticsearch host:port + indices/aliases

// config/index.js
exports.GRQ_ES_URL = "http://localhost:9200";
exports.GRQ_ES_INDICES = "grq";
.
.
.
exports.MOZART_ES_URL = "http://localhost:9998";
exports.MOZART_ES_INDICES = "job_status";

Creating Tosca + Figaro config file(s)

both the figaro and tosca views in hysds_ui have their own configuration files to customize what the end users can see

  • filters in the sidebar
  • fields returned from elasticsearch
  • columns in the table view

you can copy it straight to src/config or symlink it from another directory

cp src/config/figaro.template.js src/config/figaro.js
cp src/config/tosca.template.js src/config/tosca.js

NOTE: when adding a new filter to the sidebar make sure to add it (componentId) to both exports.FILTERS and exports.QUERY_LOGIC:

// config/figaro.js or config/tosca.js

exports.FILTERS = [
  ...
  {
    componentId: "foo",
    dataField: "foo.keyword",
    title: "foo",
    type: "single",
  },
  ...
];

exports.QUERY_LOGIC = {
  and: [
    ...
    "foo",
    ...
  ],
};

Building and Running application locally

# install nodejs dependencies
npm install

# builds and compiles to dist/index.js
npm run build

# run application in development mode with hot-reloading
npm start

# run application in "production mode"
npm run prod

Dockerizing React Application

  • uses nginx as a webserver to serve application as a static file
# Building the docker image
docker build . -t hysds_ui:latest

# Running image
docker run -p 8080:80 hysds_ui:latest

Test Image 1

hysds_ui_with_auth's People

Contributors

dustinklo avatar ramesh-maddegoda avatar dependabot[bot] avatar pymonger avatar mcayanan avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.