Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alanbsmith/d627b346950acfae14eb3759e693b8a6 to your computer and use it in GitHub Desktop.
Save alanbsmith/d627b346950acfae14eb3759e693b8a6 to your computer and use it in GitHub Desktop.
Talk outline for "Building A React Component Library"

Building A React Component Library

$ whoami

  • Alan Smith
  • @_alanbsmith -> Twitter
  • @alanbsmith -> Github

What's the purpose of this talk?

  • To encourage you to create and publish your own reusable components

Topics Covered

  • Creating & publishing npm modules
  • Atomic Design
  • CSS in JS and styled-components

What is a Component Library?

  • a collection of generic and useful UI elements

Some Examples

  • Bootstrap
  • Foundation
  • Marvel App
  • Material UI libs

Why Build a Component Library?

  • useful tool for managing ui consistency
  • helpful to only build something once
  • stability via versioning
  • fun, challenging exercise and great learning opportunity

Why React?

  • component-based
  • testable

Basic Setup with Git, npm, and Babel

Designing Reusable components

Atomic Design as a Model

CSS in JS

  • styled-components
  • glamorous

Publishing

References and Helpful Links

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment