#博客更新 #AI
我的 Claude Code 使用小记
哎呦每次都很纠结丢哪个博客链接（x
我好鸽子精啊，赶紧把新博客搞好不就不用纠结了。
本篇没什么干货，只有一些小技巧记录～

hexo 博客 | astro 博客 | xLog

cos

我的 Claude Code 使用小记 | 笔记 / AI | 余弦の博客

cosSpace 是基于 Next.js (App Router)、Typescript、React 和 Tailwind 开发的个人空间，是 cos_blogs 的重构版，为用户提供同时拥有博客和个人空间的平台。

面条实验室

使用 Astro + Telegram Channel + SepiaTemplate 做了一个微博客。
浏览器端做到了 0 JS, 也可以加入 no-JS Club 了。
https://memo.miantiao.me/

#碎碎念 #项目更新
于是把 tg channel 部署了个网页先 🥰 确实简洁好用
（其实一开始不部署是因为我觉得我搜索 bot 够用了，完全没考虑这茬）
（这个 tag 打的其实不太符合但是就这样吧）

https://tg.cosine.ren

感谢 BroadcastChannel

tg.cosine.ren

cosine - 前端人の日常频道

呜啦！日常碎碎念，偶尔掉落优质前端博文推荐、学习资源等本频道的搜索Bot 来辣 👉 @cosSearchBot私聊直接发消息就可以搜索啦～🔖tags#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态图频：Cosine 🎨 Gallery @CosineGallery猫片： @cosine_cat

#博客更新 #前端 #WebGL #p5
从像素到粒子：p5.js 图像转动态粒子的设计与实现
疯狂叠甲，不行了，就先这样吧，这篇博文和项目搭建写的都比较匆忙，有很多写的比较烂的地方，毕竟是为需求服务的，重构本身就比较赶，后续应该会不断完善。
部分段落有使用 AI 进行润色和辅助，虽然很 AI 但是通俗易懂就留着了（要困死了先睡觉）

#博客更新 #前端 #vscode #插件 #tools
2025 前端开发 vscode 常用插件推荐

终于写了，但是新增的插件其实也没多少 23333 大多数插件还是之前用的，一直好用。新增的工具倒是不少，但是应该会放另一篇文章里去，先去吃个萨莉亚再说，饿死我了！！

AI摘要：新增插件聚焦：WebGL（Shader）、Tailwind 工具链（高亮/文档）、国际化（i18n）、设计协作（Figma）。
核心工具保留：GitLens、ESLint/Prettier、Tailwind 生态插件。
效率提升：通过 CSV 处理、项目管理、注释翻译等插件优化工作流。
个性化选择：外观特效（如 Power Mode）按需启用。
作者备注：部分插件因转用 Cursor 编辑器或使用频率低而弃用，推荐列表基于实际开发场景筛选。

#博客更新 #前端 #tailwind #astro #css #升级
Tailwind CSS v4.0 升级与 Astro 5.2 项目迁移记录

是迁移过程小记和一些主要更新翻译，比较水，后续要是还有问题也丢这篇里边。

🔗 xLog链接
🔗 新版 Astro 博客链接
🔗 Follow - 余弦の博客

cosine - 前端人の日常频道

#碎碎念 #年度报告 2024年B站的年度报告，时间过得好快啊，这就快10年了 N刷的视频是《一招搞定母猫发情》？？？麻麻听我解释

#博客更新 #年度报告
2024，心有所热，步履不停
是2024的年度总结，疑似有些太现充了🥰
新年快乐呀~祝大家都能得到自己想要的东西~
2024 于我而言是极度 “现充” 的一年，今年互联网给我总体感觉是浮躁、不安，人们经常互相攻击，也经常emo，希望这篇文章能带来一点点正能量。

提示：请勿在大晚上打开美食那一节

AI 摘要：2024年对我来说是生活与工作平衡的一年，主要专注于生活。尽管互联网环境浮躁，我通过美食和情感释放保持积极心态。今年我学会了如何去爱自己、他人和这个世界。 我购买了许多新设备，包括DJI Pocket 3、台式机和空调等，感觉未来几年不需要再买了。美食方面，我尝试了很多美味，包括俄式烧烤、烤鳗鱼和脆皮烤鱼等。 在居住方面，我搬回家开始远程办公，装饰了书房并展示了一些手办。今年我还解锁了许多新地点，包括北京、天津、深圳、香港、澳门的游玩经历，拍摄了很多照片，记录了我的生活点滴。希望这篇博客能带给你一点好心情。

