ricardonunez-io / servercomponents

Small Resource for Learning React Server Components

Home Page:https://servercomponents.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

ServerComponents.dev

This site was made to serve as a simple guide to explaining the basics about React Server Components, what they are, how they're different from existing solutions, and how to use them.

As a non-expert myself in the React space, I wanted something that would both allow both novice React devs and experienced React folks to have a baseline understanding of React Server Components other than the documentation online about just how to use them.


How it's built.

This site is built from scratch using React Server Components in Next.js 13.

I didn't want to use any existing React component libraries (probably a mistake because @shadcn's's UI library is so good), so I built my own components from scratch using Tailwind CSS and vanilla CSS.

There are custom components for code blocks (styled for both dark and light modes automatically using rehype-pretty-code), the a tag for automatically opening external links in a new tab, and custom SVG and HTML animations using framer-motion.

I open sourced the site so that anyone can use these UI elements for their own site and/or copy the MDX configuration to use MDX on your own Next.js 13 application.

There aren't, however, any data-fetching components, so there may not be as much use as a full-blown template, but I am working on releasing one soon.


Thank you for visiting the site, and I hope you find it useful!

If there are any mistakes I made, any suggestions you have, or any changes to the site that might be useful, any and all feedback would be appreciated, and PRs are welcome.


Cheers!

About

Small Resource for Learning React Server Components

https://servercomponents.dev


Languages

Language:TypeScript 60.5%Language:MDX 35.4%Language:CSS 3.2%Language:JavaScript 0.9%