rsc demo

React服务器组件（RSC）注释应用程序演示 /游乐场没有框架

• 请参阅实时服务器组件（RSC）注释应用程序演示 /游乐场
• 阅读博客文章React服务器组件，而无需框架

免责声明

请注意，以下实施绝对没有最佳的选择，它是故意天真的，不完整的，旨在学习和演示目的。

目标

• 一个功能性的React Notes应用程序（列表，创建，编辑和删除文本标题和Markdown内容）
• 与客户端组件一起使用的React服务器组件
• 某种服务器端渲染
• 使用服务器组件的某种数据提取
• 路由在客户端和服务器上都可以在某种程度上有效
• 客户端的刷新服务器组件
• 可用的RSC操场
• 最重要的是：学习

入门

在Node.js V18.18.1 + NPM v9.8.1上开发

• git clone这个存储库
• npm ci

开发环境

• 启动WebPack进程，观察./src的更改，并输出构建的文件为./dist
• ./src http：// localhost：3000中启动Node.js http Server（使用Fastify），观察./server ./dist更改，并使用nodemon

 npm run dev

产品环境

运行webpack build并启动node.js http服务器，用于生产。

 npm run build
npm start

主要依赖性

• Webpack Bundler
• babel javaScript编译器，用于翻译JSX语法
• 快速为HTTP Web服务器
• A-Route极少JavaScript / DOM路由库利用自定义元素

杂项

• 由Timothée“ Tim” Pillard @tpillard在Twitter上创建
• “ React Server组件，没有框架”的博客文章在Twitter上公告
• 基于React Notes应用程序