Skip to content

Monitoring Dashboard With WebSocket For LPS Technical Interview

Notifications You must be signed in to change notification settings

amirzenoozi/lps-app-interview

Repository files navigation

LPS Dashboard Monitoring

This project was bootstrapped with Create React App. This project lets you have a simple portfolio website that is responsive and easy to use. You can add your skills and experiences.

Objectives

  • Get Data From Socket EndPoint (Without Socket.io)
  • Show Each Server in Single Page
  • Show CPU Usage TimeLine Realtime
  • Show Memory Usage TimeLine Realtime
  • Mobile First Design
  • Toggle Metrics (CPU, Memory, All
  • Reusable Components
  • Add StoryBook
  • Aggregation of Data From Servers (Memory)
  • Unit Test
    • Button Component
    • Radio Group Component
    • WebSocket Module (All 5 Servers)
    • FlexRow
    • FlexCol
    • Container
    • DataTable
    • HyperLink
  • Deployment
    • Dockerfile
    • GitHub Actions to Push Image to DockerHub
    • Deploy on external server
    • Automate the Deploy Steps

Run the project

In the project directory, you can run:

  • git clone git@github.com:amirzenoozi/lps-app-interview.git
  • cd lps-app-interview
  • git config core.hooksPath .githooks
  • yarn install
  • yarn start
  • Open http://localhost:3000 to view it in the browser.

Other Available Scripts

  1. For Test: yarn run test
  2. For Build: yarn run build
  3. For Manual Setting: yarn run eject

Note: this is a one-way operation. Once you eject, you can’t go back!

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

If you aren’t satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.

Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.

Useful Links

  1. Create React App documentation.
  2. React documentation.