pseudocms/app-api — pull request #17 by pseudomuto (2014-10-11 17:31:04+00:00)
Title: Preparing for UI Components

Adding react, jest and flux to the project and setting up for the UI.

# Non-API Endpoints

I've separated `ApiController` from `ApplicationController`. UI controllers will inherit `ApplicationController` which includes CSRF protection and other standard rails things like session, etc. `ApiController` continues to use the stripped down version of the rails pipeline and should be used by all API controllers.

# JavaScript Modules

JS throughout this project uses CommonJS modules to avoid cluttering the global namespace and to declare/manage dependencies explicitly.

This posed a few problems with react, since I wanted to be able to render react components without having it in the global namespace (making `React.renderComponent` unavailable).

Ultimately I resolved this issue by making a helper that compiles it's body to JSX and then adds a serialized version of the component to the `reactComponents` array. This array is rendered and cleared on every page load (turbolinks or otherwise).

## Using React Components in Views

```ruby
<%= react do %>

Welcome

<% end %>
```

The will use the `Reactor` class to compile this JSX into a react component. It will then add a div with a random id and a script that tells the page to render the component on `page:load` or document ready (depending if it's a turbolinks page view or not).

Nesting components is fully supported.

## Tests

Since I'm using React and Flux, it just made sense to use Jest as the testing framework. Standard conventions have been followed for location, etc. of test files.

You can run the JS tests using `npm test` or `rake test:js`. The default rake task has been modified to include the js test suite.