Upgrade to Pro — share decks privately, control downloads, hide ads and more …

A tale of two pods

A tale of two pods

Review the history of pods, how they have evolved, and what the next steps are.

Presented at EmberATX: https://youtu.be/1wc3a_ttTy0?t=28m18s

Robert Jackson

October 22, 2015
Tweet

More Decks by Robert Jackson

Other Decks in Programming

Transcript

  1. A Tale of Two Pods

    View full-size slide

  2. Who the heck is this guy?
    ● Ember Core Team
    ● Aptible
    ● General Open Source Addict
    twitter: rwjblue
    github: rwjblue

    View full-size slide

  3. What are pods?

    View full-size slide

  4. Great, :shipit:

    View full-size slide

  5. ● 2014-01-19
    ● “Simple”
    ● names + types
    ● non-configurable
    Pods v1.0

    View full-size slide

  6. Router.map(function() {
    this.route('post', function() {
    this.route('comments', function() {
    this.route('show');
    });
    });
    });
    Example Setup - Routes

    View full-size slide

  7. app/application/route.js
    app/application/template.hbs
    app/index/route.js
    app/index/template.hbs
    app/post/route.js
    app/post/template.hbs
    Pods v1.0 - Files

    View full-size slide

  8. app/post/index/route.js
    app/post/index/template.hbs
    app/post/comments/route.js
    app/post/comments/template.hbs
    app/post/comments/index/route.js
    app/post/comments/index/template.hbs
    Pods v1.0 - Files

    View full-size slide

  9. app/post/comments/show/route.js
    app/post/comments/show/template.hbs
    app/post/model.js
    app/post/serializer.js
    app/post/adapter.js
    app/comment/model.js
    Pods v1.0 - Files

    View full-size slide


  10. {{posts/display-post post=post}}

    app/posts/display-post/component.js
    app/posts/display-post/template.hbs
    Pods v1.0 - Local Invocation

    View full-size slide


  11. {{display-post post=post}}

    app/display-post/component.js
    app/display-post/template.hbs
    Pods v1.0 - Global Invocation

    View full-size slide

  12. ● 2014-04-07
    ● complete refactor / overhaul
    ● adds configurability
    Pods v1.5

    View full-size slide

  13. moduleNameLookupPatterns: Em.computed(function() {
    let defaults = this._super(...arguments);
    return defaults.push(this.snowflakeModules);
    }),
    Pods v1.5 - Customization

    View full-size slide

  14. Pods v1.5 - Customization
    snowflakeModules: function(name) {
    return 'snowflake/' +
    name.fullNameWithoutType + '/' +
    name.type';
    }

    View full-size slide


  15. {{posts/display-post post=post}}

    ...snip
    app/snowflake/posts/display-post/component.js
    app/snowflake/posts/display-post/template.hbs
    Pods v1.5 - Custom
    Invocation

    View full-size slide

  16. ● 2014-07-24
    ● Allows `app/components//`
    Pods v1.75

    View full-size slide


  17. {{posts/display-post post=post}}

    ...snip
    app/components/posts/display-post/component.js
    app/components/posts/display-post/template.hbs
    Pods v1.75- Local Invocation

    View full-size slide


  18. {{display-post post=post}}

    ...snip
    app/components/display-post/component.js
    app/components/display-post/template.hbs
    Pods v1.75- Global Invocation

    View full-size slide

  19. What is wrong with Pods 1.x?
    ● Inconsistent Rules
    ● Not “portable”
    ● Too much variation
    ● Melding of “UI” and “Data”
    ● Naming Conflicts
    ● Addons?

    View full-size slide

  20. Where do we go from here?

    View full-size slide

  21. Pods v2.0 - Requirements
    ● Consistent Rules
    ● Portable
    ● Separation of “UI” and “Data”
    (notice a theme?)

    View full-size slide

  22. Router.map(function() {
    this.route('post', function() {
    this.route('comments', function() {
    this.route('show');
    });
    });
    });
    Example Setup - Routes

    View full-size slide

  23. app/routes/application/route.js
    app/routes/application/template.hbs
    app/routes/index/route.js
    app/routes/index/template.hbs
    app/routes/post/route.js
    app/routes/post/template.hbs
    Pods v2.0 - Files

    View full-size slide

  24. app/routes/post/index/route.js
    app/routes/post/index/template.hbs
    app/routes/post/routes/comments/route.js
    app/routes/post/routes/comments/template.hbs
    app/routes/post/routes/comments/routes/index/route.js
    app/routes/post/routes/comments/routes/index/template.hbs
    Pods v2.0 - Files

    View full-size slide

  25. app/routes/post/routes/comments/routes/show/route.js
    app/routes/post/routes/comments/routes/show/template.hbs
    app/models/post/model.js
    app/models/post/serializer.js
    app/models/post/adapter.js
    Pods v2.0 - Files

    View full-size slide


  26. {{display-post post=post}}

    app/routes/posts/components/display-post/component.js
    app/routes/posts/components/display-post/template.hbs
    // OR
    app/routes/posts/components/display-post.{js,hbs}
    Pods v2.0 - Local Invocation

    View full-size slide


  27. {{display-post post=post}}

    app/components/display-post/component.js
    app/components/display-post/template.hbs
    Pods v2.0 - Global Invocation

    View full-size slide

  28. app/models/post.js
    // OR
    app/models/post/model.js
    app/models/post/serializer.js
    app/models/post/adapter.js
    Pods v2.0 - Data

    View full-size slide

  29. route.js
    template.hbs
    controller.js | component.js
    components/
    helpers/
    routes/
    Pods v2.0 - “UI” Level

    View full-size slide


  30. {{ember-admin::model-title model=model}}

    ... < inside node_modules/ember-admin/ >
    addon/components/model-title/component.js
    addon/components/model-title/template.hbs
    Pods v2.0 - Addon Invocation

    View full-size slide

  31. Pods v2.0 - Concepts
    ● Layer Symmetry
    ● Local Lookup
    ● Addon Support

    View full-size slide