Goodbye CSS Modules, Hello TailwindCSS

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • Tailwind CSS

    A utility-first CSS framework for rapid UI development.

    This is changing with v3 that is slated to be released before the end of the year. The JIT compiler for Tailwind is becoming the default now that it has had a year+ to bake in the wild and prove itself as reliable.

    As far as the toolchain goes, meh. Building on PostCSS allowed the Tailwind team a lot of power with minimal complexity and it appears to have paid off for them. The JIT is plenty fast as is now; so fast in fact, that you can now run it in on a CDN build for prototyping/MVP.

    https://github.com/tailwindlabs/tailwindcss/releases/tag/v3....

  • compiled

    A familiar and performant compile time CSS-in-JS library for React.

    Author here, I haven't had time to play around with it, but this library[0] from Atlassian looks like a "best of the both worlds" styling approach: CSS-in-JS authorship without the runtime penalty.

    [0] https://compiledcssinjs.com/

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • linaria

    Zero-runtime CSS in JS library

    > And CSS-in-JS has worse performance because styles aren't compiled to sytlesheets like they're supposed to be, they're applied at runtime.

    That depends on the tool. Libraries like Linaria [1] ("zero-runtime" CSS-in-JS) do generate CSS files.

    [1] https://linaria.dev

  • chakra-ui

    ⚡️ Simple, Modular & Accessible UI Components for your React Applications

    If you like the idea of tailwind and don't want to look at utility classes and still want the power of styled-components or react-emotion I'd check out Chakra UI [0].

    [0] https://chakra-ui.com/

  • headlessui

    Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

    I wanted to love Tailwind and I used it on a personal project but I eventually concluded that writing CSS is just faster and easier if you are already comfortable with it. Also, your HTML/JSX becomes such a mess. Yes I know you can extract a bunch of Tailwind rules into a class to avoid repeating yourself and keep the code more readable, but then what's the point?

    However I keep visiting Tailwind's docs once or twice a week cause the site is gorgeous and it gives me ideas for my own projects. Also, TailwindUI is amazing if you are not a graphic designer, I use it a lot.

    https://tailwindui.com (+ https://headlessui.dev)

  • twin.macro

    🦹‍♂️ Twin blends the magic of Tailwind with the flexibility of css-in-js (emotion, styled-components, solid-styled-components, stitches and goober) at build time.

    Author here, have you looked at twin.macro?

    https://github.com/ben-rogerson/twin.macro

  • create-react-app

    Set up a modern web app by running one command.

    Author here, I am eagerly awaiting the next version of Create React App. I'm hoping the upgraded internals will remove the need for CRACO. Here's a link to CRA v5 on Github:

    https://github.com/facebook/create-react-app/milestone/81?cl...

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  • windicss

    Next generation utility-first CSS framework.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts