Code Monkey home page Code Monkey logo

ui-toolkit-react's Introduction

UI Toolkit React

CodeQL Build Codecov OSSF-Scorecard Score Discord

Disclaimer: Production viable releases are tagged and listed under 'Releases'. All other check-ins should be considered 'in-development' and should not be used in production

The UI Toolkit provides prebuilt, React-based components for integrating remote management features such as a keyboard, video, mouse (KVM) control into a web-based management console UI. The controls have a reference UI and layout that can be customized further to seamlessly integrate with existing management console solutions.



For detailed documentation about Getting Started with the UI Toolkit or other features of the Open AMT Cloud Toolkit, see the docs.


Prerequisites

To succesfully deploy the UI Toolkit using React, the following software must be installed on your development system:

Create a New React App

The React app can be created in any preferred development directory. The MPS can continue to run while creating and running the app.

  1. In a Command Prompt or Terminal, go to your preferred development directory.

  2. Run the following commands to create sample React app named my-app.

    npx create-react-app my-app && cd my-app

Add UI Toolkit

  1. Run the following command to add the UI Toolkit and install the required dependencies:

    npm install @open-amt-cloud-toolkit/ui-toolkit-react
  2. Run the following commands to start the web UI locally:

    npm start
  3. By default, React apps run on port 3000. If port 3000 is already used by the MPS server or any other application, you'll be prompted to use another port. If this happens, enter 'Y'.

    Sample Output:

    You can now view my-app in the browser.
    Local: http://localhost:3000
    On Your Network: http://172.16.17.4:3000
    

Additional Resources


License Note

If you are distributing the FortAwesome Icons, please provide attribution to the source per the CC-by 4.0 license obligations.

ui-toolkit-react's People

Contributors

bwendlandt-intel avatar chethanbellechalu-intel avatar craig-spencer-12 avatar dependabot[bot] avatar madhavilosetty-intel avatar mahendra-intel avatar matt-primrose avatar rsdmike avatar step-security-bot avatar walt-intel avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

ui-toolkit-react's Issues

Create IDER REACT component

As a developer integrating IDER into my existing console, I want to have a reactcomponent that I can add to my react 18 based UI so that I can use the IDER features similar to how I use the KVM and SOL features of Open AMT Cloud Toolkit

Published version broken since 2.0.3

What should be the "dist" folder in @open-amt-cloud-toolkit/ui-toolkit-react 2.0.3 and 2.0.4 is actually a plain file containing the contents of package.json.

This is presumably from the following:

"scripts": {
    "prepublishOnly": "cp package.json dist",

in package.json which was introduced in 2.0.3.

It should ensure the dist folder exists before copying package.json into it.

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.