ReactFoo 2017

A conference on React

Siddharth Kshetrapal

Siddharth Kshetrapal

@siddharthkp

The life of CSS and its future with React

Submitted Jun 3, 2017

CSS has come a long way from the inline styles in 1996 to the inline styles in 2017, wait wut?

There’s a lot of controversy around styling in the React ecosystem. Components are a great mental model for UI and have been around for more than you think!

Let’s take a journey through the 20 year rich life of CSS and look at the concepts that shaped user interfaces through the years. Featuring gems like isolation of styles (2007) and lego driven development (2009).

How does the current landscape of styling options in React match up? Come, find out!

Outline

Outline:

  1. A tour of the history of styling - pre CSS in the 90s
  2. Language for styling launched in 1996
  3. As time progresses, we learned how to isolate our styles (~2005)
  4. OOCSS in 2009 - starting thinking in components
  5. BEM, ITCSS, SMACSS, etc. come and establish stateful components
  6. Styling your components the React documentation way.
  7. Early days of JS in CSS - Radium, Aphrodite, etc.
  8. The best approaches right now with styled-components and glamor (All the concepts learned converge here)
  9. What the future might hold.

Requirements

Basic understanding of React

Speaker bio

Why should you let me talk about this/Why am I excited about it?

  1. I am a regular speaker at ReactJS Meetup in Bangalore. Have talked about styling, testing, performance, designing and some more
  2. I make OSS projects for building performant apps easier: cost-of-modules, recreate, reaqt, css-constructor.
  3. I obsess over interfaces, web performance and developer experience.

Slides

https://speakerdeck.com/siddharthkp/styling-react-components

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

A community - for and of - front-end engineers to share experiences with ReactJS, performant apps with React, crafting better User Interfaces (UI) with React and GraphQL ecosystem. ReactFoo also discusses design patterns and user experience. more