Hexo博客链接 🔗 https://ysx.cosine.ren/2024-life-review
xLog链接 🔗 https://x.cosine.ren/2024-life-review
RSS订阅 📢 https://x.cosine.ren/feed/xml

2024, with a passionate heart, the steps never stop - cos

本文于 https://ysx.cosine.ren/2024-life-review 阅读体验最佳 多多多超多图警告～放轻松～坐下来慢慢看吧～ ❤️

前言

2024 于我而言是生活与工作平衡，甚至更偏向生活的一年，换句话说是极度 “现充” 的一年…

#博客更新 #生活 #随笔
寻猫记：记一次难忘的找猫经历

Hexo 博客链接： https://ysx.cosine.ren/lost-my-cat-story
xLog 链接：https://x.cosine.ren/lost-my-cat-story
Follow 订阅：https://app.follow.is/share/feeds/60936161800549376

#博客更新 #follow
赶在午休结束之前写完了，图比较多。
15 个邀请码后，聊聊我对 Follow 的深度体验感受

xLog版：https://x.cosine.ren/follow-travel

群友邀请码：fmpYi0gpoN

cosine - 前端人の日常频道

#前端 #优质博文 #javascript #性能优化 Optimizing Javascript for fun and for profit antfu 推荐 - 「关于使用JavaScript进行微优化的非常酷的交互式博客文章，作者romgrk」 AI 摘要：这篇文章总结了多种优化 JavaScript 性能的技巧。首先强调了避免不必要的工作，如使用 memoization、懒加载等技术。接着讨论了避免字符串比较、优化对象结构以保持代码效率、减少数组和对象方法的使用、避免间接引用、优化内存访问以减…

#博客更新
优化 JavaScript 的乐趣和好处【译文】
是我写的这篇文章的翻译，挺用心的ww

Hexo博客链接 🔗 https://ysx.cosine.ren/optimizing-javascript-translate
xLog链接 🔗 https://x.cosine.ren/optimizing-javascript-translate
RSS订阅 📢 https://x.cosine.ren/feed/xml

#博客更新 #年度报告
2023，稀松平常的一年
是2023的年度总结，很偷懒啦，唉。

AI 生成的摘要：这篇文章是作者对2023年的回顾总结。作者分享了自己在北京实习、回学校、买电动车、吃美食、住房情况、爱好娱乐等方面的经历。同时，作者还提到了自己在做流麻和买胶带方面的兴趣，并分享了自己追的番剧和国漫。此外，作者还介绍了自己在维护TG频道和开发小项目方面的折腾经历。

Hexo博客链接 🔗 https://ysx.cosine.ren/2023-life-review
xLog链接 🔗 https://x.cosine.ren/2023-life-review
RSS订阅 📢 https://x.cosine.ren/feed/xml

#博客更新
NestJS 学习之优秀项目分析与最佳实践
这篇写的超用心！一不小心一天就过去了。

AI 生成的摘要：这篇文章是关于NestJS学习的优秀项目分析与最佳实践。文章介绍了NestJS的基本概念和模块，并通过分析优秀项目和代码示例来帮助读者更好地理解和应用NestJS。文章还解释了常见的后端术语和目录结构，以及模块、服务、控制器等的作用和用途。通过阅读这篇文章，读者可以更全面地了解NestJS的架构和设计理念，提高后端开发的效率和自信。

Hexo博客链接🔗 https://ysx.cosine.ren/nest-learn-project-1
xLog链接🔗 https://x.cosine.ren/nest-learn-project-1
RSS订阅 📢 https://x.cosine.ren/feed/xml

#博客更新
RN 学习小记之使用 Expo 创建项目
嗯，这篇属于随便写了点，然后感觉写都写了发一下的那种。

AI 生成的摘要：本文介绍了学习React Native的过程和资料收集，适合有前端基础和开发环境的人群。其中包括了RN相关资料、安卓开发环境的搭建、以及使用Expo进行RN开发的介绍和演示。最后提供了启动项目的方法。

