2021.04

汇总完成 - 📅 2021.04.14 ~ 2021.04.30

Tools

  • tooling.report - 为您的下一个 Web 项目确定最佳构建工具的快速方法，或者是否值得进行工具迁移，或者如何在现有配置和代码库中采用工具的最佳实践。
  • docmirror/dev-sidecar - 开发者边车，github 打不开，github 加速，git clone 加速，git release 下载加速，stackoverflow 加速
  • natto.dev | interactive JavaScript space
  • Powerful, Extensible Dev Tools
  • Fusuma - 使用 Markdown 轻松制作幻灯片。
  • rive - 基于 Flutter 开发的网页端动画制作工具(站点支持 PWA) 提供 Web(基于 wasm)、Flutter、Cpp、iOS、Android 五种运行时。
  • Learn Git Branching - 是在web上学习Git最直观、最具交互性的方式；通过挑战关卡，逐步学习Git的特性，使学习过程具有乐趣
  • GitHub520 - 让你“爱”上 GitHub，解决访问时图裂、加载慢的问题。（无需安装）
  • estimator.dev - Calculate the size and performance impact of switching to modern JavaScript syntax
  • Mermaid - 可以使用文本和代码创建图。这简化了复杂图的维护。它是一个基于Javascript的图表绘制工具，可以用Markdown文本来定义各种复杂图表，流程图，顺序图，类图，甘特图，状态图，饼图等。
  • Photopea.com - a free online tool for editing raster and vector graphics with support for PSD, AI, and Sketch files.
  • Portainer - Making Docker and Kubernetes management easy.
  • Logoly Pro - A Simple Online Logo Generator
  • web IDE - 在线写合约，做区块链的前端同学可参考
  • Devops元素周期表，包含了Devops案例学习，模式原则，最佳实践等
  • moiva.io - 工具类站点，可用于评估和比较类库，寻找替代库
  • github1s - 将 github 更改为 github1s 可以查看编辑源码
  • Pull - a GitHub App that keeps your forks up-to-date with upstream via automated pull requests.
  • mdbook - Create book from markdown files. Like Gitbook but implemented in Rust.
  • chrome 拓展程序 - 每天爬  Github Trending 热门 Repo
  • use-what-changed - 一个便于调试 react hook 中依赖项列表变化的小工具
  • Prisma tools are ready for production today!
  • openbase - 工具类站点，寻找类库的工具
  • Wappalyzer - 可以查看网站的技术栈以及使用的相关工具和服务。
  • jExcel - 轻量级的 vanilla javascript 插件，用于创建与 Excel 或任何其他电子表格软件兼容的基于 Web 的交互式表格和电子表格
  • 用于构建交互式流程图的库，reactflow，官网，egoist/flowkit
  • Infinity - New Tab - 浏览器新标签页，可以定制自己想要的
  • wox - An effective launcher for windows
  • Notion - 知识管理工具。无限树层级的笔记结构，可以自建数据库管理目标/待办/人脉等资源。
  • uTools - 生产力工具集，自由集成丰富插件（可自主开发），快速匹配「场景功能」
  • Marp - Markdown 转 PPT，可自定义模板，配套 VSCode 工具，PPT 制作不再愁
  • LICEcap - 小巧的 gif 生成器，可配置 gif 帧率、压缩参数等，demo 演示好帮手
  • Global Speed - Web extension that sets a default speed for HTML media elements (video and audio).
  • tinypng - 在线压缩图片，压缩之后清晰度还不错！
  • cusdis - 极简的网站嵌入评论工具
  • Excalidraw - 手绘风格的画图工具，支持 svg、png 格式的导出，支持 PWA，支持协作。
  • Things - 一款非常优秀的 GTD 工具
  • 调试页面 - 可以用来 debug 微信的 webview ，仅支持 android
  • blockly - 一个 Google 的有点像少儿编程的工具
  • vue-trend - 超级小的图表库
  • shadow1ng/fscan - 一款开源内网综合扫描工具，方便一键自动化、全方位漏扫扫描。例如：web 指纹识别、web 漏洞扫描、netbios 探测、域控识别等。
  • js AST 可视化解析 - 可以转 svg ,png，帮助你 AST 语法结构
  • AdGuard - 一款去广告的 google chrome 扩展程序, 也有软件版本, 但不免费, 且不太需要, 基本的能力已经挺符合了
  • IDM - 下载工具、断点断续、多线程、甚至 google drive 也可以断点断续, 相对稳定的媒体嗅探, bilibili youtube p* 等都可以出现浮窗 可以下载.
  • snipaste - 有免费版本，截图 贴图 取色 方便的取历史图片 各种标记。
  • charles - 一款抓包修改工具
  • FeHelper - 一款 google chrome 扩展程序, Web 前端助手，扩展功能很多
  • lighthouse - 网页检测工具，可以直观展示页面性能，性能优化建议，搜索引擎优化建议等
  • Markdown Viewer - 在浏览器预览 markdown 的谷歌插件（有时会对 github 的 README-*.md 有副作用）
  • Personal Blocklist - 谷歌搜索屏蔽不需要的网站，谷歌插件
  • Carbon - 生成好看的代码图片
  • Octotree - 可以更加友好地让你去浏览阅读 GitHub 上的项目。
  • OneTab - 一键解决浏览器打开页签多，内存占用大。
  • LastPass - 非常好用的密码管理工具。
  • iStat Menus - 一款系统状态监控工具。
  • sourceTree - 一款可视化 git 管理工具。
  • draw.io - 免费客户端、网页版都有的画流程图工具，功能强大。
  • pocket - 谷歌浏览器插件，用来随手看到好的文章很方便地收藏
  • Online text to diagram tools
  • 可视化解析 npm 包依赖项目
  • Avatar Maker - Create your own avatar with Vue Avatar Maker app.
  • Regulex - JavaScript Regular Expression Visualizer.
  • CSS Gradient - As a free css gradient generator tool, this website lets you create a colorful gradient background for your website, blog, or social media profile.
  • ADB - 实际开发中app内嵌webview很常见，但是安卓环境调试，出了开模拟器，可以试试adb插件，很好用
  • calendso - 知名日程安排工具(Calendly)的开源替代品。
  • fscan - 一款内网综合扫描工具，方便一键自动化、全方位漏扫扫描。
  • JS Tooling not in JS - A curated list of JavaScript tooling not written in JavaScript
  • why-did-you-render - 通过 monkey patches React 来通知您可能可以避免的 re-renders，同时适用于 react-native
  • transform - 支持各种代码转化的工具，SVG、JSON、TS、GraphQL、CSS、SQL，只要你能想到的这里都有。光 JSON 就可以转化为十几种代码格式，如把 JSON 转化成 Flow、Go、GraphQL、Typescript、Kotlin、MySQL、YAML等。本项目开源，你可以通过代码学习到它是如何进行格式转换的。

