Abordagem da camada de elementos oferecida pelo Polymer. Iremos conceitualizar, ver exemplos de elementos criados com Polymer, ver os tipos de elementos oferecidos pela biblioteca e muito mais. Sem dúvidas, após esta palestra, você ficará se coçando para criar elementos com todo o poder que o Polymer tem a oferecer.

1. Polymer Elements
@obetomuniz

2. Beto Muniz
@obetomuniz

3. meliuz.com.br

4. minasdev.org

5. braziljs.org

6. webcomponets.org

8. Mas primeiro...
@obetomuniz

9. @obetomuniz

10. Ok! E o que é o Polymer?
@obetomuniz

11. E o que é o Polymer?
@obetomuniz

12. @obetomuniz
E o que é o Polymer?

13. @obetomuniz
E o que é o Polymer?

15. E o que o Polymer não é?
@obetomuniz

16. Um polyfill
@obetomuniz

18. @obetomuniz

19. O Material Design
@obetomuniz

22. O que é o Polymer Elements?
@obetomuniz

24. @obetomuniz

26. @obetomuniz

27. @obetomuniz

28. Core Elements
&
Paper Elements
@obetomuniz

29. Core Elements
Estrutura
<core-scaffold>
<core-toolbar>
<core-header-panel>
•••
Animação
<core-animation>
<core-animation-keyframe>
<core-animation-prop>
Data
<core-ajax>
<core-xhr>
<core-localstorage>
Outros
<core-a11y-keys>
<core-splitter>
<core-drag-drop>

30. <core-scaffold>
@obetomuniz

31. @obetomuniz
<core-ajax>

32. <core-drag-drop>
@obetomuniz

33. Paper Elements
<paper-slider>
<paper-tabs>
<paper-button>
<paper-dialog>
<paper-progress>
<paper-input>
<paper-dropdown>
•••

34. <paper-slider>
@obetomuniz

35. @obetomuniz
<paper-input>

36. @obetomuniz
<paper-dropdown>

37. Beleza…Mas porque o Polymer?
@obetomuniz

38. @obetomuniz
Shadow DOM
Custom Element
Template
HTML Import

39. Element API por Default
@obetomuniz

40. Acessibilidade
@obetomuniz

41. Declarativo
@obetomuniz

42. Extensível
@obetomuniz

43. Frameworkless
@obetomuniz

44. Testável
@obetomuniz

45. Vamos componentizar!
@obetomuniz

46. DÚVIDAS?

47. bit.ly/polymer-elements

48. Muito Obrigado!