Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/FightingDesign/awesome

💡 令人惊叹的一些前端资源、工具包等汇总。（💡 Amazing summary of some front-end resources, toolkits, etc.）
https://github.com/FightingDesign/awesome

List: awesome

awesome awesome-list chrome-extension github markdown

Last synced: about 1 month ago
JSON representation

💡 令人惊叹的一些前端资源、工具包等汇总。（💡 Amazing summary of some front-end resources, toolkits, etc.）

Awesome Lists containing this project

README 

        


  Awesome FightingDesign




# Fighting Awesome



💡 令人惊叹的一些前端资源、工具包等汇总。



参考贡献前，请先阅读[贡献指南](https://github.com/FightingDesign/awesome/blob/master/CONTRIBUTING.md)。



## 博客相关



- [Tyh2001](https://blog.tianyuhao.cn) 这是 [田同学](https://github.com/Tyh2001) 的个人博客，很多技术分享和笔记



## 宝藏级别



- [moyu](https://github.com/akira-cn/moyu) Github 摸鱼大全！

- [VsCode Themes](https://vscodethemes.com) vscode 主题大全

- [varbook](https://varbook.uiuing.com/) 前端变量名命名神器，支持多种命名规范，中文翻译



## Chrome 插件



- [AdBlock — 最佳广告拦截工具](https://chrome.google.com/webstore/detail/adblock-%E2%80%94-best-ad-blocker/gighmmpiobklfepjocnamgkkbiglidom?hl=zh-CN) 一款 Chrome 广告拦截插件，可以指定某个 html 元素的拦截

- [捕捉网页截图 - FireShot 的](https://chrome.google.com/webstore/detail/take-webpage-screenshots/mcbpblocgmgfnpjjppndjkmgjaogfceg?hl=zh-CN) 一款 Chrome 截图插件，可以实现截取网页长图



## Vite 插件



- [vite-plugin-dts](https://github.com/qmhc/vite-plugin-dts) 可用作 ts 类型打包，用于生成 `.d.ts` 文件的 vite 插件

- [unplugin-vue-setup-extend-plus](https://github.com/chenxch/unplugin-vue-setup-extend-plus) 用于在 script setup 中设置组件 name 的插件



## 第三方库



- [ace-builds](https://github.com/ajaxorg/ace-builds) Ace 代码编辑器的打包版本。可实现简单 IDE



## 面试系列



- [tian-classmate](https://github.com/Tyh2001/tian-classmate) 田同学在线开源简历模板

- [web 前端面试 - 面试官系列](https://vue3js.cn/interview/) 前端面试题

- [Interview-record](https://github.com/Tyh2001/Interview-record) 这是 [田同学](https://github.com/Tyh2001) 真实的面试复盘

- [Awesome-JavaScript-Interviews](https://github.com/rohan-paul/Awesome-javascript-interviews) 流行的 JavaScript/React / Node / Mongo 堆栈面试问题及其答案

- [javascript-questions](https://github.com/lydiahallie/javascript-questions) 一长串（高级）JavaScript 问题及其解释 ✨

- [js-challenges](https://github.com/Sunny-117/js-challenges) 集锦前端 JavaScript 编程题，Not just for interviews



## 学习相关



- [wtfjs](https://github.com/denysdovhan/wtfjs) 有趣而棘手的 JavaScript 示例列表

- [程序员小山与 Bug](https://www.douyin.com/user/MS4wLjABAAAAE8pu3OvkCMpd_mbHotBKV8Bth4LLl4OA_rVSIAz2Zq2xK22KVBfRlNtegdFy8wtm?is_full_screen=0&vid=7117254908620950791) 针对各种前端的 bug 和知识点解决方案

- [渡一 Web 前端学习频道](https://www.douyin.com/user/MS4wLjABAAAAi2oukRVcHpgD-HbVdzsxE7tYykr91YuIKukR_X_Yy08EFWRQhRrECDF6FvbvT8Xa) 前端的各种常见知识点总结

- [33-js-concepts](https://github.com/stephentian/33-js-concepts) 📜 每个 JavaScript 工程师都应懂的 33 个概念

- [学习 JS 看这个就够了，全面打通 JAVASCRIPT 知识点](https://www.bilibili.com/video/BV1NJ411W7wh/?spm_id_from=333.999.0.0&vd_source=45b9ebc52408dcecd5ef3a71d406552e) 学习 JS 入门到精通教程，视频教程，非错不错，每个视频很简短，干货满满



## 文档教程



- [MDN](https://developer.mozilla.org/zh-CN/) 包含 Web 技术的兼容性数据

- [TypeScript 入门教程](https://ts.xcatliu.com/) TypeScript 入门级别教程



## 书籍大全



- [awesome-books](https://github.com/Tyh2001/awesome-books) 📚 非常棒的程序员学习书籍大全。



## 开发工具



- [termius](https://termius.com/) 服务器终端工具

- [varbook](https://varbook.uiuing.com) 适合中文程序员的变量命名助手，NLP+翻译，规范变量命名，定制化变量命名规则

- [Regulex]() 可以用于演示正则表达式的执行效果

- [asciiFlow](https://asciiflow.com/#/) 可以使用字符画出一些效果图，用于粘贴到代码的注释中

- [Chrome](https://www.google.cn/chrome/) Chrome 浏览器官方网站下载

- [Regulex]() JavaScript 正则表达式可视化演示



## 效率工具



- [Markdown Nice](https://editor.mdnice.com/) 一款 Markdown 编辑器，可以适配知乎、掘金等平台

- [在线重命名](https://webrename.cn) 文件批量重命名在线工具，支持各种重命名方法，在线打包

- [在线工具](https://tool.lu/) 大量的开发小工具库，非常实用



## 其它工具



- [Intel® Unison™](https://apps.microsoft.com/store/detail/intel%C2%AE-unison%E2%84%A2/9PP9GZM2GN26?hl=zh-cn&gl=cn+%E4%BD%9C%E8%80%85%EF%BC%9Arifhvk+https%3A%2F%2Fwww.bilibili.com%2Fread%2Fcv21078361+%E5%87%BA%E5%A4%84%EF%BC%9Abilibili) windows 安卓 ios 互联工具（windows 11 支持）

- [codeImg](https://codeimg.io/) 可以将代码片段的生成图片，用与插入文章

- [ray](https://ray.so/) 帮助你快速生成代码片段截图，可自定义样式

- [carbon](https://carbon.now.sh/) 可以将代码片段的生成图片，用与插入文章

- [Termius](https://www.termius.com/) 一个简洁好用的 SSH 客户端，界面高端大气

- [木极简历](https://www.mujicv.com/) 一款使用 Markdown 编写简历的导出 PDF 的工具，免费使用

- [小码短域名](https://xiaomark.com/) 可以将长域名生成短域名的工具

- [shields](https://shields.io/) 用于生成小标签 ![](https://img.shields.io/github/stars/FightingDesign/fighting-design)

- [WinSCP](https://winscp.net/eng/docs/lang:chs) 一款服务器管理平台

- [logoly](https://www.logoly.pro/#/) Pornhub 风格的徽标生成器，可以自定义排版和文字，生成挖掘机主题风格 Logo

- [vectorMagic](https://zh.vectormagic.com/) 轻轻松松 把 JPG、PNG、GIF 文件 转换成 PDF、SVG、EPS 矢量图像

- [Squoosh](https://squoosh.app/) 可以压缩图片的工具

- [宝塔](https://www.bt.cn/new/index.html) 简单好用的 Linux / Windows 服务器运维管理面板

- [在线 PS](https://ps.gaoding.com/#/?hmsr=zc-cc) 节约下载 PS 的时间，直接使用在线版

- [PPT 超级市场](https://www.pptsupermarket.com/) PPT 超级市场，所有 PPT 均可免费下载



## 梯子相关



- [在人间](https://dashboard.zrj222.com/) 在人间加速器

- [AURORA](https://www.catjs2.xyz/) 免费极光加速器

- [Superfast](http://www.super-fastapps.com/zh/) 一款加速器（收费版）

- [西游](https://sunwk.fun/) 西游加速器

- [vpncn.github.io](https://github.com/vpncn/vpncn.github.io) 2022 中国翻墙软件 VPN 推荐以及科学上网避坑，稳定好用。对比 SSR 机场、蓝灯、V2ray、老王 VPN、VPS 搭建梯子等科学上网与翻墙软件，中国最新科学上网翻墙梯子 VPN 下载推荐

- [fanqiang](https://github.com/bannedbook/fanqiang) 翻墙科学上网



## UI 设计相关



- [中国色](http://zhongguose.com/#mudanfenhong) 中国风格的颜色库

- [uiverse](https://uiverse.io/) 一个用 html 和 css 实现的精美元素网站，包括按钮、输入框、开关等

- [SvgWave](https://svgwave.in/) svg 波浪生成器

- [MagicPattern](https://www.magicpattern.design/tools/css-backgrounds) 可以生产 css 的惊艳背景效果

- [Custom Shape Dividers](https://www.shapedivider.app/) 自定义形状分隔线，可以生产 svg 的形状

- [You-need-to-know-css](https://lhammer.cn/You-need-to-know-css/#/zh-cn/centering-known) 💄Web 开发者的 CSS 技巧~里面有多种 css 的案例效果提供使用

- [Flowbite](https://github.com/themesberg/flowbite) Flowbite 是使用 Tailwind CSS 构建的 UI 组件的免费开源集合

- [Preline UI](https://preline.co/index.html) Preline UI 是一组基于实用程序第一个 Tailwind CSS 框架的开源预构建 UI 组件。

- [NavNav+](https://navnav.co/) 各种 css 特效

- [cssFx](https://cssfx.netlify.app/) css 动画合集

- [headless](https://headlessui.com/) 完全无样式、完全可访问的 UI 组件，旨在与 Tailwind CSS 完美集成。

- [codepen](https://codepen.io/ainalem) 各种动画效果组件，可直接复制代码