LightNews LightNews
banner
souporserious.com
@souporserious.com
480 followers 21 following 34 posts
Design / Systems / React
Building https://www.renoun.dev/
Posts Replies Media Videos
souporserious.com
It's been almost five years since React Server Components were announced and three years since we could practically use them.

I could not have built www.renoun.dev without React.
import { Directory } from 'renoun' const posts = new Directory({ path: 'posts', filter: '*.mdx', }) export async function Page({ slug }: { slug: string }) { const post = await posts.getFile(slug, 'mdx') const Content = await post.getContent() return <Content /> }
October 16, 2025 at 6:23 PM
souporserious.com
Annotations for code blocks usually require writing regexes to target specific source code and don't stay in sync easily. Working on something new using inline JSX comments. Highly flexible, declarative, and exposes annotations as renderers you can do whatever you want with.
The following source text with "warn" highlighted in yellow and "error" highlighted in red: console.warn('Warning') console.error('Error') import { CodeBlock } from 'renoun' export function Annotations() { return ( <CodeBlock language="ts" annotations={{ highlight: ({ children, color }) => ( <span style={{ padding: '0 0.05em', borderRadius: '0.25rem', backgroundColor: color, }} > {children} </span> ), }} > {` console./* <highlight color='rgba(255,213,0,0.35)'> */warn/* </highlight> */('Warning') console./* <highlight color='rgba(255,0,0,0.35)' /> */error('Error') `} </CodeBlock> ) }
October 12, 2025 at 8:27 PM
souporserious.com
renoun has taken a long time to build because I run into every single issue it's trying to solve for the documentation site. It feels good to finally talk about now though, I'm really happy with where the API is. The changelog is quite the history of where it has been so far 😄 renoun.dev/changelog
renoun - The Documentation Toolkit for React
The renoun toolkit uses your React framework to keep documentation polished, in sync, and on brand.
renoun.dev
October 10, 2025 at 9:50 PM
souporserious.com
Excited to officially launch renoun.dev 🚀

This has been years in the making to deliver a focused set of components, hooks, and utilities in React for building great documentation exactly to your standards that always stay in sync.
renoun - The Documentation Toolkit for React
The renoun toolkit uses your React framework to keep documentation polished, in sync, and on brand.
renoun.dev
October 8, 2025 at 5:50 PM