Hexo博客链接🔗https://ysx.cosine.ren/react-native-note-1
xLog链接🔗 https://x.cosine.ren/react-native-note-1
RSS订阅 📢 https://x.cosine.ren/feed/xml

RN 学习小记之使用 Expo 创建项目 - cos

由于业务需要，开始学习 RN 以备后面的需求，而虽然之前有用过 RN 但是项目搭建等都是封装好的脚手架，对本身其实了解不算太多，于是打算记录一下个人从头搭建 RN 项目的一个过程。顺带进行一个资料收集。 适合：有前端基础，有前端基本开发环境，想了解一下 Expo 搭建 RN…

#博客更新
Floating UI 使用经验分享 - Dialog
”关于写完毕设后就写好了一半但一直忙于各种事咕咕咕到现在这件事“
AI 生成的摘要：本文介绍了如何使用 Floating UI 创建对话框组件。对话框是一个浮动元素，显示需要立即关注的信息，它与弹出框有类似的交互，但有两个主要区别。本文还介绍了如何创建一个名为 Dialog 的 React 组件，它使用了 @floating-ui/react 库来创建一个可交互的浮动对话框。该组件具有多种参数和功能，包括控制对话框是否打开的布尔值、关闭对话框的方法、应用于对话框的 CSS 类名等。

Hexo博客链接🔗 https://ysx.cosine.ren/floating-ui-experience-dialog
xLog链接🔗 https://x.cosine.ren/floating-ui-experience-dialog
RSS订阅 📢 https://x.cosine.ren/feed/xml

Floating UI Experience Sharing - Dialog - cos

Previous article: Floating UI Experience Sharing - Popover In this article, I will share how to use Floating UI to create another common…

#博客更新 #前端 #react
Floating UI 使用经验分享 - Popover
AI 生成的摘要：本文介绍了使用 Floating UI 库创建浮动 UI 组件 Popover（弹出框）的经验分享。Floating UI 是一个 JavaScript 库，为浮动元素提供定位和上下文，可以轻松地控制浮动元素的位置和交互效果，提升用户体验。本文详细介绍了如何安装和使用 useFloating、useInteractions 等 hook，以及如何添加点击、关闭、ARIA 属性等额外功能。

xLog链接🔗 https://x.cosine.ren/floating-ui-experience-popover
Hexo博客地址🔗 https://ysx.cosine.ren/floating-ui-experience-popover
RSS订阅 📢 https://x.cosine.ren/feed/xml

Floating UI Experience Sharing - Popover - cos

在当今的前端开发中，浮动元素扮演着越来越重要的角色…

#博客更新
Backblaze + Cloudflare + Picgo 打造免费顺畅的图床体验
AI 生成的摘要：本文介绍如何使用Backblaze、Cloudflare和Picgo来打造免费顺畅的图床体验。Backblaze提供低廉的云存储服务，Cloudflare提供稳定快速的CDN服务，Picgo解决了上传问题。需要手动配置多个服务，但优点是免费、稳定、价格低廉。文章提供了详细的配置步骤和注意事项。作者推荐使用obsidian和Picgo插件实现自动上传图片，而Mac用户适合使用DropShare。

xLog链接🔗 https://x.cosine.ren/backblaze-cloudflare-picgo-imgbed
Hexo博客地址🔗 https://ysx.cosine.ren/backblaze-cloudflare-picgo-imgbed
RSS订阅 📢 https://x.cosine.ren/feed/xml

Create a free and smooth image hosting experience with Backblaze + Cloudflare + Picgo - cos

Recently, I had a need for object storage and after researching both domestic and foreign options with my friends, I realized that finding a…

#博客更新 #blog
Hexo 迁移 xLog 小记
AI 生成的摘要：这篇文章介绍了作者将自己的Hexo博客转移到xLog上的经历。xLog是一个基于区块链的开源博客系统，使用Next.js + Tailwind CSS + TypeScript + TanStack Query构建，所有博客数据都由用户签名并存储在区块链上，以NFT的形式存在。作者列举了xLog的优点，包括开源、去中心化、安全、现代化、技术栈很新、随意定制、一键部署、导入导出非常方便、图片上传至IPFS等。作者也提到了xLog目前的不足和建议，包括文章的批量操作暂时欠缺、不支持分类功能、不支持搜索功能等。最后，作者呼吁读者了解Web3的理念和实践。

