SlideShare a Scribd company logo
1 of 15
Download to read offline
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-organizer;
● Technovation Challenge coach;
● Polymer lover;
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 --save Polymer#^1.0.0
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></script>
</dom-module>
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

More Related Content

Similar to Polymer | From Zero to Hero

Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...
Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...
Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...mCloud
 
Inside neutron 2
Inside neutron 2Inside neutron 2
Inside neutron 2Robin Gong
 
Hire Magento 2 developer India, Call us for more
Hire Magento 2 developer India, Call us for more Hire Magento 2 developer India, Call us for more
Hire Magento 2 developer India, Call us for more AResourcePool
 
The productive developer guide to Angular 2
The productive developer guide to Angular 2The productive developer guide to Angular 2
The productive developer guide to Angular 2Maurice De Beijer [MVP]
 
A WebGL scene in 30 mins
A WebGL scene in 30 minsA WebGL scene in 30 mins
A WebGL scene in 30 minsJens Arps
 
QCon SF 2017 - Microservices: Service-Oriented Development
QCon SF 2017 - Microservices: Service-Oriented DevelopmentQCon SF 2017 - Microservices: Service-Oriented Development
QCon SF 2017 - Microservices: Service-Oriented DevelopmentAmbassador Labs
 
Joomla 3 Component programmeren met RAD - Joomladagen 2014
Joomla 3 Component programmeren met RAD - Joomladagen 2014Joomla 3 Component programmeren met RAD - Joomladagen 2014
Joomla 3 Component programmeren met RAD - Joomladagen 2014Peter Martin
 
Workshop: Introduction to Web Components & Polymer
Workshop: Introduction to Web Components & Polymer Workshop: Introduction to Web Components & Polymer
Workshop: Introduction to Web Components & Polymer John Riviello
 
ICSEC2016-Policy management for docker ecosystem
ICSEC2016-Policy management for docker ecosystemICSEC2016-Policy management for docker ecosystem
ICSEC2016-Policy management for docker ecosystemBukhary Ikhwan Ismail
 
The productive developer guide to Angular 2
The productive developer guide to Angular 2The productive developer guide to Angular 2
The productive developer guide to Angular 2Maurice De Beijer [MVP]
 
Azure AD B2C Webinar Series: Custom Policies Part 3 Troubleshooting
Azure AD B2C Webinar Series: Custom Policies Part 3 TroubleshootingAzure AD B2C Webinar Series: Custom Policies Part 3 Troubleshooting
Azure AD B2C Webinar Series: Custom Policies Part 3 TroubleshootingVinu Gunasekaran
 
Continuous Delivery with TFS msbuild msdeploy
Continuous Delivery with TFS msbuild msdeployContinuous Delivery with TFS msbuild msdeploy
Continuous Delivery with TFS msbuild msdeployPeter Gfader
 
Polymer 1.0: easier, faster, better!
Polymer 1.0: easier, faster, better!Polymer 1.0: easier, faster, better!
Polymer 1.0: easier, faster, better!Maria Clara Santana
 
Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]
Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]
Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]Mahadiputra S
 
Bring-your-ML-Project-into-Production-v2.pdf
Bring-your-ML-Project-into-Production-v2.pdfBring-your-ML-Project-into-Production-v2.pdf
Bring-your-ML-Project-into-Production-v2.pdfLiang Yan
 
Work with Developers for Fun and Progress - AppSec California
Work with Developers for Fun and Progress - AppSec CaliforniaWork with Developers for Fun and Progress - AppSec California
Work with Developers for Fun and Progress - AppSec Californialeifdreizler
 

Similar to Polymer | From Zero to Hero (20)

Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...
Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...
Developers’ mDay 2021: Andrea Bjelogrlić, Sysbee – Tips, tricks and debugging...
 
Inside neutron 2
Inside neutron 2Inside neutron 2
Inside neutron 2
 
Hire Magento 2 developer India, Call us for more
Hire Magento 2 developer India, Call us for more Hire Magento 2 developer India, Call us for more
Hire Magento 2 developer India, Call us for more
 
The productive developer guide to Angular 2
The productive developer guide to Angular 2The productive developer guide to Angular 2
The productive developer guide to Angular 2
 
A WebGL scene in 30 mins
A WebGL scene in 30 minsA WebGL scene in 30 mins
A WebGL scene in 30 mins
 
QCon SF 2017 - Microservices: Service-Oriented Development
QCon SF 2017 - Microservices: Service-Oriented DevelopmentQCon SF 2017 - Microservices: Service-Oriented Development
QCon SF 2017 - Microservices: Service-Oriented Development
 
Joomla 3 Component programmeren met RAD - Joomladagen 2014
Joomla 3 Component programmeren met RAD - Joomladagen 2014Joomla 3 Component programmeren met RAD - Joomladagen 2014
Joomla 3 Component programmeren met RAD - Joomladagen 2014
 
