Meteor + polymer = a perfect synthesis
0 likes474 views
The document discusses the integration of Meteor and Polymer for developing progressive web applications, highlighting features like one-way and two-way data bindings, conditional templates, and event handling. It emphasizes transitioning from Blaze to more modern practices in Meteor, and presents a case study of the Bummerl Liste project that showcases improvements in performance and structure. Overall, it advocates for component-based development in Meteor applications.
![● Square brackets ([[]]) create one-way bindings. Data
flow is downward, host-to-child, and the binding never
modifies the host property.
● Curly brackets ({{}}) create automatic bindings. Data flow
is one-way or two-way, depending whether the target
property is configured for two-way binding.
Databinding](https://image.slidesharecdn.com/meteorpolymer-160708080619/85/Meteor-polymer-a-perfect-synthesis-10-320.jpg)
Meteor + polymer = a perfect synthesis
- 1. Meteor + Polymer A perfect synthesis
- 4. Virtual Reality Progressive Web Apps Machine Learning
- 8. Using Polymer with Meteor Yes, it’s a 101!
- 10. ● Square brackets ([[]]) create one-way bindings. Data flow is downward, host-to-child, and the binding never modifies the host property. ● Curly brackets ({{}}) create automatic bindings. Data flow is one-way or two-way, depending whether the target property is configured for two-way binding. Databinding
- 11. Template repeater (dom-repeat) Similar to Blaze {{#each}} with some extensions / limitations ● Binds only to arrays, no other data structures. ● Exposes ○ item: The array item. ○ index: The index of item in the array.
- 12. Conditional Templates ● Similar to Blaze {{#if}} ● By default all stamped elements are hidden (but remain in the DOM tree). ● To disable this behavior, set the restamp property to true.
- 13. Handling events ● Bind on-tap events to functions using markup ● Or in your element definition using listeners
- 14. Adding a little bit of Meteor magic
- 15. Using reactive Data sources ● Provided by the mwcMixin ● Uses Tracker to reactively rerun code when needed ● getMeteorData capsules all your collections and exposes them through the mwcData property
- 17. {{ }}Blaze is dead, long live Handlebars!
- 18. What about Meteor best practices? ● Encourages template level subscriptions ● Good support for Flowrouter (through mwc:layout) ● Encourages the Meteor 1.3 directory structure ● Enables the definition of reusable components
- 19. Case Study: Bummerl Liste Before: Meteor 1.0 + Blaze + Bootstrap + Materialize After: Meteor 1.3 + Polymer
- 20. Folder Structure
- 21. Blazing Fast & Lightweight
- 23. Ready to get componentized? Thanks for your attention! faburem Fabian Kromer @faburem