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
210
How to migrate legacy frontend?
Avatar for Igor Halfeld igorhalfeld
1
140
Patterns for perfect components in Vue.js
Avatar for Igor Halfeld igorhalfeld
0
140
Clean Architecture no Front-end (update 2021-05-11)
Avatar for Igor Halfeld igorhalfeld
0
76
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
230
Micro Front-ends, what they don't tell you
Avatar for Igor Halfeld igorhalfeld
0
410
Front-end Clean Architecture
Avatar for Igor Halfeld igorhalfeld
2
300

Other Decks in Programming

See All in Programming
コンパウンドプロダクト開発のためのローカルプロセスマネージャー再発明 #layerxgo
Avatar for izumin5210 izumin5210
0
630
私のClaude Code活用法 （個人開発編） - PHPerKaigi mini #4（2026/08/24）
Avatar for panda_program panda_program
1
210
業務時間外もAIに働いてもらう話
Avatar for taki colorful12
3
10k
レビュー履歴をAIに食わせて、 Compose移行を加速するs
Avatar for Yuki Shiho shihochan
0
260
Seeing Through Serverless: Observability for AWS Lambda with ADOT and CloudWatch Application Signals
Avatar for shiro seike seike460
PRO
1
120
AIエージェント時代のコードレビューを設計する
Avatar for nogu nogu66
6
2.5k
AI駆動開発にグラフDBを重ねてみた
Avatar for Satoshi Kaneyasu satoshi256kbyte
2
730
新人はどこまで自力でやり、どこからAIに頼るべきか／エンジニア育成に向き合う_先輩たちの悩みと知見共有会
Avatar for TOPPAN ict toppan_digital_dev
1
560
Go を使い始めて 2 ヶ月の学び / My first two months with Go
Avatar for Daisuke Garaike contour_gara
0
420
Go 1.27からのGODEBUG / Go 1.27 リリースパーティ #go127party
Avatar for mazrean mazrean
0
310
DroidKaigi 2026 「個人開発という実験場: Android エンジニアが手にする4つの自由」
Avatar for SlashNephy slashnephy
0
220
「つくるAI」だけではバグは見つからない　～テストに必要な「見つけるAI」を分離させる戦略～
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
0
230

Featured

See All Featured
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
650
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
2
500
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
97
6.8k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
990
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
61
10k
Ruling the World: When Life Gets Gamed
Avatar for Sebastian Deterding codingconduct
0
320
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
580
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.7k
Visualization
Avatar for Eitan Lees eitanlees
152
17k
Digital Ethics as a Driver of Design Innovation
Avatar for Per Axbom axbom
PRO
1
410
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
5.7k
Claude Code のすすめ
Avatar for schroneko schroneko
67
230k

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