Coder Social home page Coder Social logo

pre-registration-ui's Introduction

Maven Package upon a push Quality Gate Status

Pre-Registration Portal

This repository contains UI code for Pre-Registration portal. Refer here for details about the functions that a resident can perform via this portal.

Build and Deployment Guide

The code is written in Angular JS.

  • Install node.js – To build the angular code using angular cli that runs on node. We recommend Node: 14.17.3, Package Manager: npm 6.14.13

  • Install angular cli – To install angular cli for building the code into deployable artifacts. Follow the following steps to install angular cli on your system.

    • npm install -g @angular/cli (to install angular cli)
    • ng --version (to verify angular is installed in system) We recommend Angular CLI: 13.3.2
  • Check out the source code from GIT – To download the source code from git. Follow the following steps to download source code on your system.

For Production build:

  • Build the code – Follow the following steps to build the source code on your system.

    • Navigate to the pre-registration-ui directory inside the cloned repository. Then run the following command in that directory
    • ng build "--prod" "--base-href" "." "--output-path=dist" (to build the code)
  • Build Docker Image – Follow the following steps to build docker image on your system.

    • docker build -t name . (to build the docker image, replace name with the name of the image you want, "." Signifies the current directory from where the docker file has to be read.
    • Example: docker build -t preregui .
  • Run the docker image – Follow the following steps to build docker image on your system.

    • docker run –d –p 80:80 --name container-name image-name (to run the docker image created with the previous step,-d signifies to run the container in detached mode, -p signifies the port mapping left side of the":" is the external port that will be exposed to the outside world and right side is the internal port of the container that is mapped with the external port. Replace container-name with the name of your choice for the container, replace image-name with the name of the image specified in .the previous step)
    • Example: docker run -d -p 8080:8080 --name nginx preregui
  • Now you can access the user interface over the internet via browser.

For Local build:

  • Build & deploy the code locally – Follow the following steps to build the source code on your system.
    • Navigate to the pre-registration-ui directory inside the cloned repository. Then run the following command in that directory
    • ng serve
  • Now you can access the user interface via browser.
  • But this will give you CORS issue in accessing backend prereg services. To get around the CORS issue, angular CLI proxy can be used.
    • Update the API services BASE_URL in config.json
    {  
      "BASE_URL": "https://localhost:4200/proxyapi/",    
      "PRE_REG_URL": "preregistration/v1/"  
      }
    
    • Create a new file named proxy.conf.json. Replace ${servicesUrl} with correct url.
    {
      "/proxyapi": {
        "target": ${servicesUrl},
        "secure": true,
        "changeOrigin": true,
        "pathRewrite": {
          "^/proxyapi": ""
        }
      }    
    }
    
    • Now start the server by typing ng serve --proxy-config proxy.conf.json --ssl true
    • Open the browser, load the app with https://localhost:4200

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.