# Introduction

> CoreUI for React.js is UI Component library written in TypeScript, and ready for your next React.js project. Learn how to include CoreUI for React.js in your project.

## Installation

### Npm

```bash tab={"label":"CoreUI"}
npm install @coreui/react @coreui/coreui
```

```bash tab={"label":"CoreUI PRO"}
npm install @coreui/react-pro @coreui/coreui-pro
```

### Yarn

```bash tab={"label":"CoreUI"}
yarn add @coreui/react @coreui/coreui
```

```bash tab={"label":"CoreUI PRO"}
yarn add @coreui/react-pro @coreui/coreui-pro
```

## Using components

```jsx tab={"label":"CoreUI"}
import { CAlert } from '@coreui/react';
```

```jsx tab={"label":"CoreUI PRO"}
import { CAlert } from '@coreui/react-pro';
```

## Stylesheets

React components are styled using the `@coreui/coreui` or `@coreui/coreui-pro` CSS library, but you can also use them with the bootstrap CSS library. That is possible because the `@coreui/coreui` library is compatible with Bootstrap, it just extends its functionalities. The only exceptions are custom CoreUI and CoreUI PRO components, which don't exist in the Bootstrap ecosystem.

### CoreUI and CoreUI PRO CSS files

###### Basic usage

```js tab={"label":"CoreUI"}
import '@coreui/coreui/dist/css/coreui.min.css'
```

```js tab={"label":"CoreUI PRO"}
import '@coreui/coreui-pro/dist/css/coreui.min.css'
```

### Bootstrap CSS files

###### Installation

```bash
npm install bootstrap
```

###### Basic usage

```js
import 'bootstrap/dist/css/bootstrap.min.css'
```
