视野修炼-技术周刊第135期 | 鼠标跟随宠物

0 阅读3分钟

欢迎来到第 135 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介

🔥强烈推荐

  1. page-mascot - 灵动的鼠标跟随宠物
  2. yoinks - 视频下载工具 CLI 版
  3. Web 常用音效合集

🔧开源工具&技术资讯

  1. 毁灭你的网站
  2. 无限背景音乐
  3. Amicro - 一些Nice的交互动效组件
  4. transitions.dev - 常用CSS过渡动画
  5. Vite+ 1.0 发布

📚教程&文章

  1. 为什么习惯 3000 和 8080 作为开发端口

下面开始本期内容的介绍,预计阅读时间 7 分钟。

🔥强烈推荐

1. page-mascot - 灵动的鼠标跟随宠物

头像会自动跟随鼠标转动,点击也有不同的反馈。

原理是一张精灵图 + 一个封装好的Web组件。

如果你是自己开发Web应用想加个交互的宠物的话可以考虑使用这个组件。

也可以自己用SKILL 定制。

npx skills add nilbuild/page-mascot --skill page-mascot --global --yes

我基于已有的参考图做的。

转向那张做的不太好,模型拉了!

2. yoinks - 视频下载工具 CLI 版

Powered by yt-dlp

贴链接就能自动扒拉下来,还能选清晰度!

3. Web 常用音效合集

如果你要给你的应用加一些音效反馈的话这个很值得用上。

分场景整理了不少的音效,可以直接在线试听,一键下载使用。

🔧开源工具&技术资讯

4. 毁灭你的网站

挺有意思的效果!输入你要 Play 的网站就可以开始了。

不过抓取网站快照渲染有些bug。

5. 无限背景音乐

浏览器中生成无限的BGM,纯离线。

6. Amicro - 一些Nice的交互动效组件

比如按钮的动效。

卡片堆叠展开效果。

Star⭐️

7. transitions.dev - 常用CSS过渡动画

开箱即用支持 SKILL 调用,每个示例都有 Prompts 可以直接 Copy 使用。

收藏⭐️,VibeCoding 包用上。

8. Vite+ 1.0 发布

新机配环境可以直接用这个,新项目可以试试了。

一条 vp 命令即可覆盖常见开发流程:

  • Node版本管理(vp env)
  • 包管理器自动识别(vp install)
  • 开发服务器(vp dev)
  • 代码检查、格式化、测试、构建和任务执行等

存量的 Vite Vitest ESLint、tsup 可以直接 vp migrate 迁移。

📚教程&文章

9. 为什么习惯 3000 和 8080 作为开发端口

省流:第一个人随手一选 + 后来者理性跟随

比如搞JAVA开发时用 Tomcat 默认端口就是 8080,后面JAVA 系的其它服务也用这个端口作为默认端口。

Ruby 普及了 3000 端口。

⭐️强力推荐关注

周刊部分内容来源如下渠道,推荐大家关注。