Upgrade to Pro — share decks privately, control downloads, hide ads and more …

CSS in JavaScripto, the anti-pattern that is good

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Igor Halfeld Igor Halfeld
October 12, 2019
Programming
110
1

CSS in JavaScripto, the anti-pattern that is good

Avatar for Igor Halfeld

Igor Halfeld

October 12, 2019

More Decks by Igor Halfeld

See All by Igor Halfeld
Modular monoliths with fastify
Avatar for Igor Halfeld igorhalfeld
0
200
How to migrate legacy frontend?
Avatar for Igor Halfeld igorhalfeld
1
130
Patterns for perfect components in Vue.js
Avatar for Igor Halfeld igorhalfeld
0
120
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
70
Step by step I followed a career in software
Avatar for Igor Halfeld igorhalfeld
0
710
Using AI to create memes
Avatar for Igor Halfeld igorhalfeld
0
540
Deninho, the TS children
Avatar for Igor Halfeld igorhalfeld
1
220
Micro Front-ends, what they don't tell you
Avatar for Igor Halfeld igorhalfeld
0
400
Front-end Clean Architecture
Avatar for Igor Halfeld igorhalfeld
2
300

Other Decks in Programming

See All in Programming
AIと共に生きる技術選定 2026
Avatar for Sugar Sato sgash708
0
110
Spec Driven Development | AI Summit Vilnius
Avatar for Daniel Sogl danielsogl
PRO
1
120
Cache-moi si tu peux : patterns et pièges du cache en production - Devoxx France 2026 - Conférence
Avatar for Sébastien LECACHEUR slecache
0
310
t *testing.T は どこからやってくるの？
Avatar for Kotaro Otaka otakakot
1
780
[RubyKaigi 2026] Require Hooks
Avatar for Vladimir Dementyev palkan
1
240
AWSコミュニティ活動は顧客のクラウド推進に効くのか / Do AWS community activities help customers adopt the cloud?
Avatar for shiro seike seike460
PRO
0
150
感情を設計する
Avatar for nakamichi ichimichi
5
1.6k
CursorとClaudeCodeとCodexとOpenCodeを実際に比較してみた
Avatar for Terisuke terisuke
1
490
瑠璃の宝石に学ぶ技術の声の聴き方 / 【劇場版】アニメから得た学びを発表会2026 #エンジニアニメ
Avatar for mazrean mazrean
0
300
Kingdom of the Machine
Avatar for yui-knk yui_knk
2
980
Spec-driven Development: How AI Changes Everything (And Nothing)
Avatar for Simon Martinelli simas
PRO
0
350
의존성 주입과 모듈화
Avatar for Sungyong An fornewid
0
150

Featured

See All Featured
A Guide to Academic Writing Using Generative AI - A Workshop
Avatar for Kenji Saito ks91
PRO
1
280
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
220
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
750
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
3
3.3k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.4k
How Fast Is Fast Enough? [PerfNow 2025]
Avatar for Tammy Everts tammyeverts
3
540
SEO in 2025: How to Prepare for the Future of Search
Avatar for Michael King ipullrank
3
3.4k
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon Słowik szymonslowik
1
1k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
Avatar for Aleyda Solis aleyda
1
1.9k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
199
73k
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
Avatar for Helen Beal helenjbeal
1
170

Transcript

  1. CSS in JavaScripto O anti-pattern que deu certo

  2. Por que Anti-Pattern?

  3. None

  4. Quais os problemas do CSS?

  5. Manutenibilidade Escalabilidade Regras de CSS são globais

  6. Essa talk é pra te mostrar como hoje em dia

    a gente consegue resolver isso… …não é nada que o CSS não resolva, mas que junto com a DX te ajude a desenvolver

  7. Igor Halfeld Software Engineer & Consultancy igorluiz.me - @IgorHalfeld

  8. Como resolver o problema? Precisamos evoluir o CSS junto com

    a web…

  9. Vamos resolver o problema com javascript, o que pode dar

    errado?

  10. Afinal o javascript já resolveu uns problemas do HTML.

  11. None

  12. Virgulas CamelCase Números Strings

  13. Como usar?

  14. CSS Inline

  15. Bibliotecas! JSS, Glamor e Styled Components

  16. JSS

  17. Glamor

  18. Styled C.

  19. DEMO

  20. Obrigado! igorluiz.me/talks - @IgorHalfeld