Meteor + React example app

react
1

Hi,

I’ve been playing with the new React and Meteor integration and created a boilerplate app extracted from my bigger app.

It can be found here: https://github.com/optilude/meteor-react-example

It demonstrates:

  • Using the react package to integrate Meteor and React
  • Fetching data from reactive Meteor data sources using the ReactMeteorData
    mixin and the getMeteorData() method
  • Routing using ReactRouter
  • A basic UI using Twitter Bootstrap and ReactBootstrap
  • Login, change password, enrollment emails and user management using the Meteor
    accounts system
  • ES6 syntax using the Babel transpiler (.es6.js files) and ReactJS’
    transpiler (.jsx files)
  • Tests using Velocity.
  • Typed collections / validation using aldeed:collection2.
  • Client- and server-side dependencies loaded from NPM and served with
    browserify.
  • JSHint configuration to allow editors like Sublime Text or Atom to warn
    about potential problems early

I’d be grateful for any feedback on the patterns explored here.

Martin

8 Likes
2

@optilude This looks awesome! Was wondering if you could give some examples of how you might test this code? It look like the tests are all the default ones. Might not be the point of the post but just wondering! Thanks!

3

Hi,

The tests are integration tests so they have a meteor sandbox running. You can access eg Components or Collections in a test case. Look at the Velocity Jasmine docs for more details.

Martin

—
Sent from Mailbox

4

Heads up: the code has been updated to use universe:modules and SystemJS to support ES6 module export and import syntax. This avoids all kinds of file load-order pain.

5

@optilude Any idea of how to use universe:modules in Velocity tests? Without System.import('myModule').then(function(module) {}) …