Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Guia para se tornar uma Pessoa Desenvolvedora F...
Search
Afonso Pacifer
May 15, 2024
Programming
0
86
Guia para se tornar uma Pessoa Desenvolvedora Front-end Especialista
Afonso Pacifer
May 15, 2024
Tweet
Share
More Decks by Afonso Pacifer
See All by Afonso Pacifer
Developer Experience (DevEx) no mundo Front-End: Do Ruby ao Next.js
afonsopacifer
0
70
Open Source e Developer Experience
afonsopacifer
1
110
Conhecendo a área de Developer Experience (DevEx)
afonsopacifer
0
83
Do Zero ao Sênior Apenas com Projetos Open Source
afonsopacifer
1
90
Recriando o React do Zero em 10 minutos
afonsopacifer
0
94
O CAMINHO PARA SE TORNAR UM(A) MESTRE(A) DOS ESTILOS COM CSS LV 5.
afonsopacifer
0
200
HTML 5.3: O que existe além de a11y e SEO?
afonsopacifer
0
180
State of JS 2022
afonsopacifer
0
300
Welcome CSS LV5
afonsopacifer
0
230
Other Decks in Programming
See All in Programming
Navigation 3: 적응형 UI를 위한 앱 탐색
fornewid
1
460
まだ間に合う!Claude Code元年をふりかえる
nogu66
5
900
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
manfredsteyer
PRO
0
180
PC-6001でPSG曲を鳴らすまでを全部NetBSD上の Makefile に押し込んでみた / osc2025hiroshima
tsutsui
0
190
Kotlin Multiplatform Meetup - Compose Multiplatform 외부 의존성 아키텍처 설계부터 운영까지
wisemuji
0
130
Graviton と Nitro と私
maroon1st
0
140
GoLab2025 Recap
kuro_kurorrr
0
780
AtCoder Conference 2025
shindannin
0
620
LLMで複雑な検索条件アセットから脱却する!! 生成的検索インタフェースの設計論
po3rin
4
970
Combinatorial Interview Problems with Backtracking Solutions - From Imperative Procedural Programming to Declarative Functional Programming - Part 2
philipschwarz
PRO
0
120
Claude Codeの「Compacting Conversation」を体感50%減! CLAUDE.md + 8 Skills で挑むコンテキスト管理術
kmurahama
1
640
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
panda728
PRO
39
26k
Featured
See All Featured
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
57
40k
KATA
mclloyd
PRO
33
15k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
3k
Fireside Chat
paigeccino
41
3.8k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
200
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
0
310
Utilizing Notion as your number one productivity tool
mfonobong
2
190
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
110
Faster Mobile Websites
deanohume
310
31k
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
91
Joys of Absence: A Defence of Solitary Play
codingconduct
1
260
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
115
94k
Transcript
afonsopacifer.github.io Guia para se tornar uma Pessoa Desenvolvedora 1 Front
end Especialista Descolada
Afonso Pacifer @afonsopacifer afonsopacifer.github.io DevRel & Front-End Specialist 2
3 SP
None
5 https://roadmap.sh/frontend
6
Sem Roadmaps E sem frameworks 7
8 ```Uma das melhores decisões da minha carreira como desenvolvedor
foi ir além de apenas usar ferramentas…`` - Afonso Pacifer
Como faz? 9
2014 4 anos de carreira Full Stack
Fr on t in BH
Tracking.js https://trackingjs.com/
https://trackingjs.com/
None
Eu me demiti para Estudar 15
16
Write code Every Day 17
18
19
O Básico HTML === Semântica?
Semântica é o estudo do signi fi cado. [1] Incide
sobre a relação entre signi fi cantes, tais como palavras, frases, sinais e símbolos, e o que eles representam, a sua denotação. Semântica
Importa Para quem?
Existe diferença Div X Button?
Live Code https://codepen.io/afonsopacifer/pen/BaPmKXr • Aparência • UI feedbacks (Hover, Active,
etc…) • Acessível via teclado (tabIndex) •Leitor de tela (Wai-Aria) •Evento click mapeado para teclado
Sobre empatia A hora de criar um componente que não
existe no HTML
CSS Não usar framework para aprender
Aprendi a Ler a especificação 27
Achei algo interessante 28
CSS GRID Layout 29 2015
30 2/2
31
32
33
34
35
CSS Das Ruas 36
Jogos Apenas Com CSS 37 counter-increment: score; content: "Score "counter(score)"/50";
.egg-check:checked + .score-up
38
Me Tornei um Evangelista CSS 39
Eu não Sabia Javascript 40
Mas Eu Sabia aprender 41
Referencias De Front Usavam Node.js 42
Front in Vale 43
44
Banana CSS https://github.com/bananacss 🍌 The Brazilian CSS superset.
46
47 E o Browser?
Millenium.js https://github.com/millenniumjs 🚀 Render your front-end in less than 12
parsecs.
https://github.com/millenniumjs
50 Prog. Funcional?
https://github.com/burnoutjs 🎮 The 2D game engine for manage collisions.
https://github.com/burnoutjs
53 Testes, Isomorfismo?
https://github.com/afonsopacifer/nomsjs N.O.M.s 🔮 Universal/isomorphic javascript unit tests for witches.
https://github.com/afonsopacifer/nomsjs
Por fim 56
Mercado de Trabalho? 57
Hard Skills? 58
59
60 N.O.M.s Dev Descolado
Javascript Das Ruas 61
Reddit 62
Soft Skills 63
Comunidades 64
A comunidade mudou a minha vida 65
66
67 Developer Relations
68 ```Uma das melhores decisões da minha carreira como desenvolvedor
foi ir além de apenas usar ferramentas, eu decidi tentar criá-las`` - Afonso Pacifer
Reinventar a roda? 69
@afonsopacifer Obrigado Dev Tec afonsopacifer.github.io 70