Things I wish I knew before moving 50K lines of code to React Server Components

• panda

  12 4,681 9.9 TypeScript

  🐼 Universal, Type-Safe, CSS-in-JS Framework for Product Teams ⚡️

  

> CSS-in-JS is a non-starter

This used to be true, but there are new libraries like PandaCSS that bring CSS-in-build-time-JS, thus bringing Tailwind-like performance and React Server Components compatibility. https://panda-css.com/

• Isso

  18 4,962 7.8 Python

  a Disqus alternative

  

I deploy my static blog via rsync. I also have Isso [0] on it. No need for a back-end web framework or anything.

[0] - https://isso-comments.de/

• SurveyJS

  surveyjs.io sponsored

  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.

  

• Next.js

  2,042 120,572 10.0 JavaScript

  The React Framework

  

For Context support, https://github.com/vercel/next.js/discussions/42301 isn't promising, and https://twitter.com/sebmarkbage/status/1587615484870098945 explicitly suggests you might need prop drilling.

I'm really sad that tree-specific context for server components seems to be an afterthought. As the Twitter thread suggests, if you have something that can be used across all the server components for an entire request, you can use the cache functionality or rely on Next's URL parameters. But if you've relied on Context as a way to let deeply nested components access some kind of business logic that's specific to only a part of a rendered page, and if you want/need those components to be server components, you'll need to switch to explicitly drilling the props through.

• Graphite

  46 6,831 9.6 Rust

  2D raster & vector editor that melds traditional layers & tools with a modern node-based, non-destructive, procedural workflow.

  

Not sure which web-based spreadsheet app you're talking about, because there are many that do use these frameworks. Here's a PS/AI clone built with a Svelte frontend: https://graphite.rs

• Bulma

  157 48,572 8.4 SCSS

  Modern CSS framework based on Flexbox

You guys can try https://bulma.io/ as a middle-ground. It provides some fundamentals styles that aren't married to JavaScript, so there are never any conflicts with any SPA version. It's not widely used, but it worked well for us before going to Material UI as the team grew and the designers wanted something everyone is familiar with.

• view_component

  74 3,148 9.0 Ruby

  A framework for building reusable, testable & encapsulated view components in Ruby on Rails.

  

• apollo-client

  30 19,198 9.8 TypeScript

  :rocket:  A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server.

  

Actually, it's worse than that. Next has started throwing errors if it statically detects you even _importing_ hooks inside of a React Server Component environment:

- https://github.com/apollographql/apollo-client/issues/10974

- https://github.com/apollographql/apollo-client/issues/11167

To the point that Lenz Weber( a maintainer of Apollo Client, and my co-maintainer on Redux Toolkit), is considering resorting to a package that wraps and re-exports all of React's public API just to avoid that static analysis:

- https://github.com/apollographql/apollo-client/pull/11175

• InfluxDB

  www.influxdata.com sponsored

  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.

  

Suggest a related project