Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/Shopify/restyle
A type-enforced system for building UI components in React Native with TypeScript.
https://github.com/Shopify/restyle
Last synced: 3 months ago
JSON representation
A type-enforced system for building UI components in React Native with TypeScript.
- Host: GitHub
- URL: https://github.com/Shopify/restyle
- Owner: Shopify
- License: mit
- Created: 2019-09-06T09:39:03.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2024-10-01T13:52:10.000Z (4 months ago)
- Last Synced: 2024-10-06T14:11:21.282Z (4 months ago)
- Language: TypeScript
- Homepage: https://shopify.github.io/restyle/
- Size: 3.71 MB
- Stars: 2,945
- Watchers: 269
- Forks: 133
- Open Issues: 26
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-list - restyle - enforced system for building UI components in React Native with TypeScript. | Shopify | 1202 | (TypeScript)
- stars - Shopify/restyle - A type-enforced system for building UI components in React Native with TypeScript. (TypeScript)
- stars - Shopify/restyle - A type-enforced system for building UI components in React Native with TypeScript. (TypeScript)
README
![Restyle Image](./Restyle.png)
Getting started •
Installation •
Playground •
Discord**Build a consistent, themed UI in minutes.**
![RestyleTheme 2020-02-25 17_43_51](https://user-images.githubusercontent.com/688415/75268245-91084b80-57f7-11ea-905b-2a9046aa5ca3.gif)
The Restyle library provides a type-enforced system for building UI components in React Native with TypeScript. It's a library for building UI libraries, with themability as the core focus.
This library assumes that the UI is built upon a design system that (at the very least) defines a set of colors and spacing constants that lays as a foundation. While the library acknowledges that there can be exceptions to the system by allowing any style to be overridden, it keeps the developer most productive when one-off values are kept to a minimum.
## Installation
Add the package to your project using one of the following:
```bash
yarn add @shopify/restyle
``````bash
npm install @shopify/restyle
``````bash
npx expo install @shopify/restyle
```## Usage
See [Usage](https://shopify.github.io/restyle/#usage) in the documentation, or see below for the fixture app.
## App / Playground
The [fixture](https://github.com/Shopify/restyle/tree/master/fixture) is an example app to showcase the library's usage.
## Running the Documentation site locally
To run the Documentation site locally, please follow the steps below:
1. `cd documentation`
2. `yarn`
3. `yarn start`
4. Go to http://localhost:3000/restyle/## Migrating to restyle v2
Read more about migration to v2 [here](https://shopify.github.io/restyle/guides/migrating-to-v2)
## Inspiration
Restyle is heavily inspired by [https://styled-system.com](https://styled-system.com/).
## Contributing
For help on setting up the repo locally, building, testing, and contributing
please see [CONTRIBUTING.md](https://github.com/Shopify/restyle/blob/master/CONTRIBUTING.md).## Code of Conduct
All developers who wish to contribute through code or issues, take a look at the
[CODE_OF_CONDUCT.md](https://github.com/Shopify/restyle/blob/master/CODE_OF_CONDUCT.md).## License
MIT, see [LICENSE.md](https://github.com/Shopify/restyle/blob/master/LICENSE.md) for details.