Open Source

  • yjs - 一个新的基于CRDT的开源数据协同框架，常用来做在线编辑产品
  • 腾讯开源： Vap - 企鹅电竞开发，用于播放酷炫动画的实现方案，Android, iOS, web 通用。
  • rn-range-slider - A highly optimized and fully customizable pure JS component for value range selection.
  • Duilib 一个Windows下免费开源的DirectUI界面库，腾讯、网易都在用
  • EasyFaaS - EasyFaaS是一个依赖轻、适配性强、资源占用少、无状态且高性能的函数计算服务引擎
  • 喵语翻译 - 将人类语言翻译为喵语言
  • dagre - Graph layout for JavaScript
  • WinBox - 是用于Web的专业HTML5窗口管理器：轻巧，性能出色，无依赖项，完全可自定义，支持最大化，最小化，自由拉伸及拖动等
  • esmon - 类似 nodemon 但基于 esbuild，支持 ts 等
  • Recoil - A state management library for React
  • pullstate - Simple state stores using immer and React hooks - re-use parts of your state by pulling it anywhere you like!
  • react-amap - 基于 React 封装的高德地图组件，助你轻松的接入高德地图到 React 项目中。
  • nodejs 源码解析
  • Run multiple promise-returning & async functions with limited concurrency
  • vite-plugin-vue-gql - GraphQL Tags for your Vue SFC
  • libp2p-rs - rust 实现的 libp2p
  • rbatis - 用 rust 实现 ORM 框架
  • iced - rust 9.2K 跨平台 GUI 仓库
  • swc - rust 编写的超快速的 typescript/ javascript 编译器
  • 北海 - 基于 Flutter 的 Web 渲染引擎正式开源
  • FicusJS - 基于 webcomponent 实现的轻量开发库
  • LogicFlow - 滴滴开源，专注流程可视化的前端框架
  • APIJSON - 腾讯开源
  • material-tailwind - 基于 react、material、tailwind 开发的组件库
  • react-to-print - react 中指定打印节点而并不需要写内联样式的库
  • Eva.js - Eva.js is a front-end game engine specifically for creating interactive game projects.
  • rtk-query - 基于 redux toolkit 的 data fetch 和 caching 工具，还在用 redux 的可以关注下。
  • Finished Proposals - Finished proposals are proposals that have reached stage 4, and are included in the latest draft of the specification.
  • pytorchjs - Torch and TorchVision, but for NodeJS.
  • NPlayer - 无任何第三方运行时依赖，兼容 IE11，支持 SSR。高度可定制，可二次开发。和 B 站一样体验的弹幕系统。可以接入任何流媒体，支持直播。
  • ReactFlow - Highly customizable library for building interactive node-based UIs, editors, flow charts and diagrams.
  • Fabric.js - Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser
  • framer/motion - Open source, production-ready animation and gesture library for React
  • awesome-f2e-libs - 整理我(云谦)平时关注的前端库
  • translate.css - Drop-in CSS transitions
  • ChatUI - 对话式交互应用UI库，达摩院开源作品
  • DSBridge-Android - A modern cross-platform JavaScript bridge, through which you can invoke each other's functions synchronously or asynchronously between JavaScript and native.
  • javascript-state-machine - A javascript finite state machine library
  • windicss - Next generation utility-first CSS framework.
  • replay - A React video player facilitating adaptive stream playback with custom UI and a React-friendly API.
  • vue3-markdown-it - An awesome Vue 3 markdown-it wrapper plugin that can even support external plugins!
  • code-to-graph - Transforms code (JS) into graphs (graphviz, mermaid flowchart, ...)
  • @pansy/watermark - watermark component
  • air-conditioner - 云空调，便携小空调，为你的夏日带去清凉！