xLog链接🔗https://x.cosine.ren/hexo-migration-xlog-notes
Hexo博客地址🔗 https://ysx.cosine.ren/hexo-migration-xlog-notes
RSS订阅 📢 https://x.cosine.ren/feed/xml

Hexo Migration and Reflections on xLog - cos

最近，我决定把我的 Hexo 博客转移一部分到 xLog，并在这上面进行写作 ，因为它很酷，且技术栈也很新！ xLog 是一个基于区块链的开源博客系统，使用Next.js + Tailwind CSS + TypeScript + TanStack Query构建…

#css #tailwind #前端 #博客更新

Tailwind CSS 的最新版本 v3.3 的一些新特性和改进： Tailwind CSS v3.3：扩展的调色板、ESM/TS 支持、新的实用类

1. 用于深色的扩展调色板：为每种颜色添加了更深的色调——950，现在有11种色调，eg： bg-slate-950

2. ESM 和 TypeScript 支持：使用 ESM 或 TypeScript 编写您的配置文件。（好欸，终于）

3. 微调渐变颜色停止位置 ：可以准确指定渐变颜色中每个色标的位置。如 from-5%、via-35% 和 to-85%

4. 开箱即用的 Line-clamp ：无需插件即可截断多行文本（终于整合到官方啦），如 `line-clamp-3`。 官方：我们在两年多前发布了我们的官方 line-clamp 插件，尽管它使用了一堆奇怪的已弃用的 -webkit-* 东西，但它适用于所有浏览器，而且它将永远有效，所以我们决定将它整合到框架中本身。

5. 🌟字体大小及行高简写 ：这个很有用，可以使用一个类设置字体大小和行高（不在预设中时），如 text-lg/7、 text-sm/[17px] 、 text-[20px]/[24px]

6. 没有 var() 的 CSS 变量：任意值的新速记语法。如下使用
before: bg-[var(--brand-color)]
after: bg-[--brand-color]

7. 可配置的 font-variation-settings ：直接融入您的 font-* 实用程序。

8. 🌟新的 list-style-image 实用类： 这个也很有用，想使用图片作为您的列表项标记吗？那么现在可以使用新的 list-image-* 实用程序。eg： list-image-[url(carrot.png)]

9. 🌟新的 hyphens 实用类：用于微调断字行为。
听说过 ­ HTML 实体吗？在添加对这些 hyphens-* 实用程序的支持之前，我们也没听说。
使用 hyphens-manual 和仔细放置的 ­ ，您可以告诉浏览器在需要跨多行分隔单词时在何处插入连字符。

10. 🌟新的 caption-side 实用程序：用于控制表格内标题元素对齐的实用程序。 caption-bottom 将标题元素定位在表格的顶部，caption-bottom 将标题元素定位在表格的底部。

xLog链接🔗https://x.cosine.ren/tailwind-update-v3-3
Hexo博客地址🔗https://ysx.cosine.ren/tailwind-update-v3-3
RSS订阅📢 https://x.cosine.ren/feed/xml

Tailwindcss

Tailwind CSS v3.3: Extended color palette, ESM/TS support, logical properties, and more

Tailwind CSS v3.3 is here — bringing a bunch of new features people have been asking for forever, and a bunch of new stuff you didn't even know you wanted.

#博客更新 更新了about页喵~🥰 https://ysx.cosine.ren/about/

image_2023-03-03_19-37-41.png

148.9 KB

打算将这里作为前端学习及日常分享的一个频道，偶尔也会分享自己的一些见闻，有自己觉得写的还不错的博文也会发在这里~
Gitbook 前端学习记录：https://book.cosine.ren/
个人博客：
xLog 👉 x.cosine.ren
Hexo 👉 https://ysx.cosine.ren
RSS订阅📢 https://x.cosine.ren/feed/xml

🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #图

#前端 #javascript #css #tailwind #react #node #typescript #工程化 #阮一峰的科技周刊 #chatgpt #rss #vscode #web3 #新标准 #wasm

book.cosine.ren

前言及目录 | 前端学习记录