大前端工具集

最新推荐文章于 2021-08-25 16:33:01 发布

bo o ya ka

最新推荐文章于 2021-08-25 16:33:01 发布

阅读量461

点赞数

文章标签：前端 git 测试 ViewUI

原文链接：http://www.cnblogs.com/276815076/p/5530660.html

版权

这篇博客汇总了前端开发的各种工具、框架、资源和最佳实践，包括前端组织和博客推荐、博客搭建方法、HTML、CSS、JavaScript、项目构建工具、Node.js包管理与项目、精选阅读材料、工具软件及前端炫技。博客详细介绍了从基础知识到高级应用的各种资源，如Hexo和Jekyll用于搭建博客，ECharts和Swiper实现图表和滑动效果，以及Git、Webpack和Babel等开发工具的使用。此外，还提供了前端学习资料、Node.js实战项目、面试题和代码规范，帮助开发者提升技能并保持与时俱进。

摘要由CSDN通过智能技术生成

正文

前端组织/前端博客

虽混过外企俩家，但劳资英文这项的技能点还是灰色的...so，俺关注的站点主要以中文为主

GitHub - 没 Github 都不好意思面基有木有！！！
MDN - 无数的资源再等着你探索，追标准和新特性肯定得关注的网站
Awesomes.cn - 国人维护的前端资源库，深度对接到 Github，分类和展现清晰，值得收藏
如何跟上前端开发的最新前沿 - RT，不解释
慕课 - 大量的在线计算机课程。虽然初、中级居多，但是不乏有巨作值得细细品尝
阮一峰 - 关注多年，拜读其 ES6 系列。虽网传靠写书进鸟阿里，但博客内容确实够丰富
W3Cplus - 大漠(《图解 CSS3》作者)在国内的影响力杠杠的，Sass 专家级
淘宝前端团队 - 内容涵盖 Web 和 Node，要深度游深度，要广度有广度
奇舞团博客 - 坚持是最宝贵的，别人的奇舞周刊早已经过百期了
百度 FEX - 代表作 FIS、UEditor、WebUploader、KityMinder
腾讯全端 AlloyTeam - 腾讯 Web 前端团队，博客真的有点丑...
粉丝日志 for 张丹 - 大爱作者写的 Node 系列
张鑫旭 - 成名多年的、高产的前端大湿，CSS猛人

博客搭建

Hexo - 快速、简洁且高效的博客框架，照着文档分分钟就可以在本地跑起来。Github 地址:Hexo
Jekyll - 将纯文本转化为静态网站和博客。由于环境依赖的问题，所以安装起来可能稍费劲那么一点。Github 地址：Jekyll
GithubPages - 免费的静态站点。配合着 Hexo 或 Jekyll 的模板，分分搭建出一套炫酷的个人博客
Tumblr - 轻博客的祖师爷，各种各样的主题感觉不错
Wordpress - 这玩意古老到都不想介绍

使用 Hexo/Jekyll + GitPage，前端搭建静态博客那是相当 easy。用 Markdown 写文章做记录，再 push 到 Github 上，分分钟高大上有木有

再推荐三款视觉效果极佳的 Hexo 主题，且在 Github 上的 star 都很不错：

不能偏心，所以也推荐三款 Jekyll 的好主题：

So Simple 如果你看过俺的博客，对这个主题就肯定不会陌生啦
HPSTR 当初 fefork 差点选这个主题:)
beautiful

HTML

纯 HTML 相关其实没有好玩的项目，所以这儿展示的内容主要都是一些模板，而且以下列出来的都是免费的，方便拿取搭架后台或者博客

HEAD - 最全的 <head> 列表，真心佩服这种偏执的整理能力
blur-admin - 视觉冲击极强的管理后台，各种动画效果。PS：因为团队有ant-design的使用经验，感觉使用起来不是很顺畅，这套后台又是基于AngularJS，所以再三权限之后还是没实际使用，劳资还是别给团队添乱了，囧...
AdminLTE - 很小清新的后台模板，每次看preview 页面都觉得很有视觉冲击
gentelella - 刚用这个搭建了我司内部用的的数据平台，效果喜人。模板实现的功能比较全，比如登录、注册甚至各种widget，所以最终交付的时候，自己几乎没写几行CSS。
material-design-lite - Star 数超过2W的开源模板项目，包含了多套简洁的 templates，可以用于博客、后台或者企业首页。

CSS

MetroUI - 好看好用，重点是样式特别、个性
Font-Awesome - 图标字体库。相类似的库有不少，大厂都喜欢造轮子嘛:)
LoadersCSS - 用 CSS 技术实现 loading 动画；补一句，想熟悉、理解 keyframes、animation、transform、transition 的童鞋可以直接去读其源码(只有千把行代码)，读完就算出师鸟:)
WeUI - 一套同微信原生视觉体验一致的基础样式库为微信 Web 开发量身设计，令用户的使用感知更加统一
PostCSS - 最近才知道大名鼎鼎Autoprefixer是其插件推荐大漠的文章《PostCSS深入学习》，有关 PostCSS 不是什么？PostCSS 是什么？PostCSS 可以做什么等等问题，文章里面有答案
CSSgram - 图片滤镜库，终于可以用 CSS 在 web 上实现滤镜的效果鸟 IE不支持，不过新的移动设备支持没问题 Can I Use
HINT.css - 一款非常小巧的提示框效果
Balloon.css| |同上，一款非常小巧的提示框效果