Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/grommet/grommet

a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package
https://github.com/grommet/grommet

a11y babel design-system grommet hacktoberfest javascript react ux-framework

Last synced: 10 days ago
JSON representation

a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package

Awesome Lists containing this project

README 

        
# Grommet: focus on the essential experience



[![PRs Welcome](https://img.shields.io/badge/pr's-welcome-7d4cdb.svg)][contributing]

[![slack](https://img.shields.io/badge/join%20the%20community-slack-fd6fff.svg)][slack]

[![blogs](https://img.shields.io/badge/view%20blogs%20on-medium-000000.svg)][medium]

[![npm package](https://img.shields.io/npm/v/grommet.svg?color=ffca58)][npm]

[![npm downloads](https://img.shields.io/npm/dm/grommet.svg?color=3d138d)][npm]

[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)][prettier]






## Documentation



Visit the [Grommet] website for more information.



## Support / Contributing



Before opening an issue or pull request, please read the [Contributing] guide.



## Install



You can install Grommet using either of the methods given below.



For npm users:



```shell

  $ npm install grommet styled-components --save

```



For Yarn users:



```shell

  $ yarn add grommet styled-components

```



There are more detailed instructions in the [Grommet Starter] app tutorial for

new apps. For incorporating Grommet into an existing app, see the [Existing App]

version.



## Explore



1. [Storybook] examples per component, you can create them locally by running:



   ```shell

     $ npm run storybook

   ```



   or



   ```shell

     $ yarn storybook

   ```



1. Grommet starter template [sandbox](https://codesandbox.io/p/sandbox/m7mml8l0zj?file=%2Findex.js).

1. [Templates, patterns, and starters][sandboxes]: feel free to share with us

   more pattern ideas on [Slack].

1. End-to-end project examples from our community in the

   [#i-made-this Slack channel][slack].

1. Read more from the Grommet team on [Medium].



## Stable



grommet is also available on a stable branch that is built with the content of the 'master' branch.

From your package.json point to stable.



```

"grommet": "https://github.com/grommet/grommet/tarball/stable",

```



For more info, read the [stable wiki](https://github.com/grommet/grommet/wiki/What-is-grommet-stable-and-how-to-use-it%3F).



## Release History



See the [Change Log].



## Tools Behind Grommet



Grommet is produced using this great tool:



- [BrowserStack] for browser emulators and simulators.

- [Circle CI] for continuous integration.



[browserstack]: https://www.browserstack.com/

[change log]: https://github.com/grommet/grommet/wiki/Change-Log

[circle ci]: https://circleci.com/gh/grommet/grommet/

[contributing]: CONTRIBUTING.md

[existing app]: https://github.com/grommet/grommet-starter-existing-app

[grommet starter]: https://github.com/grommet/grommet-starter-new-app

[grommet]: https://grommet.io/

[medium]: https://medium.com/grommet-io

[npm]: https://www.npmjs.com/package/grommet

[prettier]: https://github.com/prettier/prettier

[sandboxes]: https://codesandbox.io/u/grommetux/sandboxes

[sandbox]: https://codesandbox.io/p/sandbox/m7mml8l0zj?file=%2Findex.js

[slack]: https://slack-invite.grommet.io

[storybook]: https://storybook.grommet.io