Guide

Weekly

VS Code

APP

  • CheatSheet APP(mac) - Just hold the ⌘-Key a bit longer to get a list of all active short cuts of the current application. It's as simple as that.
  • macos in preact - 源码
  • typora - 跨平台 md 编辑器
  • Xnip - mac 端下比较好的截图软件，支持打码、步骤标注等常用功能
  • Bob - 翻译软件，支持划词翻译和截图 ocr 翻译，注意服务配多点效果比较好，多个翻译服务对照着看
  • thor - 通过快捷键一键切换和隐藏各种软件（老板键？），搭配 Karabiner Element 修改右 command 为 hyper 键可进一步提升快捷键的选择空间
  • Runcat - The cat will run at a speed that depends on the CPU usage on your Mac. You can see how much the current CPU usage is by looking at the running of the cat.
  • Unsplash Wallpapers - Bringing you thousands of magical moments to your screens.
  • Kap - 非常好用的 gif 截屏 小工具
  • ImageOptim - 使图像加载更快 删除肿的元数据。通过压缩映像节省磁盘空间和带宽，而不会降低质量。支持多种图片格式，自定义压缩质量
  • MarginNote - 整理知识地图，构建自己的知识体系，强烈推荐在 iPad Pro 上搭配 pencil 使用
  • meld - 基于bedrock的脚手架搭建
  • vue-luck-draw - Vue 写的一个抽奖类库
  • pap.er, 专为 Mac 设计的壁纸应用 每天享受来自全球新鲜精美的壁纸
  • Maccy - 随时保留复制历史记录，轻巧快捷
  • f.lux - 屏幕蓝光过滤
  • Hidden Bar - 隐藏 mac 菜单栏图标
  • Rectangle - 使用快捷键快速调整窗口大小及位置
  • Dropover - Dropover is a utility that makes it easier to manage and move content between folders, applications, windows and workspaces using Drag and Drop.

