每天给你推荐一个新奇，好玩，高品质的开源库，好文，观点或言论等。
项目主页维护当前月份的内容，想看往期内容，可以翻到下方历史汇总部分，然后选择自己感兴趣的月份点进去即可。
在线阅读：https://leetcode-solution-leetcode-pp.gitbook.io/mz-ri-yi-jm/
电子书文件太大， 大家可到我的公众号《脑洞前端》回复“每日一荐”获取。
大家可以用 Github 提供的 RSS 来订阅我的仓库更新。
https://github.com/fe-lucifer/fanqiang
很多教育机构宣传的 7 天，一个月搞定算法面试的，我大概都了解了下，不怎么靠谱。学习算法这东西，还是要靠积累，没有量变是不可能有质变的。还有的人选择看书，这是一个不错的选择。但是很多人选了过时的或者质量差的书，又或者不会去写书中给的练习题，导致效果很差。
基于这几个原因，我组织了一个 91 天刷题活动，通过一个相对比较长的时间（91 天）给出最新的学习路径，并强制大家打卡这种高强度练习来让大家在 91 天后遇见更好的自己。详细活动介绍可以点下方链接查看。另外往期的讲义也在下面了，大家可以看看合不合你的口味。
最后送给大家一句话： 坚持下去，会有突然间成长的一天。
- 🔥🔥🔥🔥 活动首页 🔥🔥🔥🔥
- 91 第三期讲义 - 二分专题（上）
- 91 第三期讲义 - 二分专题（下）
如果大家觉得上面的集体活动效率比较低，我目前也接受 1v1 算法辅导，价格根据你的算法基础以及想要学习的内容而定感兴趣的可以加我微信，备注“算法辅导”，微信号 DevelopeEngineer。
previewjs 是一个 IDE插件，通过它可以让你在你的 IDE 中预览 UI 组件， 如果你了解 Storybook，那么你就可以很快上手 previewjs。 实际上通过 previewjs 甚至直接生成 Storybook 文件，实现和 storybook 的无缝衔接。
对不熟悉 storybook 的同学我简单介绍下它。storybook 是一个 UI 组件的开发环境，它可以让你独立的开发 UI 组件，然后通过 storybook 来预览你的 UI 组件。通过 storybook 你可以很方便的查看 UI 组件的各种状态，比如 hover，active 等。组件的 props 也可以通过 storybook 来调整，最后这些属性组合什么的可以作为一个个 user case 来展示，也叫做用户故事（Storybook）。
下面这个视频展示了 previewjs 的功能，你可以看到它是如何在 IDE 中预览 UI 组件的，是如何修改代码，然后实时预览的。
demo.mp4
如果你要做一个类似的插件，其实也不难。核心只要：
- 拿到当前的组件代码，然后调用库的 api 来render 就可以了，比如 react 的话，你可以用 react-dom 的 render 方法来 render 你的组件。
- 至于下面的面板： Story，console，properties。这其实 vscode 等编辑器都有专门的文档告诉你怎么实现。至于展示的数据从哪里来，当前是解析组件的 props 类型定义之类的。
- 最后就是监听代码变化，然后重新 render。
总的来说，我认为它是和 wallaby.js 一样好用的工具，都是让你更快的看到你的代码的运行结果。 而这种快速反馈正是提高开发效率的关键。
由于我经常用 markdown 写一些教程，因此常常会想：“如果 markdown 中可以直接嵌入代码，让文章既有代码又可以交互多好。”
实际上这并不难实现。由于我写的 markdown 最终都是通过一些工具转成 html 来展示（比如我的博客）。因此只需要按照一定格式去写代码，然后将你的 markdown 编译一下，取出对应代码，将其插入到 html 对应位置即可。
只是做这个插件需要时间，做好后每次写文章也会多很多工作量，因此就没有做。但是如果你有这个需求，可以参考这个工具，它可以让你在 markdown 中嵌入代码，然后通过一个插件来实现代码的交互。
其直接内置了一些 UI 库和 helper 函数，让你可以很方便的实现代码的交互。当然你也可以自己引入你的库，然后实现你想要的效果。
via: https://genji-md.dev
figma 是一个非常好用的设计工具，同时它的插件生态也非常丰富，你可以通过插件来扩展 figma 的功能。这是因为 figma 丰富的接口设计，figma 提供了 widget api，rest api 和 plugin api 来让扩展 figma 变得非常容易。
- widget api：可以让你在 figma 中嵌入 ui 组件。
- rest api：可以让你通过 restful api 来操作 figma 的文件，节点等。
- plugin api：可以让你通过 JavaScript 来操作 figma 的文件，节点等。
figma 的插件类似于浏览器的插件，你可以通过插件来实现一些自动化的操作，比如自动生成代码，自动生成图表等。也是用 JavaScript 来编写的。
所谓万事开头难，如果你想自己写一个 figma 插件，看官方文档不那么容易上手。那么这个工具可以帮助你快速创建一个 figma 插件项目。
使用它可以快速生成 typescript 项目，也可以生成 react 项目，让你可以专注于业务逻辑的实现。
via: https://yuanqing.github.io/create-figma-plugin/quick-start/
准备好你的数据库，执行 npx dashpress， 就可以生成一个完整的后台管理系统，包括前端和后端。体验 demo：https://demo.dashpress.io/
via: https://github.com/dashpresshq/dashpress
chatgpt 3.5 终于可以免费使用了，无需登录即可使用。但是对于 4.0 版本，还是需要登录付费使用的。
quickjs 是一个小型的 JavaScript 引擎，它支持 ES2020 标准，可以作为嵌入式脚本引擎使用。它的特点是小巧，快速，可以作为一个库嵌入到你的应用中。
但是你知道吗？它还支持编译为 wasm，这意味着你可以在 JS 引擎中运行 quickjs 来当做沙箱执行 JS 代码（如果你愿意的话也可以继续套娃）。
via: https://bellard.org/quickjs/
如果你想在 node 中运行 deno 引擎， deno 引擎再运行 JS（或者 TS） 代码，那么 node-deno-vm 这个工具可以帮助你做到这一点。
什么情况下会用到这个工具呢？比如你想做一些权限文件读写等权限控制，就可以使用。这是因为 deno 引擎的权限控制更加严格，而 node 在这方面做的不好。
它的原理是用 node 的 spawn 来启动 deno 引擎，然后通过 websocket（deno 目前不支持 IPC） 通信来执行代码，将 websocket 的 url 通过参数传给 deno，deno 构建 websocket 客户端，然后通过 websocket 来通信。
via: https://github.com/casual-simulation/node-deno-vm
最近 web3 特别多空投（airdrop），但是消息都比较分散，这个 metamask 钱包提供的功能可以帮助你识别你有资格参与的空投。
可惜的是很多链都不支持，比如 solana，sui 等，期待后续完善吧。
via: https://portfolio.metamask.io/explore
我重新整理了下自己的公众号，并且我还给它换了一个名字脑洞前端，它是一个帮助你打开大前端新世界大门的钥匙 🔑，在这里你可以听到新奇的观点，看到一些技术尝新，还会收到系统性总结和思考。
在这里我会尽量通过图的形式来阐述一些概念和逻辑，帮助大家快速理解，图解是我的目标。
之后我的文章会同步到微信公众号 脑洞前端 ，你可以关注获取最新的文章，并和我进行交流。
另外你可以回复大前端进大前端微信交流群， 回复 leetcode 拉你进 leetcode 微信群，如果想加入 qq 群，请回复 qq。
大家也可以加我微信好友进行交流！
