工具资源

有趣玩物

• HTML5资源
• HTML5+ API Reference (html5plus.org)

辅助工具

• 百度脑图－便捷的思维工具 (baidu.com)
• 图片编辑器 | 画布白板
• 菜鸟工具 - 不止于工具 (runoob.com)
• 新浪短网址生成
• 香蕉云编/APP签名证书生成

UI框架

• React
  • MUI: The React component library you always wanted
    • 设计：Material Design
  • Ant Design
• Vue
  • Vuetify
  • Element Plus
  • Vant 4 - 轻量、可定制的移动端组件库 (gitee.io)
  • ViewUIPlus
• 其他
  • Swiper中文网-轮播图幻灯片js插件,H5页面前端开发

Icon图标

• Lucide - SVG、支持Tree shakable、风格自定义、跨框架、
• Iconify Design
• 阿里巴巴矢量图标库
• favicon.ico图标制作
• icomoon字体图标库
• 付费 - Font Awesome

VsCode插件

• koroFileHeader 注释生成插件

• Chinese(Simplifide) Language... (汉化vscode)

• Open in Browser （创建右键以浏览器打开html文件）

• Auto Rename Tag （自动重命名配对的html/xml标签）

• CSS Peek （追踪样式）

• code Runner (vscode 控制台工具)

• Live Server (保存文件，自动刷新浏览器页面，需以文件夹方式打开）

• cssrem （辅助rem和px单位转化）

• px2vw：辅助px转vw,可以在vscode中修改宽度大小

• Easy less：自动转换.less文件

  // 配置生成css文件的保存位置： 在扩展设置`settings.json`中配置
  "less.compile": {
      "out": "../css/" //设置css保存的位置
     //与当前文件夹同级的css文件中
  }
  

• http-server：在任意本地目录，快速搭建服务器（可给出本地、局域网、公网地址）

  # 全局安装
  npm i install http-server
  # 任意路径下的命令行窗口输入
  http-server
  

• vscode-icons（图标插件，使用更好看的vscode中的文件管理的树目录显示图标，没啥用）

内容提供

• Spline 在线3D设计
• Apache ECharts 可视化图表

通用教程

• 学习路线
• 前端知识图谱
• 菜鸟教程
• W3School
• MDN网络文档
• iLovePDF | 为PDF爱好者提供的PDF文件在线处理工具

HTML

• HTML速写/Emmet语法规则
• Bootstrap模板_响应式网站模板 - Bootstrap模板库 (bootstrapmb.com)

css相关

• Animate.css
• Less-CSS预处理语言
• CSS3 loading 效果
• CSS Box Shadow Generator - CSS Bud
• 渐变色
  • Tailwind CSS Gradient Generator (tailwindcomponents.com)
  • Grabient
  • CSS mesh gradients generator: Mesher Tool by CSS Hero
  • CSS Gradient — Generator, Maker, and Background
  • Toolbox by SignalSupply
• 动画库
  • lax.js 惊艳的动画
  • [Sal - Lightweight scroll animation library (mciastek.github.io)](https://jquery-plugins.net/lax-js-beautiful-and-smooth-scroll-effects-with-javascript)
  • Vanilla Javascript Parallax Library — Rellax (dixonandmoe.com)
  • Hover.css 鼠标悬停效果和动画
  • Home - React Reveal (react-reveal.com)
  • react-spring

JavaScript

• webpack中文文档
• Babel js语法转化，转为兼容性更好的的代码
• Axios
• 前端跨域解决方案（详解

NodeJS

• Node.js
• Nvm(node版本管理工具)
• npm包共享 平台
• Express - 基于 Node.js 平台的 web 应用开发框架

其他

• Markdown教程/轻量级标记语言
• JQuery
  • JQ在线手册
  • JQ插件库

免费接口

• 天气api接口：www.kancloud.cn/ccjin/yingq…
• YesApi 小白免费接口 | 果创云，一个账号，搞定接口开发
• UomgAPI - 优启梦免费API数据接口调用服务平台
• API数据接口
• 网易云音乐 NodeJS 版 API (binaryify.github.io)
• API接口认证 - 阿里云 (aliyun.com)
• 免费API数据接口平台-京东万象 (jdcloud.com)
• 语义 API，语义分析 JSONAPI，智能机器人API接口 (sojson.com)
• JSON API免费接口 bejson.com

其他（未分类）

• 阿里巴巴开源镜像站-OPSX镜像站-阿里云开发者社区 (aliyun.com)
• 清华大学开源软件镜像站
• Quicker快捷工具
• 百度地图开放平台 | 百度地图API SDK | 地图开发 (baidu.com)
• https://bbs.tampermonkey.net.cn/ //油猴中文网
• 免费空间100M https://free.3v.do/