Building a Better Web
June 19–20, 2017: Training
June 20–22, 2017: Tutorials & Conference
San Jose, CA

Styling React applications

Max Stoiber (Spectrum.chat)
9:00am–9:40am Wednesday, June 21, 2017
Frontend Frameworks and Libraries
 Location: 210 DH
Secondary topics:  CSS3, JavaScript frameworks and libraries (Angular, React, Ember, Vue, etc.), JavaScript/ES6
Average rating: ****.
(4.38, 8 ratings)

Who is this presentation for?

Frontend and JavaScript developers

Prerequisite knowledge

  • A basic understanding of React

What you'll learn

  • Understand why styling component-based systems is hard with CSS
  • Explore how different tools have approached this problem and tried to make it easier
  • Discover styled-components and learn why it might be just the revolution the React world needed

Description

CSS was invented at a time when the most widely used browser was Netscape. It has been around for quite some time, and while it has changed and improved considerably since then, it has not kept pace with recent innovations in the web.

React popularized a component-based development experience, where every part of your website is a self-contained entity. The problem is, CSS wasn’t meant to work like that. While “features” like inheritance and global names were great in the beginning, they present serious challenges when working with CSS.

So what is the best way to style your react application? Drawing on his work with Glen Maddern, Max Stoiber offers an overview of styled-components, a new way to style React apps that takes the best of CSS.

Photo of Max Stoiber

Max Stoiber

Spectrum.chat

Max Stoiber is the technical cofounder of Spectrum, the creator of react-boilerplate, one of the most famous React starter kits, and the cocreator of styled-components, one of the most widely used libraries to style React apps. Max also takes care of KeystoneJS, the biggest Node.js CMS, and Elemental UI, a popular React UI library.