Skip to content

Instantly share code, notes, and snippets.

@dgeb
Last active September 9, 2016 10:48
Show Gist options
  • Save dgeb/396fed953184acb04f4f to your computer and use it in GitHub Desktop.
Save dgeb/396fed953184acb04f4f to your computer and use it in GitHub Desktop.

This is a pretty thorough listing of module/pod structures that I've explored in the past couple weeks.

These are fairly unfiltered (#nofilter) and presented in the order that I've reviewed / created them, not by order of preference.

Note that the classic structure is referred to as "CS".

A) New Pods Structure, or "NPS"

Repeats CS at every level that needs differentiation.

app
  components
    list-paginator
      component.js
      template.hbs
  controllers
  helpers
  models
    posts
      model.js
      serializer.js
      adapter.js
  routes
    posts
      components
        post-editor
          component.js
          template.hbs
          components
            post-editor-button
              component.js
              template.hbs
        post-viewer
          component.js
          template.hbs
      helpers
        capitalize.js
        titleize.js
      routes
        new
          components
            new-post
              component.js
              template.hbs
          route.js
          template.hbs
      template.hbs
  services
  templates
  app.js
  router.js

Uses a + prefix for every route. Pods allowed at every route. Top level could be either +app or modules.

+app
  +posts
    +new
      components
        new-post
          component.js
          template.hbs
      route.js
      template.hbs
    components
      post-editor
        component.js
        template.hbs
      post-viewer
        component.js
        template.hbs
  components
    paginator
      component.js
      template.hbs
  controllers
  helpers
  models
  services
  templates
  app.js
  router.js

CS at the root. Type can be changed at nested levels with a + prefix.

app
  components
    list-paginator
      component.js
      template.hbs
  controllers
  helpers
  models
    posts
      model.js
      serializer.js
      adapter.js
  routes
    posts
      +components
        post-editor
          component.js
          template.hbs
          post-editor-button
            component.js
            template.hbs
          +helpers
            calculate-post-title.js
        post-viewer
          component.js
          template.hbs
      +helpers
        capitalize.js
        titleize.js
      new
        +components
          new-post
            component.js
            template.hbs
        route.js
        template.hbs
      template.hbs
  services
  templates
  app.js
  router.js

Use nested namespaces for everything and finish with a module name of the form ${name}-${type}.

modules
  posts
    new
      new-post-component.js
      new-post-template.hbs
    post-editor
      post-editor-button-component.js
      post-editor-button-template.hbs
      calculate-post-title-helper.js
    capitalize-helper.js
    new-route.js
    new-template.hbs
    post-editor-component.js
    post-editor-template.hbs
    post-viewer-component.js
    post-viewer-template.hbs
    titleize-helper.js
  app.js
  list-paginator-component.js
  list-paginator-template.hbs
  posts-adapter.js
  posts-model.js
  posts-serializer.js
  posts-route.js
  posts-template.hbs
  router.js

Use nested namespaces for everything and finish with a module name of the form ${name}/${type}.

modules
  posts
    new
      new-post
        component.js
        template.hbs
      route.js
      template.hbs
    post-editor
      post-editor-button
        component.js
        template.hbs
      calculate-post-title
        helper.js
      component.js
      template.hbs
    post-viewer
      component.js
      template.hbs
    capitalize
      helper.js
    titleize
      helper.js
    adapter.js
    model.js
    serializer.js
    route.js
    template.hbs
  list-paginator
    component.js
    template.hbs
  app.js
  router.js

D + E can coexist:

modules
  posts
    new
      new-post
        component.js
        template.hbs
      route.js
      template.hbs
    post-editor
      post-editor-button
        component.js
        template.hbs
      calculate-post-title-helper.js
      component.js
      template.hbs
    post-viewer
      component.js
      template.hbs
    capitalize-helper.js
    titleize-helper.js
    adapter.js
    model.js
    serializer.js
    route.js
    template.hbs
  list-paginator
    component.js
    template.hbs
  app.js
  router.js

G) Modules grouped by -type

A convenience form that composes down to D.

modules
  -component
    list-paginator.js
  -template
    list-paginator.hbs
    posts.hbs
  -adapter
    posts.js
  -model
    posts.js
  -route
    posts.js
  -serializer
    posts.js
  posts
    -helper
      capitalize.js
      titleize.js
    -route
      new.js
    -template
      new.hbs
      post-editor.hbs
      post-viewer.hbs
    -component
      post-editor.js
      post-viewer.js
    new
      -component
        new-post.js
      -template
        new-post.hbs
    post-editor
      -component
        post-editor-button.js
      -template
        post-editor-button.hbs
      -helper
        calculate-post-title.js
  app.js
  router.js

H) Modules grouped by name-

Another convenience form that composes down to D.

modules
  posts
    new
      new-post-
        component.js
        template.hbs
    post-editor
      post-editor-button-
        component.js
        template.hbs
      calculate-post-title-
        helper.js
    capitalize-
      helper.js
    new-
      route.js
      template.hbs
    post-editor-
      component.js
      template.hbs
    post-viewer-
      component.js
      template.hbs
    titleize-
      helper.js
  app.js
  list-paginator-
    component.js
    template.hbs
  posts-
    adapter.js
    model.js
    serializer.js
    route.js
    template.hbs
  router.js

Note that E-H are all compatible and could compose down to the same module form represented by D.

@rtm
Copy link

rtm commented Sep 9, 2016

You left off the alternative of "let people do what they want".

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment