rofrischmann/fela

View on GitHub
website/docs/11.7.0/extra/examples.mdx

Summary

Maintainability
Test Coverage
# Examples

Often the best way to learn something, is to learn from examples.
While we do not provide much examples yet, we highly appreciate any help to provide some useful examples.

## React

A simple example application using the [React bindings](https://github.com/robinweser/fela/tree/master/packages/react-fela).

```bash
git clone https://github.com/robinweser/fela.git

cd fela/examples/example-react
npm install
# starts the universal rendered application at localhost:8080
npm start

# starts the client-side application at localhost:8080
npm run client
```

**Covers:**

- Rules
- Keyframes
- Fonts
- Static Styles
- React Bindings
- Dynamic Rules
- Plugins
- Server-side Rendering

<br />

### Styleguidist

Another example that covers the usage with [react-styleguidist](https://github.com/styleguidist/react-styleguidist).

```bash
git clone https://github.com/robinweser/fela.git
cd fela/examples/example-with-styleguidist
npm install
npm run styleguide
```

## Preact

A simple example application using the [Preact bindings](https://github.com/robinweser/fela/tree/master/packages/preact-fela).
The example is the same as the [React example](#react) above.

```bash
git clone https://github.com/robinweser/fela.git

cd fela/examples/example-preact
npm install
# starts the universal rendered application at localhost:8080
npm start

# starts the client-side application at localhost:8080
npm run client
```

## Inferno

A simple example application using the [Inferno bindings](https://github.com/robinweser/fela/tree/master/packages/inferno-fela).
The example is the same as the [React example](#react) above.

```bash
git clone https://github.com/robinweser/fela.git

cd fela/examples/example-inferno
npm install
# starts the universal rendered application at localhost:8080
npm start

# starts the client-side application at localhost:8080
npm run client
```

## React Native

A simple example application using the [React bindings](https://github.com/robinweser/fela/tree/master/packages/react-fela) and the [React Native renderer](api/fela-native/renderer).

```bash
git clone https://github.com/robinweser/fela.git

cd fela/examples/example-react-native
npm install
npm start
```

Afterwards open one of the platform specific native projects and run with a simulator.

**Covers:**

- React Native
- Rules
- React Bindings
- Dynamic Rules
- Plugins