@fishbot/test-react-ui v1.12.44
UIBOT
UIBOT is an React UI library that we use natively for developing XBOT's applications. The library provides an easy way to get started creating React applicaton without sacrificing customization ability.
Supported platforms
Browser
UIBOT supports the latest, stable releases of all major browsers and platforms. It also supports Internet Explorer 11. You don't need to provide any JavaScript polyfill as it manages unsupported browser features internally and in isolation.
IE | Edge | Firefox | Chrome | Safari | Googlebot |
---|---|---|---|---|---|
11 | >=14 | >=52 | >=49 | >=10 | x |
You may experience degraded visuals in IE. IE 10 and below are unsupported due to their lack of support for CSS Flexbox Layout. These browsers were deprecated by Microsoft (end of support) in January 2016.
React
UIBOT supports the most recent versions of React, starting with ^16.8.0 (the one with the hooks).
TypeScript
UIBOT requires a minimum version of TypeScript 3.2.
Installation
npm install --save @xbotvn/ui @xbotvn/utils
Roboto font
UIBOT was designed with the Roboto font in mind. So be sure to follow these instructions. For instance, via Google Web Fonts:
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
Font icons
In order to use the font Icon component, you must first add the Material icons font. For instance, via Google Web Fonts:
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
Responsive meta tag
UIBOT is developed mobile-first, a strategy in which we first write code for mobile devices, and then scale up components as necessary using CSS media queries. To ensure proper rendering and touch zooming for all devices, add the responsive viewport meta tag to your head element.
<meta
name="viewport"
content="minimum-scale=1, initial-scale=1, width=device-width"
/>
Developing
If you want to run the project locally, its really easy!
The project uses Storybook for its demos and development environment. To run it locally:
- Clone repo
npm install
npm run storybook
Once started the browser will open to the storybook url. From here you can tweak the components and see them build and reload in real time.
You can build storybook as a static web application.
npm run build-storybook
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago