griffel
beam
griffel | beam | |
---|---|---|
7 | 2 | |
1,126 | 9 | |
2.5% | - | |
8.9 | 9.2 | |
8 days ago | 4 days ago | |
TypeScript | TypeScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
griffel
- StyleX – Meta's Styling Library
-
Why We're Breaking Up with CSS-in-JS
I have been giving Griffel ( https://griffel.js.org ) a whirl and it’s pretty nice tho it doesn’t do a good job of explaining what’s good about it.
-
Best practices for CSS and making things faster?
[Fela](https://fela.js.org/) and [Griffel](https://github.com/microsoft/griffel) are also not bad choice.
-
What's new with Fluent UI React v9?
Griffel is a CSS-in-JS with near-zero runtime, SSR support and styles defined with JavaScript objects.
-
Fluent UI React v9 with Formik and Yup
We start off with the high-level layout of the form leveraging Griffel, the CSS-in-JS engine that comes with Fluent UI React.
-
Using Slots with Fluent UI React v9
Note: This example is using Griffel a CSS-in-JS engine that's used with Fluent UI React v9.
- Griffel: CSS-in-JS with ahead-of-time compilation
beam
-
StyleX – Meta's Styling Library
Nice! We copied StyleX's "type-safe extensions" in Truss [1] so things like `` are allowed (setting margin is fine) while disallowing `` (anything "not margin") that would mess up the components internal impl details with a compile error.
That said, we don't actually use the feature that much, vs. higher-level logical props like ``.
I know we're supposed to use build-time CSS-in-JS these days, but afaiu they don't support the rare-but-handy "just spread together ~4-5 different object literals from ~random different conditionals + props", i.e. intermixing styles some inside the component + outside the component, which emotion handles really well.
Basically this [2]. StyleX says it does "cross-file styles"...but can it support that? I kinda assume not, but I'm not sure.
[1]: https://github.com/homebound-team/truss#xstyles--xss-extensi...
[2]: https://github.com/homebound-team/beam/blob/main/src/compone...
-
Ask HN: Who is hiring? (November 2021)
Homebound | Senior Full Stack Engineer | Full-time | Denver / Remote (US) https://jobs.lever.co/homebound/c645e77e-b65e-44cc-aaa7-ab57...
Homebound’s mission is to create a better way to build homes, leveraging technology to make custom homebuilding simpler and more transparent. We’re delivering on that promise in places that have been impacted by natural disasters, and now we’re expanding to serve customers across the country as they build their perfect home.
Our stack is TypeScript, GraphQL, React, and Postgres in AWS. Feel free to reach out! [email protected].
We open source as much as possible, if you want a glimpse into our stack:
- https://github.com/homebound-team/beam
What are some alternatives?
stylex - StyleX is the styling system for ambitious user interfaces.
joist-orm - a TypeScript ORM for Postgres
emotion - 👩🎤 CSS-in-JS library designed for high performance style composition
reval - Instant Meteor reloads
stitches - [Not Actively Maintained] CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
truss - A TypeScript DSL for writing utility CSS in React/JSX
Yup - Dead simple Object schema validation
signoz - SigNoz is an open-source observability platform native to OpenTelemetry with logs, traces and metrics in a single application. An open-source alternative to DataDog, NewRelic, etc. 🔥 🖥. 👉 Open source Application Performance Monitoring (APM) & Observability tool
linaria - Zero-runtime CSS in JS library
graphql-typescript-factori
Fela - State-Driven Styling in JavaScript
Apache Pulsar - Apache Pulsar - distributed pub-sub messaging system