Watson Developer Cloud React Components
A collection of React components to write web applications using the Watson APIs.
Documentation: https://watson-developer-cloud.github.io/react-components/
Getting Started
-
Install the library
npm install --save watson-react-components
-
Add components to your React file where needed:
Example:
import { Header, Footer, /*...*/} from 'watson-react-components';
-
Make the assets public. For a Node.js/Express server, the following code should work:
app.use(express.static('./node_modules/watson-react-components/dist/'));
For other environments, check out the code and run
npm install; npm run build
and then copy the contents of thedist/
directory into your static folder. -
Add a reference to the stylesheet.
<link rel="stylesheet" type="text/css" href="/css/watson-react-components.min.css">
Adjust the
href
as necessary if a different location was chosen in step 3
How to Contribute
-
Install Dependencies
npm install
-
Start the development server
npm run dev
Changes will refresh the page thanks to browsersync.
-
Run the build command before pushing merge request:
npm run build
Directory structure
.
├── README.md
├── dist
│  ├── components // ES5 react components
│  ├── css
│  ├── images
│  ├── js
│  └── scss
├── example
│  ├── build
│  ├── index.html
│  └── src
├── gh-pages
│  ├── build
│  ├── images
│  ├── index.html
│  └── src
├── gulpfile.js
├── package.json
├── src
│  ├── components // React components
│  └── stylesheets // Sass files
└── static // static files
└── images // images
License
This sample code is licensed under Apache 2.0.
Contributing
See CONTRIBUTING.
Open Source @ IBM
Find more open source projects on the IBM Github Page