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(new tab).

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

Styleguidist

Another example that covers the usage with react-styleguidist(new tab).

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(new tab). The example is the same as the React example above.

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(new tab). The example is the same as the React example above.

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(new tab) and the React Native renderer.

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