Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Componentes nativos: uma chance de mudar o futu...
Search
Larissa Abreu
September 22, 2018
Programming
0
110
Componentes nativos: uma chance de mudar o futuro! - ABCDev 2018
Larissa Abreu
September 22, 2018
Tweet
Share
More Decks by Larissa Abreu
See All by Larissa Abreu
Defesa contra as artes das trevas - Github (2020)
larissaabreu
0
250
Sempre teste mas debug se precisar
larissaabreu
2
190
Guia prático para criação de componentes perfeitos
larissaabreu
1
190
Custom Elements Everywhere
larissaabreu
0
210
JavaScript e o teste filosofal
larissaabreu
0
84
Web Components: fazendo do futuro uma realidade através do JS - Brasília
larissaabreu
0
120
Web Components: fazendo do futuro uma realidade através do JS
larissaabreu
0
72
Dando poder ao seu CSS através de Custom Properties
larissaabreu
0
100
Componentes nativos: uma chance de mudar o futuro!
larissaabreu
0
200
Other Decks in Programming
See All in Programming
大公開!iOS開発の悩みトップ5 〜iOSDC Japan 2024〜
ryunakayama
0
190
Method Swizzlingを行うライブラリにおけるマルチモジュール設計
yoshikma
0
120
Jakarta EE meets AI
ivargrimstad
1
530
Some more adventure of Happy Eyeballs
coe401_
2
190
いつか使える ObjectSpace / Maybe useful ObjectSpace
euglena1215
2
140
いまから追い上げる、Jetpack Compose トレーニング
nyafunta9858
0
600
XStateでReactに秩序を与えたい
gizm000
0
730
The Shape of a Service Object
inem
0
520
全部見せます! クラシルリワードのSwiftTesting移行プロジェクト
uetyo
0
210
Ebitengineの1vs1ゲーム WebRTCの活用
ponyo877
0
380
GenU導入でCDKに初挑戦し、悪戦苦闘した話
hideg
0
170
Boost Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
500
Featured
See All Featured
Gamification - CAS2011
davidbonilla
79
5k
For a Future-Friendly Web
brad_frost
174
9.3k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
27
7.4k
The Cult of Friendly URLs
andyhume
76
6k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
663
120k
Producing Creativity
orderedlist
PRO
340
39k
Code Review Best Practice
trishagee
62
16k
Build The Right Thing And Hit Your Dates
maggiecrowley
30
2.3k
Side Projects
sachag
451
42k
VelocityConf: Rendering Performance Case Studies
addyosmani
322
23k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
326
21k
BBQ
matthewcrist
83
9.2k
Transcript
uma chance de mudar o futuro! Componentes nativos
@TheSweet_Lari Gamer, future Suicide Girl and Front-end Dev Larissa Abreu
@LarissaAbreu larissaabreu.github.io
Por onde começar?
None
Tecnologias de Base
None
De onde vem? W3C (World Wide Web Consorcium)
Tim Berners-Lee Web HTML Padrões
Quem faz parte? Google Apple Mozilla Microsoft
Vários working groups CSS HTML API (JS)
Working groups? Membros das empresas Membros do próprio W3C Especialistas
convidados
Como é a evolução das tecnologias de base no W3C?
jQuery -> Query Selector Ramda -> Features funcionais* * Está
em discussão junto ao TC-39 para ser implementado no core
Pré-processadores -> Custom Properties * Frameworks -> Grid layout *
Variáveis nativas
Nem tudo são flores
Como funciona o processo atualmente? https://www.w3.org/2017/Process-20170301/
None
None
https://www.w3.org/Style/CSS/current-work
https://www.w3.org/standards/history/css-variables - https://www.w3.org/TR/css-variables-1/ Custom properties 2012 2013 2015 2018 (First
Working Draft) (Working Draft) (Candidate Recomendation) CSS CUSTOM PROPERTIES FOR CASCADING VARIABLES MODULE LEVEL 1 ?
https://caniuse.com/#feat=css-variables
Quanto tempo levará para o Virtual Dom ser nativo?
None
Grande problema do tempo
Como resolver? Deixando os desenvolvedores criarem features nativas sozinhos
Prototype Transpiler Polyfill
Houdini * Atualmente no estágio anterior ao First Working Draft,
Editor Draft
Como criar novas tags de forma nativa?
<abcdev-2018>
import {html, PolymerElement} from '@polymer/polymer/polymer-element.js'; class Abcdev2018 extends PolymerElement {
}; static get template() { return html` <h1>Olá ABC Dev!</h1> `; } customElements.define(‘abcdev-2018’, Abcdev2018); Custom Elements Template Shadow DOM
None
2013
youtube.com/watch?v=7Q0-E_rZ_Cc&t
What is Polymer? By Polymer Team
None
Cross Stack?
None
None
Custom Elements Everywhere custom-elements-everywhere.com/
Who?
+6000 Components
youtube.com/new
twitter.com/AJStacy06/status/857628546507968512
Até onde podemos chegar com os componentes nativos?
None
Thanks! #UseThePlatform @TheSweet_Lari @LarissaAbreu larissaabreu.github.io