All Projects → nexxtway → React Rainbow

nexxtway / React Rainbow

Licence: mit
🌈 React Rainbow Components. Build your web application in a snap.

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to React Rainbow

Egeo
EGEO is the open-source UI library used to build Stratio's UI. It includes UI Components, Utilities, Services and much more to build user interfaces quickly and with ease. The library is distributed in AoT mode.
Stars: ✭ 69 (-95.85%)
Mutual labels:  library, components, javascript-library
Neumorphic Ui
📚 A library of components based on the concept of neumorphism
Stars: ✭ 82 (-95.07%)
Mutual labels:  library, components, react-components
Semantic Ui React
The official Semantic-UI-React integration
Stars: ✭ 12,561 (+655.78%)
Mutual labels:  components, react-components, javascript-library
Awesome Ui Component Library
Curated list of framework component libraries for UI styles/toolkit
Stars: ✭ 702 (-57.76%)
Mutual labels:  library, components, react-components
Vitamin Web
Decathlon Design System libraries for web applications
Stars: ✭ 70 (-95.79%)
Mutual labels:  components, ui-library
Msvgc
Make React components from your plain SVG files
Stars: ✭ 64 (-96.15%)
Mutual labels:  components, react-components
Easygrid
EasyGrid - VanillaJS Responsive Grid
Stars: ✭ 77 (-95.37%)
Mutual labels:  library, javascript-library
Ui
React Styled Components with bootstrap grid system
Stars: ✭ 89 (-94.65%)
Mutual labels:  components, react-components
React Froala Design Blocks
React implementation for Froala Design Blocks.
Stars: ✭ 89 (-94.65%)
Mutual labels:  developer, designer
Redocx
📄 Create word documents with React
Stars: ✭ 1,331 (-19.92%)
Mutual labels:  library, components
Uniforms
A React library for building forms from any schema.
Stars: ✭ 1,368 (-17.69%)
Mutual labels:  components, react-components
Terra Clinical
Terra Clinical is a repository for terra react components used only in a clinical setting.
Stars: ✭ 59 (-96.45%)
Mutual labels:  components, react-components
Leaf Ui
🍃 Leaf-UI: A react component library built using styled-components
Stars: ✭ 98 (-94.1%)
Mutual labels:  components, ui-library
Re Jok
A React UI Component library built with styled-components
Stars: ✭ 102 (-93.86%)
Mutual labels:  components, react-components
Kit
Tools for developing, documenting, and testing React component libraries
Stars: ✭ 1,201 (-27.74%)
Mutual labels:  library, components
React Components
React components
Stars: ✭ 47 (-97.17%)
Mutual labels:  components, react-components
Angular Tree Component
A simple yet powerful tree component for Angular (>=2)
Stars: ✭ 1,031 (-37.97%)
Mutual labels:  library, javascript-library
Bloc.js
A predictable state management library that helps implement the BLoC design pattern in JavaScript
Stars: ✭ 111 (-93.32%)
Mutual labels:  library, react-components
Redash
Tiny functional programming suite for JavaScript.
Stars: ✭ 40 (-97.59%)
Mutual labels:  library, javascript-library
Webrix
Powerful building blocks for React-based web applications
Stars: ✭ 41 (-97.53%)
Mutual labels:  library, components

React Rainbow Component logo

React Rainbow

React Rainbow is a collection of components that will reliably help you build your application in a snap. Give it a hack and let us know what you think.

CircleCI npm version components Prettier Known Vulnerabilities Coverage Status License: MIT Maintainability

CLA assistant Gitter

Features

  • 90+ components built on top of React.
  • Interactive Examples.
  • First class testing.
  • Wdio page objects.
  • Redux-Form integration.
  • We designed each component with i18n in mind.
  • Accessibility is part of our definition of done.
  • Components with out-of-the-box Typescript typing.

🖥 Environment Support

Firefox
Firefox
Chrome
Chrome
Safari
Safari
last 2 versions last 2 versions last 2 versions

📦 Installation

React Rainbow Components is available as an npm package.

$ yarn add react-rainbow-components
or
$ npm install react-rainbow-components --save

⌨️ Usage

Here is a quick example to get you started. It's all you need:

import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from 'react-rainbow-components';

function App() {
    return <Button label="Hello World!" variant="brand" onClick={() => alert('Hello World!')} />;
}

ReactDOM.render(<App />, document.getElementById('container'));

Yes, it's really all you need to get started as you can see in this live and interactive demo:

Edit Button

You can also use individual component from bit:

import React from 'react';
import ReactDOM from 'react-dom';
import Button from '@bit/nexxtway.react-rainbow.button';

function App() {
    return <Button label="Hello World!" variant="brand" onClick={() => alert('Hello World!')} />;
}

ReactDOM.render(<App />, document.getElementById('container'));


⌨️ Running locally

  1. git clone https://github.com/nexxtway/react-rainbow.git
  2. cd react-rainbow
  3. yarn install
  4. yarn start
  5. navigate to http://localhost:6060/

💬 Questions

For how-to questions and other non-issues, please use our Gitter Chat instead of Github issues.

https://gitter.im/react-rainbow-components/community


🖥 Examples

Are you looking for an example project to get started?

We host some here.


🤝 Contributing

We are excited that you are interested in contributing to this project!

You can help us improve React Rainbow Components, the first step to begin collaboration is to create an issue before submitting a pull request. It's always good to file an issue, so we can discuss the details of your approach or suggestion.

See more details about how to collaborate


⚖️ License

The MIT license governs your use of React Rainbow Components.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].