DEV Community

Cover image for This Week In React #177 : Skia, Pigment, Mist, Storybook, shadcn/ui, Hydration Diff, Geiger, MDXTS, Remotion, WinterJS...
Sebastien Lorber
Sebastien Lorber

Posted on • Originally published at thisweekinreact.com

This Week In React #177 : Skia, Pigment, Mist, Storybook, shadcn/ui, Hydration Diff, Geiger, MDXTS, Remotion, WinterJS...

#react #reactnative

Hi everyone!

This week it's particularly exciting to see React Native Skia reaching 1.0. But we also have many other interesting releases to look at: Pigment, Storybook, Tailwind, Rolldown, MDXTS...

There were also some fun ones, such as Mist and Geist. I'm really curious to know what you think of them. Would you use these?

I'm trying to monitor more closely weak signals (PRs, RFCs and tweets), do you find this kind of news valuable?

💡 Subscribe to the official newsletter to receive an email every week!

banner

💸 Sponsor

In-App Subscriptions Made Easy

In-App Subscriptions Made Easy

RevenueCat gives you everything you need to monetize, analyze, and grow your app business. Effortlessly control customer access and entitlements, manage data, and experiment with pricing. See why over 30,000 apps trust RevenueCat to power their in-app purchase infrastructure.

⚛️ React

Pigment CSS

Pigment CSS

The MUI team is working on Pigment, their own zero-runtime CSS-in-JS to replace Emotion in Material UI v6. The first versions have been published to npm, including a Next.js withPigment() plugin. Olivier explains in a 🐦 tweet the motivations to create a new solution, and how it compares to existing ones (Panda, StyleX, Tailwind). Unlike all others, this one will ease the adoption for existing Emotion and Styled-Components users.

Storybook 8

Storybook 8

This new major version of Storybook comes with many improvements, including:

  • Experimental React Server Components support
  • Faster React control auto-generation (through react-docgen)
  • Faster static builds in "test mode" (CLI flag --test)
  • Built-in visual testing (through Chromatic)
  • Re-architected Vite support, Vitest, Vite 5
  • Improved mobile/desktop UI/UX

💸 Sponsor

Refine - Open source Retool Alternative

Refine - Open source Retool Alternative

The sweet spot between the low code and traditional development for CRUD-heavy applications.

As an open-source React meta-framework designed for Enterprise applications, Refine offers a headless solution ideal for tasks like admin panels, dashboards, and internal tools.

While low-code tools may offer initial promise, they often fall short in handling complex scenarios due to scalability issues, limited customization options, and the risk of vendor lock-in.

Refine enables teams to rapidly develop production-ready apps while maintaining flexibility.

📱 React-Native

This section is now co-authored with Benedikt. Feel free to send us your comments by email or on Twitter!

William Candillon - Time to Fly - React Native Skia 1.0

🎥 William Candillon - Time to Fly - React Native Skia 1.0

Exciting major release of React Native Skia, with an inspiring launch video! This library was first released back in 2021 by William Candillon and Christian Falch and has been heavily supported by Shopify for a long time. Now, they’ve finally released a 1.0 and it’s packed with improvements and new features: Thanks to a new Paragraph API, Skia can now render rich text layouts, combining system fonts and custom fonts. Animations Hooks make it easier to build performant animations with the already existing RN Reanimated and Gesture Handler integration. Another highlight for me personally: RN Skia now also supports the web as a platform, via a package called canvaskit-js!

🔀 Other

🤭 Fun

alt

See ya! 👋

Top comments (3)

Collapse
 
figgsboson profile image
Henry Zhang • • Edited

Hello Sebastien!

I don't have a twitter so I was trying to find a way to reach you about Docusaurus, and found you on here. I am building an SSOT for my company to use as an internal documentation source ,using Docusaurus. So far it's been great, and very lightweight, which is perfect.

I was wondering, is there a way to generate a new md/mdx file by a non-local user? As in, after deployment, I would want anybody with access to be able to create a new Doc page, have it go into the correct file path, and make that the current version in the git repo. Is that possible to do?

The premise is that this would be a company wide hub that anybody could contribute to, and I want a way to forego an active administrator who would have to manually update the site. They could submit into an input form, and it would create the md/mdx file, push to the git repo, and make the localized change persist on the deployed site, and the page would be live immediately after.

I would be very grateful for any advice. If this platform is not good for a response, you can reach me at

Collapse
 
sebastienlorber profile image
Sebastien Lorber •

Hey

You'd better ask questions on the Docusaurus Discord or the Docusaurus repo discussions 😅

You can try to use a Git-based CMS like TinaCMS or Decap.
Another approach could be to let users contribute to docs through StackBlitz Web Publisher. It is a bit more technical because users have to "submit" their contribution at the end, but is manageable.
developer.stackblitz.com/codeflow/...

At the end of the day users should be technical enough to understand how to author Markdown anyway

Collapse
 
figgsboson profile image
Henry Zhang •

Thanks for getting back to me, I appreciate it Sebastien. And sounds good, I will give those a try, as well as the DocuDiscord, thank you!

Read next

tusharshahi profile image

The convenience of CSS's new @position-try

TusharShahi -

truongpx396 profile image

⚡🚀 ReactJS, TypeScript, Vite with Redux and TanStack (React Query) In Practice ⚛️

Truong Phung -

abeertech01 profile image

Dockerize PERN-TypeScript App Using Prisma ORM With Docker Compose

Abdul Ahad Abeer -

robertobutti profile image

Building a website using Markdown content with Next.js App Router and Fusionable

Roberto B. -