WebAssembly

  • Learning WebAssembly Series - webAssembly 系列入门文章，从代码示例到原理讲解
  • WebAssembly 入门 （Vite + Rust）
  • NoteCalc - 带有智能内置计算器的便捷记事本。功能强大，使用 webAssembly+canvas 构建应用。
  • Telegram React - based on the ReactJS JavaScript framework and TDLib (Telegram Database library) compiled to WebAssembly。
  • Ant Design of Blazor - WebAssembly 版本的 antDesign，语法类似 tsx。
  • v86 - v86模拟与x86兼容的CPU和硬件。 机器代码在运行时转换为WebAssembly模块，以实现良好的性能，支持多种仿真硬件。

Algorithms

Terminal

  • tools/terminal - lencx自用
  • thefuck - 命令行神器，当输错 linux 命令，fuck 一下，提示你可能想输入的命令。
  • kenshinji/yddict - 一个命令行查单词的工具
  • Fig - adds VSCode style autocomplete to your terminal
  • iterm2 - 一款命令行终端模拟器，（iTerm2 + Oh My Zsh 一套相关配置大大提升效率）

Community

  • Lore Free - 首个基于 EOS 和 IPFS 的去中心化知识共享社区
  • 柠檬精选 - 腾讯柠檬精选——收录免费、正版、好用的 Mac 产品
  • xclient - MAC 应用分享平台

Micro Frontends

  • 面向大型系统的微前端解决方案
  • icestark - 面向大型系统的微前端解决方案
  • m-app - 新一代微前端解决方案，微应用容器组件，对 DOM、CSS、JS 进行硬隔离，达到真正的技术栈无关，并且运行时集成，微应用可独立开发、部署、升级。使用如 iframe 般简便，却超脱 iframe 的局限，你值得一试！

Icons

  • IconPark - 字节跳动出品的高质量开源图标
  • 700+CSS Icons - Open-source CSS, SVG and Figma UI Icons. Available in SVG Sprite, styled-components, NPM & API.

Low Code

  • sparrow - 场景化低代码（LowCode）搭建工作台，实时输出源代码
  • yoma - 一个小而美的低代码全栈开发平台，一键生成后端api接口+前端页面代码+在线接口文档，节省50%的前后端开发的工作量，平台代码100%开源。平台适用于企业信息化、政务、中小型互联网等项目
  • citrus - 低代码快速开发脚手架，灵活、高效，降低开发成本
  • vue-low-code - Quant-UX standalone

🎉 彩蛋: 如何信息获取？

  • 云谦：我的信息来源主要这些

    1. twitter 新建个 list 关注国内外前端大牛，然后按 top 排序
    2. github 1) 通过 watch > custom > Releases 订阅感兴趣库的 release 信息 2) follow 一些人
    3. 邮箱订阅各种 weekly 邮件列表
    4. rss 订阅，来源很杂 信息流的方式基本没变，可参考两年前花的图，《2019-04-sorrycc-我的输入信息流》

  • xiaohuoni: 我的信息输入较少，更多喜欢从纸质书籍上得到信息。

    1. 当当图书推荐榜-优先计算机，语言类。
    2. github 首页，主要是通过关注的人的动态，还有explore里面的推荐
    3. dev.to 通过 tags 过滤，也关注热度榜单。dev开源之前是我的主要信息来源。一直想着做一个国内站点，开源的时候，看了一下技术栈与我掌握的差异太大。反而连这个网站都少上了。
    4. 云谦早报和他个人动态现在是我的主要信息来源。
    5. 阮一峰的周报，issues区有很多信息 ruanyf/weekly

  • 浩明: 我的信息来源主要这几个博客和平台

    1. github 上 follow 的动态
    2. Jake Archibald 博客
    3. Dan Abramov 博客
    4. David Walsh 博客
    5. 阮一峰，张鑫旭 的博客
    6. 公众号，知乎

💭 补充: 我本人lencx也 follow 过许多国外大牛，因为人数太多暂时无法整理出来，感兴趣的可以查看