Workshop: Introduction to Web Components & Polymer
Workshop: Introduction to Web Components & Polymer Workshop: Introduction to Web Components & Polymer
Workshop: Introduction to Web Components & Polymer
 
ICSEC2016-Policy management for docker ecosystem
ICSEC2016-Policy management for docker ecosystemICSEC2016-Policy management for docker ecosystem
ICSEC2016-Policy management for docker ecosystem
 
Meteor
MeteorMeteor
Meteor
 
The productive developer guide to Angular 2
The productive developer guide to Angular 2The productive developer guide to Angular 2
The productive developer guide to Angular 2
 
Azure AD B2C Webinar Series: Custom Policies Part 3 Troubleshooting
Azure AD B2C Webinar Series: Custom Policies Part 3 TroubleshootingAzure AD B2C Webinar Series: Custom Policies Part 3 Troubleshooting
Azure AD B2C Webinar Series: Custom Policies Part 3 Troubleshooting
 
Keymetrics pm2
Keymetrics pm2Keymetrics pm2
Keymetrics pm2
 
Continuous Delivery with TFS msbuild msdeploy
Continuous Delivery with TFS msbuild msdeployContinuous Delivery with TFS msbuild msdeploy
Continuous Delivery with TFS msbuild msdeploy
 
Polymer 1.0: easier, faster, better!
Polymer 1.0: easier, faster, better!Polymer 1.0: easier, faster, better!
Polymer 1.0: easier, faster, better!
 
Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]
Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]
Mikrotik Network Simulator (MUM Presentation Material 2013) [COPY]
 
Caffe2 on Android
Caffe2 on AndroidCaffe2 on Android
Caffe2 on Android
 
Bring-your-ML-Project-into-Production-v2.pdf
Bring-your-ML-Project-into-Production-v2.pdfBring-your-ML-Project-into-Production-v2.pdf
Bring-your-ML-Project-into-Production-v2.pdf
 
Bug Tracking System
Bug Tracking SystemBug Tracking System
Bug Tracking System
 
Work with Developers for Fun and Progress - AppSec California
Work with Developers for Fun and Progress - AppSec CaliforniaWork with Developers for Fun and Progress - AppSec California
Work with Developers for Fun and Progress - AppSec California
 

More from Maria Clara Santana

Web Apps: to infinity and beyond #cpbr9
Web Apps: to infinity and beyond #cpbr9Web Apps: to infinity and beyond #cpbr9
Web Apps: to infinity and beyond #cpbr9Maria Clara Santana
 
Bulding the web's future with Polymer + es6
Bulding the web's future with Polymer + es6Bulding the web's future with Polymer + es6
Bulding the web's future with Polymer + es6Maria Clara Santana
 
Why we need to talk about women and technology?
Why we need to talk about women and technology?Why we need to talk about women and technology?
Why we need to talk about women and technology?Maria Clara Santana
 
Pretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and PolymerPretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and PolymerMaria Clara Santana
 

More from Maria Clara Santana (6)

Web Apps: to infinity and beyond #cpbr9
Web Apps: to infinity and beyond #cpbr9Web Apps: to infinity and beyond #cpbr9
Web Apps: to infinity and beyond #cpbr9
 
Bulding the web's future with Polymer + es6
Bulding the web's future with Polymer + es6Bulding the web's future with Polymer + es6
Bulding the web's future with Polymer + es6
 
Why we need to talk about women and technology?
Why we need to talk about women and technology?Why we need to talk about women and technology?
Why we need to talk about women and technology?
 
Chrome Developer Tools
Chrome Developer ToolsChrome Developer Tools
Chrome Developer Tools
 
Polymer: welcome to the future!
Polymer: welcome to the future!Polymer: welcome to the future!
Polymer: welcome to the future!
 
Pretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and PolymerPretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and Polymer
 

Recently uploaded

My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitecturePixlogix Infotech
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Enterprise Knowledge
 
APIForce Zurich 5 April Automation LPDG
APIForce Zurich 5 April  Automation LPDGAPIForce Zurich 5 April  Automation LPDG
APIForce Zurich 5 April Automation LPDGMarianaLemus7
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Patryk Bandurski
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticscarlostorres15106
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Wonjun Hwang
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024The Digital Insurer
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxhariprasad279825
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...shyamraj55
 

Recently uploaded (20)

My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024
 
APIForce Zurich 5 April Automation LPDG
APIForce Zurich 5 April  Automation LPDGAPIForce Zurich 5 April  Automation LPDG
APIForce Zurich 5 April Automation LPDG
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
Hot Sexy call girls in Panjabi Bagh 🔝 9953056974 🔝 Delhi escort Service
Hot Sexy call girls in Panjabi Bagh 🔝 9953056974 🔝 Delhi escort ServiceHot Sexy call girls in Panjabi Bagh 🔝 9953056974 🔝 Delhi escort Service
Hot Sexy call girls in Panjabi Bagh 🔝 9953056974 🔝 Delhi escort Service
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptx
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
 

Polymer | From Zero to Hero