@4lpine

Building things. Helped create @mdx_js, @blocks_ui, @tachyons_css, @cssstats. I love skiing ⛷❄️ and soccer ⚽️. he/him

 Boise, Idaho
johno.com
Joined October 2011
  • Tweets4.3K
  • Following586
  • Followers5.2K
335Media
Pretty excited to read through this source code, I've been quite curious about how RSC works underneath the covers.
Daishi Kato@dai_shi12 Dec 2023
⛩ New Blog Post: Introducing Waku, the minimal React Framework that enhances React Server Component (RSC) usage. Perfect for RSC enthusiasts or those curious about Waku. For detailed info and examples, check out our GitHub repo. Learn more here 👉 waku.gg/blog/introducing-wak… 🤩

Introducing Waku — Waku

Learn about the minimal React framework and how it enables RSC features.

waku.gg
5
1,525
I'm ready for CSS Modules to make a comeback.
1
2
6
1,995
I feel like the missing piece of DX is making intellisense aware of the custom properties in a project automagically🪄
1
4
904
Atomic/Utility/Functional CSS is basically assembly for presentation so it's always cool to see libraries treat it as a compile target. github.com/facebook/stylex

GitHub - facebook/stylex: StyleX is the styling system for ambitious user interfaces.

StyleX is the styling system for ambitious user interfaces. - facebook/stylex

github.com
1
7
1,138
As apps grow, the permutations of styles are effectively infinite. Compiling to atomic classes means CSS output grows logarithmically rather than linearly.
1
7
537
I'm that broken record at work that always says "this should be a state machine", so always delighted to see xstate iterate.
David K 🎹
@DavidKPiano1 Dec 2023
XState v5 is finally here 🚀 → Express any logic, from promises to state machines → Much simpler API → Massively improved TypeScript experience → Smaller bundle size, zero deps → Advanced statechart features → New docs, examples++ npm i xstate
15
1,620
I'm back, did I miss anything?
8
16
2,475
Get ready for a whole new type of design workflow. Just released folders and component hot swapping for Studio Pro users. Write your content once and then quickly cycle through any component in the current folder to rapidly explore design options🤤
2
1
21
📈 A collection of components growing by the day!
Components AI@components_ai23 Aug 2022
👀 116 open source components built with HTML & CSS: components.ai/u/system/cl5a9…
Screenshot of a grid of ui components documented visually

ALT Screenshot of a grid of ui components documented visually

1
6
My favorite part about these themes/templates is you'll be able to customize the HTML+CSS without writing any code.
Components AI@components_ai29 Jul 2022
We're hard at work on a collection of open source themes and templates that can be combined to produce an endless stream of stunning design options for your content. Some examples of output after our latest updates 🤩
A grid of 6 webpage screenshots for a common landing page design with Space Grotesk font. Each screenshot is a different combination of colors and typefaces.

ALT A grid of 6 webpage screenshots for a common landing page design with Space Grotesk font. Each screenshot is a different combination of colors and typefaces.

A grid of 6 webpage screenshots for a common landing page design with Syne font. Each screenshot is a different combination of colors and typefaces.

ALT A grid of 6 webpage screenshots for a common landing page design with Syne font. Each screenshot is a different combination of colors and typefaces.

A grid of 6 webpage screenshots for a common landing page design with Playfair Display font. Each screenshot is a different combination of colors and typefaces.

ALT A grid of 6 webpage screenshots for a common landing page design with Playfair Display font. Each screenshot is a different combination of colors and typefaces.

1
12
John Otander retweeted
murmurs@mrmrs_21 Jul 2022
Contrast threshold is now used as a constraint. Choose a color or background color and quickly cycle through accessible options from your theme.
1
1
17
✍️ Working on text editing directly in the @components_ai canvas. The first pass is rolling with some vanilla contenteditable=true magic. In the future we'll likely iterate and add full-fledged rich text editing (via Slate).
1
1
14
Currently working on targeting nested elements in CSS GUI so you can have a Content/Prose component to apply child styles. Here I'm styling nested links (some UX improvements to make still):
1
1
3
This'll be particularly useful for applying styles to MD(X) documents and user-provided content.
Implemented HTML+Markdown imports for CSS GUI. Added a sneaky nicety where if you have Markdown in the input and switch the format to HTML - it'll convert it. HTML => MD => HTML ➿
2
2
2
18
And a big thanks to @hturan for doing a lot of heavy lifting with the HTML imports! Our next step will be connecting HTML DOM nodes with any embedded styles, but that's a really hard problem. So this is our first baby step : )
The data structure we have for CSS lets us serialize the styles in different ways. Whether that's compiling it using a CSS-in-JS runtime, serializing it to a CSS prop with theme bindings, or eventually serializing to utility/functional CSS. A styles serialization "demux".
1
Meanwhile, the HTML/hyperscript AST representation lets us serialize (somewhat) simply to a lot of web-based frameworks since they're fundamentally HTML/JSX with JS sprinkled in with their own syntactic sugar for props and interactive bindings.
Load more