Code Monkey home page Code Monkey logo

ui's Introduction

As a part of making Hygieia more modular, this repo will host Hygieia UI code. More to come!!!!

Hygieia UI

This project requires Angular CLI version 8.0.3.

Setup:

  1. Fork and clone the UI folder
  2. Navigate to your UI folder and install the package dependencies by running npm install
  3. Download Angular CLI by running npm install -g @angular/[email protected]
  4. You can run ng version to check your Angular CLI version and related package dependency versions (make sure the package versions are v8)

Build and run the executable file for the api

Before you start, you must run the api on the side. After you fork/clone the Hygieia api, navigate to the \api directory and run the following command:

mvn clean install

This will create an output api.jar file in the \target folder.

Tip: Before you continue, make sure you set the configurable parameters in the api.properties file to connect to the dashboard MongoDB database instance, including properties required by the API module. For more information, please visit the Hygieia api guide.

Navigate to api\target, and execute the following command in the command prompt:

java -jar api.jar --spring.config.location=C:\[path to api.properties file] -Djasypt.encryptor.password=hygieiasecret

Build the Project

With the api running, open a different terminal and run ng build in your \UI folder. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Development server

In the \UI folder, run ng serve for a dev server. Navigate to http://localhost:4200/ in a incognito browser. The app will automatically reload if you change any of the source files.

Running unit tests

Run ng test to execute the unit tests via Karma. You can also debug using Karma.

An alternative method to run unit tests is to run npm run test-headless in your UI folder in a terminal. This will also test your code coverage.

Debugging with IntelliJ

If you are using IntelliJ, you can debug with JavaScript Debug. Navigate to the Edit Configurations tab, hit the + sign to Add New Configuration, and add JavaScript Debug.

Inside the Run/Debug Configurations popup, you can edit the name to your preference and change the URL to http://localhost:4200. This will allow you to navigate the UI on localhost to hit the debug breakpoints you set.

Use the Default Chrome browser and apply your changes.

Note: When you start the debug property, it will open a new browser popup for debugging specifically (also in localhost:4200).

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

ui's People

Contributors

andy-scollard avatar benj58xu avatar chzhanpeng avatar courtneyp123 avatar cschristine avatar danielyhuang avatar jhoelscher7 avatar kheinz04 avatar nameisaravind avatar nireesht avatar pparekh237 avatar rvema avatar sbrenthughes avatar vidhya9lakshmi avatar

Watchers

 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.