Skip to content

Commit 8708db9

Browse files
authored
Update README.md
1 parent 34f82f8 commit 8708db9

File tree

1 file changed

+25
-4
lines changed

1 file changed

+25
-4
lines changed

README.md

+25-4
Original file line numberDiff line numberDiff line change
@@ -4,23 +4,44 @@ Various stylish card components for React.
44
Focused on being ready to use with little modifications. Supply your data and you're good to go.
55

66
## Live demo
7-
https://nukeop.github.io/react-ui-cards/
7+
https://nukeop.github.io/react-ui-cards
88

99
## npm
1010
https://www.npmjs.com/package/react-ui-cards
1111

12-
## Installation
12+
## Installation and usage example
13+
Minified and gzipped bundle size: 52kb.
1314
```bash
1415
$ npm install --save react-ui-cards
1516
```
1617

18+
```typescript
19+
import { UserCard } from 'react-ui-cards';
20+
21+
export const Example = () => <UserCard
22+
float
23+
href='https://github.com/nukeop'
24+
header='https://i.imgur.com/vRAtM3i.jpg'
25+
avatar='https://i.imgur.com/XJxqvsU.jpg'
26+
name='Frank Hepsfield'
27+
positionName='Software Engineering Manager'
28+
/>
29+
```
30+
1731
## Development
1832
### Getting started
19-
After cloning the repo, run the following commands to start the project in development mode with hot reload:
33+
After cloning the repo, run the following commands to start Storybook in development mode with hot reload:
2034

2135
```shell
2236
$ npm install
23-
$ npm run dev
37+
$ npm run storybook
38+
```
39+
40+
### Running tests
41+
The repo is configured so that it generates snapshot tests from Storybook stories. To run them, use:
42+
43+
```shell
44+
$ npm test
2445
```
2546

2647
### Contributing

0 commit comments

Comments
 (0)