FROM ZERO TO HERO
+MariaClaraSantana1
polymer
(Photo: http://bit.ly/1huNOEX)
About me
Maria Clara Santana
● Computer Engineering student at UFAL;
● FrontEnd Dev at Clip;
● GDG and WTM Maceió co-organ...
Agenda
#1 Overview
#2 Installing
#3 Coding
Photo: http://bit.ly/1CeBPyN
(Photo: http://bit.ly/1d2I81R)
WEB COMPONENTS
(Logo: http://showmethecode.es/)
Step #1: install dependencies;
Getting started
Step #2: get the elements;
Getting started
$ bower install polymerelements/<element-name>
$ bower init
$bower install --sa...
Step #3: set a simple server;
Getting started
Python 2
$ python -m SimpleHTTPServer
Python 3
$ python -m http.server
Step #4: build your own customized element;
Getting started
<dom-module>
<style></style>
<template></template>
<script></s...
Step #5: put all the elements together;
Step #6: create your layout;
Step #7: power it with the elements;
Getting started
Final step: rock it!
Getting started
(Photo: http://bit.ly/1Ee2133)
</thank-you>
+MariaClaraSantana1
github.com/clarasantana
@olarclara
Polymer | From Zero to Hero
Polymer | From Zero to Hero
of 15

Polymer | From Zero to Hero

Those slides are a base for a codelab teaching Polymer from zero to hero.
Published on: Mar 4, 2016
Published in: Technology      
Source: www.slideshare.net


Transcripts - Polymer | From Zero to Hero

  • 1. FROM ZERO TO HERO +MariaClaraSantana1 polymer (Photo: http://bit.ly/1huNOEX)
  • 2. About me Maria Clara Santana ● Computer Engineering student at UFAL; ● FrontEnd Dev at Clip; ● GDG and WTM Maceió co-organizer; ● Technovation Challenge coach; ● Polymer lover;
  • 3. Agenda #1 Overview #2 Installing #3 Coding
  • 4. Photo: http://bit.ly/1CeBPyN
  • 5. (Photo: http://bit.ly/1d2I81R) WEB COMPONENTS
  • 6. (Logo: http://showmethecode.es/)
  • 7. Step #1: install dependencies; Getting started
  • 8. Step #2: get the elements; Getting started $ bower install polymerelements/<element-name> $ bower init $bower install --save Polymer#^1.0.0
  • 9. Step #3: set a simple server; Getting started Python 2 $ python -m SimpleHTTPServer Python 3 $ python -m http.server
  • 10. Step #4: build your own customized element; Getting started <dom-module> <style></style> <template></template> <script></script> </dom-module>
  • 11. Step #5: put all the elements together; Step #6: create your layout; Step #7: power it with the elements; Getting started
  • 12. Final step: rock it! Getting started (Photo: http://bit.ly/1Ee2133)
  • 13. </thank-you> +MariaClaraSantana1 github.com/clarasantana @olarclara

Related Documents