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

React: CSS in JS - React France Meetup

Avatar for vjeux vjeux
December 15, 2014
33
12k

React: CSS in JS - React France Meetup

Avatar for vjeux

vjeux

December 15, 2014
Tweet

More Decks by vjeux

See All by vjeux
React Rally: Animated -- React Performance Toolbox
Avatar for vjeux vjeux
84
91k
React: CSS in JS
Avatar for vjeux vjeux
656
1.5M
OSCON - React Architecture
Avatar for vjeux vjeux
111
45k
Why does React scale? - JSConf 2014
Avatar for vjeux vjeux
52
2M
Image Layout Algorithms - HTML5 Dev Conf
Avatar for vjeux vjeux
13
860k
React Presentation
Avatar for vjeux vjeux
7
14k
Image Layout Algorithms
Avatar for vjeux vjeux
5
800
Generic Image Processing With Climb – 5th ELS
Avatar for vjeux vjeux
1
5.8k
Climb - A Generic and Dynamic Approach to Image Processing
Avatar for vjeux vjeux
1
3.3k

Featured

See All Featured
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
120
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.4k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
269
14k
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
62k
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
72
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
250
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
57
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
420
SEO for Brand Visibility & Recognition
Avatar for Aleyda Solis aleyda
0
4.3k
How to make the Groovebox
Avatar for あそなす asonas
2
2k
Side Projects
Avatar for Sacha Greif sachag
455
43k

Transcript

  1. React: CSS in JS Christopher “vjeux” Chedeau

  2. 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

  3. speakerdeck.com/vjeux/react-css-in-js

  4. Let’s build a button

  5. Let’s build a button

  6. Differences

  7. Inline Styles!!1!

  8. Conditionals

  9. Conditionals

  10. Customization

  11. Customization

  12. Customization

  13. Visibility

  14. Visibility

  15. ::after

  16. ::after

  17. :hover

  18. :hover

  19. Media Queries

  20. Media Queries

  21. Media Queries

  22. Conclusion Christopher “vjeux” Chedeau