Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
React: CSS in JS - React France Meetup
Search
vjeux
December 15, 2014
13k
32
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
React: CSS in JS - React France Meetup
vjeux
December 15, 2014
More Decks by vjeux
See All by vjeux
React Rally: Animated -- React Performance Toolbox
vjeux
84
91k
React: CSS in JS
vjeux
657
1.5M
OSCON - React Architecture
vjeux
111
45k
Why does React scale? - JSConf 2014
vjeux
52
2M
Image Layout Algorithms - HTML5 Dev Conf
vjeux
13
860k
React Presentation
vjeux
7
15k
Image Layout Algorithms
vjeux
5
840
Generic Image Processing With Climb – 5th ELS
vjeux
1
6k
Climb - A Generic and Dynamic Approach to Image Processing
vjeux
1
3.4k
Featured
See All Featured
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
550
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
390
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
600
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.5k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
610
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.4k
GitHub's CSS Performance
jonrohan
1033
470k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.9k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
740
Evolving SEO for Evolving Search Engines
ryanjones
0
310
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.2k
The Limits of Empathy - UXLibs8
cassininazir
1
710
Transcript
React: CSS in JS Christopher “vjeux” Chedeau
1. Global Namespace 2. Dependencies 3. Dead Code Elimination 4.
Minification 5. Sharing Constants 6. Non-deterministic Resolution 7. Isolation Problems with CSS at Scale 1. Global Namespace 2. Dependencies 3. Dead Code Elimination 4. Minification 5. Sharing Constants 6. Non-deterministic Resolution 7. Isolation
speakerdeck.com/vjeux/react-css-in-js
Let’s build a button
Let’s build a button
Differences
Inline Styles!!1!
Conditionals
Conditionals
Customization
Customization
Customization
Visibility
Visibility
::after
::after
:hover
:hover
Media Queries
Media Queries
Media Queries
Conclusion Christopher “vjeux” Chedeau