呜啦！日常碎碎念，偶尔掉落优质前端博文推荐、学习资源等
网页：https://tg.cosine.ren
本频道的搜索Bot 来辣 👉 @cosSearchBot
私聊直接发消息就可以搜索啦～
🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态
图频：Cosine 🎨 Gallery @CosineGallery
猫片： @cosine_cat
联系频道主：@cosine_yu
网页：https://tg.cosine.ren
本频道的搜索Bot 来辣 👉 @cosSearchBot
私聊直接发消息就可以搜索啦～
🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态
图频：Cosine 🎨 Gallery @CosineGallery
猫片： @cosine_cat
联系频道主：@cosine_yu
#阮一峰的科技周刊 #前端 #优质博文
科技爱好者周刊（第 277 期）：工作台副屏的最佳选择
#资源推荐 #tools
1. KDesign 🧰 金蝶的企业级产品设计系统，包括设计规范、设计资源、前端组件库。 #组件库
2. ChatGPT Next Web 🧰 一个开源的 ChatGPT 中文网页版，做得非常精致，可以自己部署。这里是 Demo。【这个老早就在用了】#AI #chatgpt
3. Caravaggio 🧰 一个图像处理服务器，可以根据 URL 参数将原图转换成不同大小、格式等，适合用作图像 CDN 的源服务器。
4. TIL（今天我学到的） 📓 一个开源笔记库。大家可以学习他做笔记的方式，内容按主题分类，放在 GitHub 上面。
科技爱好者周刊（第 277 期）：工作台副屏的最佳选择
#资源推荐 #tools
1. KDesign 🧰 金蝶的企业级产品设计系统，包括设计规范、设计资源、前端组件库。 #组件库
2. ChatGPT Next Web 🧰 一个开源的 ChatGPT 中文网页版，做得非常精致，可以自己部署。这里是 Demo。【这个老早就在用了】#AI #chatgpt
3. Caravaggio 🧰 一个图像处理服务器，可以根据 URL 参数将原图转换成不同大小、格式等，适合用作图像 CDN 的源服务器。
4. TIL（今天我学到的） 📓 一个开源笔记库。大家可以学习他做笔记的方式，内容按主题分类，放在 GitHub 上面。
bot 初始化完成
后端 "pub_index"（session: "alice"）总消息数: 404
总计 1 个对话被加入了索引：
- cosine - 前端人の日常频道 (1338193436) 共 404 条消息
后端 "pub_index"（session: "alice"）总消息数: 404
总计 1 个对话被加入了索引：
- cosine - 前端人の日常频道 (1338193436) 共 404 条消息
#优质博文 #前端 #tailwind #css
原文：Speeding up the JavaScript ecosystem - Tailwind CSS
作者：Marvin Hagemeister
译者：Deepl
校对：云谦
译：加速 JavaScript 生态系统 - Tailwind CSS
原文：Speeding up the JavaScript ecosystem - Tailwind CSS
作者：Marvin Hagemeister
译者：Deepl
校对：云谦
译：加速 JavaScript 生态系统 - Tailwind CSS
#资源推荐 #前端 #css #tailwind #组件库
CVA（Class Variance Authority） 在shadcn组件库的时候看到的 Css-in-TS 库，是构建类型安全的 UI 组件的绝佳选择。
之前提到的 tailwind-variants 是 Joe Bell开发的cva工具的扩展，专注于为Tailwind CSS的单个元素生成变体。（先有cva）
AI摘要：CVA（Class Variance Authority）是一个CSS-in-TS库，旨在简化传统CSS方法中的变体创建过程。它允许用户专注于UI开发的更有趣部分，而不必担心类名和样式表的组合。CVA提供了一种类型安全的UI组件构建方式，适用于那些需要完全控制样式表输出、使用Tailwind CSS框架或偏好编写自己CSS的用户。
CVA（Class Variance Authority） 在shadcn组件库的时候看到的 Css-in-TS 库，是构建类型安全的 UI 组件的绝佳选择。
之前提到的 tailwind-variants 是 Joe Bell开发的cva工具的扩展，专注于为Tailwind CSS的单个元素生成变体。（先有cva）
AI摘要：CVA（Class Variance Authority）是一个CSS-in-TS库，旨在简化传统CSS方法中的变体创建过程。它允许用户专注于UI开发的更有趣部分，而不必担心类名和样式表的组合。CVA提供了一种类型安全的UI组件构建方式，适用于那些需要完全控制样式表输出、使用Tailwind CSS框架或偏好编写自己CSS的用户。
cva.style
Class Variance Authority
#优质博文 #前端 #css #新标准
快速了解 CSS 相对颜色
AI摘要：这篇技术博文介绍了CSS相对颜色的新特性，着重探讨了其核心技术和方法。该特性允许将颜色以某种格式分解并重新组合，实现颜色的动态调整。文章创新点在于介绍了如何使用CSS相对颜色来实现颜色的加深、减淡、饱和度变化、色相变化以及反色等需求，以及如何使用CSS变量和calc函数进行灵活计算。这一特性为前端开发者提供了更灵活的颜色处理方法，减少了对JavaScript的依赖，具有实际应用价值。CSS相对颜色将在全局主题应用中发挥重要作用，为前端开发带来更多可能性。文章内容详实，对颜色处理的方法有很好的解释和示例演示。
快速了解 CSS 相对颜色
AI摘要：这篇技术博文介绍了CSS相对颜色的新特性，着重探讨了其核心技术和方法。该特性允许将颜色以某种格式分解并重新组合，实现颜色的动态调整。文章创新点在于介绍了如何使用CSS相对颜色来实现颜色的加深、减淡、饱和度变化、色相变化以及反色等需求，以及如何使用CSS变量和calc函数进行灵活计算。这一特性为前端开发者提供了更灵活的颜色处理方法，减少了对JavaScript的依赖，具有实际应用价值。CSS相对颜色将在全局主题应用中发挥重要作用，为前端开发带来更多可能性。文章内容详实，对颜色处理的方法有很好的解释和示例演示。
#优质博文 #后端 #typescript #Nest #工程化
结合innei佬的这篇文章食用更佳：超级组合！NestJS + tRPC 与CSR绝佳搭档React Query，开启全新开发时代！
AI摘要：这篇技术博文详细介绍了如何在NestJS项目中集成tRPC，实现端到端的类型安全。文章首先解释了tRPC的概念及其在Next.js中的应用，随后详细阐述了在NestJS中接入tRPC的步骤，包括安装必要库、创建模块、定义路由以及应用中间件。作者还探讨了如何分业务模块定义tRPC Router，利用NestJS的DiscoveryModule自动收集依赖，并提供了类型安全的解决方案。最后，文章还涉及了如何将tRPC接入客户端，使得NestJS与React Query的结合更加紧密，开启了全新的开发模式。整体而言，文章提供了一种新的全栈开发模式，使得开发更加高效、类型更加安全。
结合innei佬的这篇文章食用更佳：超级组合！NestJS + tRPC 与CSR绝佳搭档React Query，开启全新开发时代！
AI摘要：这篇技术博文详细介绍了如何在NestJS项目中集成tRPC，实现端到端的类型安全。文章首先解释了tRPC的概念及其在Next.js中的应用，随后详细阐述了在NestJS中接入tRPC的步骤，包括安装必要库、创建模块、定义路由以及应用中间件。作者还探讨了如何分业务模块定义tRPC Router，利用NestJS的DiscoveryModule自动收集依赖，并提供了类型安全的解决方案。最后，文章还涉及了如何将tRPC接入客户端，使得NestJS与React Query的结合更加紧密，开启了全新的开发模式。整体而言，文章提供了一种新的全栈开发模式，使得开发更加高效、类型更加安全。
innei.in
超级组合！NestJS + tRPC 与CSR绝佳搭档React Query，开启全新开发时代！
最近在重写一个 NestJS 的项目，想着这么集成下 tRPC 供管理面板前端使用。原本在管理面板都是裸写的 API 接口，也没有任何响应类型。如果使用 tRPC 的话，不仅不用手写 API 还能做到 End-to-End Type-safe. tRPC 是什么 RPC 是指远程过程调用 (Re
#优质博文 #typescript #TRPC #全栈 #nextjs
Typescript 全栈最值得学习的技术栈 TRPC
AI摘要：本文介绍了Typescript全栈工程师值得学习的技术栈TRPC。TRPC是基于TypeScript的远程过程调用框架，旨在简化客户端与服务端之间的通信过程，并提供高效的类型安全。文章详细讲解了TRPC的特点，如自动类型安全、敏捷高效的开发者体验、不依赖特定框架、出色的自动补全功能和轻量级打包大小。同时，文章还探讨了TRPC的应用场景，指出它可以作为REST/GraphQL的替代品，尤其适用于前后端共享代码的TypeScript全栈项目。最后，文章通过实例演示了如何在Next.js项目中使用TRPC进行接口调用，包括定义服务端和客户端、使用useQuery和useMutation实现CRUD操作等。
Typescript 全栈最值得学习的技术栈 TRPC
AI摘要：本文介绍了Typescript全栈工程师值得学习的技术栈TRPC。TRPC是基于TypeScript的远程过程调用框架，旨在简化客户端与服务端之间的通信过程，并提供高效的类型安全。文章详细讲解了TRPC的特点，如自动类型安全、敏捷高效的开发者体验、不依赖特定框架、出色的自动补全功能和轻量级打包大小。同时，文章还探讨了TRPC的应用场景，指出它可以作为REST/GraphQL的替代品，尤其适用于前后端共享代码的TypeScript全栈项目。最后，文章通过实例演示了如何在Next.js项目中使用TRPC进行接口调用，包括定义服务端和客户端、使用useQuery和useMutation实现CRUD操作等。
