Bookmarks (16) clear filters

How to Use Styled-Components in React — The popularity of CSS is partially based on its ability to centralize and reuse style information. Similarly and amongst their many benefits, components deliver code reusability. It was just a matter of time before elements of the two concepts were combined into a new, really good idea.

Building Reusable React Components Using Tailwind — Ways to build reusable React components using the popular utility-first CSS framework Tailwind.

Snuggle: A 'Comfortable' Way to Layout Your Components — A way to create CSS-based ‘masonry’ style layouts of components. Live demos here.

hamburger-react: Animated Hamburger Menu Icons for React — The icons use CSS-driven transitions optimized for performance, with each one coming in at about 1.5k.

Using Tailwind CSS with Create React App — Demonstrates a basic example with minimal setup along with another one for a more optimized workflow for production.

A Story of a React Re-Rendering Bug — How an Eventbrite developer fixed a “particularly annoying” button focus issue.

A 'Puzzle Piece'-Based React Confirmation Modal Component — A somewhat specific component but it does the job. Demo here.

React Credit Cards: A Modern Credit Card Component — You’d use something like this on your checkout pages to autopopulate a visual representation of a credit card.

How to Build a Modern, Customized File Upload Interface in React with Plain CSS — A thorough walkthrough complete with all the code you need.

Styled-Components v5: 'Beast Mode' CSS Styling for Components — Styled Components is a popular way to bring CSS and JavaScript together for styling components. Version 5 offers 50% faster server-side rendering, 20% faster client-side rendering, 19% smaller bundle size, right-to-left support and, delightfully, no breaking changes.

xstyled: Yet Another Way to Style Components — Consistent theme based CSS for styled-components that uses styled-system.

How to Create a Countdown Component with React — Could be useful if you’re building a site for a conference, wedding, or other similarly scheduled event. Hmm.. maybe even how long till our next issue! 😄