In this episode, I talk about searching for the right directory structure for Meteor/React apps.

Directory Structure

feature1
- components
- containers
- layouts
- pages
feature2
- components
- pages
common
- components
- layouts
- pages
  • Components are “dumb” presentational components that take in props and spit out HTML. They may or may not be functional stateless components.
  • Containers are “smart” components that handle data loading (subscribing and Minimongo calls) but don’t contain any HTML of their own.
  • Layouts are wrappers around components. They may or may not handle data.
  • Pages are top-level components that are called by the router. They may or may not handle data.

In other words, layouts and pages can also be containers, but don’t have to be (note: maybe this could be communicated via a file naming convention somehow?).

Modules

I haven’t yet had time to look at the modules system coming soon with Meteor 1.3. I’ll definitely post another video as soon as I’ve had a chance to!

Resources