首发于2018年08月06日;最后更新于2019年8月15日
浏览器收藏夹实在放不下,记录在博客上还可以分享给别人一起看


综合站点

Devdocs: http://devdocs.io/
印记中文: https://www.docschina.org/
Mozilla(MDN): https://developer.mozilla.org/zh-CN/docs/Web
HTML中文网: https://www.html.cn/ (以前的CSS88)


优质博客

前端博客
阮一峰: http://www.ruanyifeng.com/
张鑫旭: https://www.zhangxinxu.com/
Codeplayer: http://www.365mini.com/
迷渡(justjavac): https://justjavac.com/
HTML5ify(朴灵): http://html5ify.com/
Chrisyue: https://www.chrisyue.com/
羡澈: http://zhangwenli.com/

IT技术综合博客
现代魔法学院: http://www.nowamagic.net/
波黎克斯: http://www.berlinix.com/
一像素: https://www.cnblogs.com/onepixel/
司徒正美: http://www.cnblogs.com/rubylouvre/
众成翻译: https://zcfy.cc/
TooBug: https://www.toobug.net/

其他领域
itellyou(MSDN镜像): http://msdn.itellyou.cn/
老赵: http://blog.zhaojie.me/

入门教程
菜鸟教程: https://www.runoob.com/
W3CSchool: https://www.w3cschool.cn/tutorial


标准与规范

语言规范与标准库
JS基础: http://wangdoc.com/javascript/
WebAPI: http://wangdoc.com/webapi/
ES6入门: http://es6.ruanyifeng.com/
Node.js官方文档: http://nodejs.cn/api/
Node.js的API: http://javascript.ruanyifeng.com/nodejs/basic.html
HTML5规范中文翻译: https://www.w3.org/html/ig/zh/wiki/HTML5
ECMA规范: https://ecma262.docschina.org/

前端其他标准
ES5标准: http://yanhaijing.com/es5/
TypeScript: https://www.tslang.cn/
另有:深入理解TS

HTTP协议
学习HTTP/3协议: https://http3-explained.haxx.se/zh/
学习HTTP/1 2协议: https://github.com/bagder/http2-explained
HTTP响应头: https://zh.wikipedia.org/wiki/HTTP%E5%A4%B4%E5%AD%97%E6%AE%B5

其他规范
YAML: https://zh.wikipedia.org/wiki/YAML
OpenAPI接口规范: https://swagger.io
Markdown语法和文档: http://www.markdown.cn/


Node端

Node.Green: https://node.green/ (查询Node.js对ES标准的支持情况)
NPM: https://www.npmjs.com.cn/
另有:npm使用简介速查指令

服务器

KOA2: https://koa.bootcss.com/
另有:Koa2进阶笔记教程专题站(学习session/路由/请求等)、极客学院教程
Express: http://www.expressjs.com.cn/
PM2: https://wohugb.gitbooks.io/pm2/content/index.html
PM2用法: https://github.com/jawil/blog/issues/7/
Nodemon: https://nodemon.io/

构建工具

Webpack: https://www.webpackjs.com/
Webpack印记中文文档: https://webpack.docschina.org/
另有:Toobug的指南知乎面试题require的五种用法
Babel: https://babeljs.cn/
另有:Babel服务器端实例必用3个插件Babel预设

数据库

MongoDB: https://docs.mongodb.com/manual/
另有:极客教程Node端API
Mongoose: https://mongoosedoc.top/docs/index.html
LowDB单文件: https://github.com/typicode/lowdb

数据接口

GraphQL: https://graphql.cn/
GQL+Koa实战: https://juejin.im/post/5a49e5ccf265da430d585cfd
Restify: http://restify.com/
Restify使用: https://www.ibm.com/developerworks/cn/web/wa-lo-use-restify-develop-rest-api/index.html

MVC框架

Nuxt.js: https://zh.nuxtjs.org/
Egg.js: https://eggjs.org/zh-cn/
(更多见印记中文)

客户端

Electron: https://electronjs.org/
Hexo: https://hexo.io/zh-cn/
另有:HexoEditorHexo-cos腾讯云部署本站原主题BlueLake绑定Github page

渲染模板

Nunjucks: http://mozilla.github.io/nunjucks/
Nunjucks中文文档: https://nunjucks.bootcss.com/
EJS: https://ejs.bootcss.com/
Jade: http://jade-lang.com/
(更多见印记中文)


前端框架

整理: http://frontendtools.com/
整理: https://www.awesomes.cn/
Vue: https://cn.vuejs.org/ (有关Vue的内容已经单独移至另一篇博文)
React: https://doc.react-china.org/
Angular: https://angularjs.org/
(更多见印记中文)


混合开发

Weex: https://weex.apache.org/zh/
Uni-app: https://uniapp.dcloud.io/
MPVue: http://mpvue.com/

微信小程序
开放平台入口: https://open.weixin.qq.com/
文档中心: https://developers.weixin.qq.com/doc/
小程序登录问题: https://developers.weixin.qq.com/community/develop/doc/bd11f741bdc90138ccdb51fa4d4b9896
小程序登录问题: https://ruby-china.org/topics/32128
ColorUI库: https://www.color-ui.com/
框架选型等整理: https://github.com/justjavac/awesome-wechat-weapp


前端库

Require.js: http://requirejs.org/
Require.js中文文档: http://www.requirejs.cn/
Axios: http://www.axios-js.com/zh-cn/
jQuery: http://jquery.cuishifeng.cn/
另见:jQ源码讲解jQ插件站jQ插件站
Zepto: http://www.css88.com/doc/zeptojs_api/
Lodash: https://www.lodashjs.com/
Day.js: https://github.com/iamkun/dayjs (时间日期处理,另有moment)
Licia: https://github.com/liriliri/licia (整合版工具库)
Velocity.js: http://www.mrfront.com/docs/velocity.js (动画效果)
BetterScroll: https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/
撤销/重做:https://github.com/gaoding-inc/stateshot

富文本
MavonEditor: https://github.com/hinesboy/mavonEditor
WandEditor: http://www.wangeditor.com/
Quill: https://quilljs.com
Vue-quill: https://surmon-china.github.io/vue-quill-editor/
石墨文档: http://geekpark.github.io/smeditor.github.io/#/
Vueditor: https://github.com/hifarer/vueditor/blob/master/docs/chinese.md
Vue2Editor: https://www.vue2editor.com/
UEditor: https://ueditor.baidu.com/website/

数据可视化
AntV: https://antv.alipay.com
Chart.js: https://www.chartjs.org/
D3.js: https://d3js.org/
Echarts: https://echarts.baidu.com/
jExcel: https://github.com/paulhodel/jexcel


UI框架库

Bootstrap: https://getbootstrap.com/ (jQ,跨平台)
另见:中文文档中文文档
AntD民间Vue实现: http://okoala.github.io/vue-antd/#!/components
UIKit: http://www.getuikit.net/index.html (jQ,PC端,风格仿照Bootstrap)
LayUI: https://www.layui.com/ (原生,PC端)
LayMobile: http://layer.layui.com/mobile/ (原生,LayUI的手机端)
HUI: http://www.hcoder.net/hui/ (原生,手机端,组件非常丰富)
jQueryWeUI: https://jqweui.cn/ (jQ,手机端,风格仿照微信)
FrozenUI: https://frozenui.github.io/ (原生,手机端,风格仿照手机QQ)
Bulma: https://bulma.io/ (纯CSS,阮一峰有教程)
(更多见印记中文)


CSS相关

CSS3手册: http://css.cuishifeng.cn/
LESS预处理器: https://less.bootcss.com/
SASS预处理器: https://www.sass.hk/ (SCSS是SASS的一种已被普及的语法,不要再分不清了)
OOCSS面向对象CSS: https://www.w3cplus.com/css/oocss-concept
PostCss: http://postcss.docschina.org/
CSS知多少: https://www.kancloud.cn/digest/css-know/77946
常用特效: https://cssfx.dev/
(预处理器相关见印记中文)


持续集成服务

Travis CI: https://travis-ci.com/getting_started
阮一峰的TravisCI教程: http://www.ruanyifeng.com/blog/2017/12/travis_ci_tutorial.html
codecov: https://codecov.io/gh
Jenkins: https://jenkins.io/
Flow.ci: https://flow.ci/
Karma+Jenkins: https://powertech.iteye.com/blog/2051387
百度EFE持续集成介绍: https://efe.baidu.com/blog/front-end-continuous-integration-tools/ (Travis CI+Coveralls)


Docker和Nginx

Nginx文档: https://tengine.taobao.org/nginx_docs/cn/docs/
Nginx文档: http://www.nginx.cn/doc/
Nginx入门教程: https://xuexb.github.io/learn-nginx/
Nginx配置生成: https://nginxconfig.io/
Docker入门: https://yeasy.gitbooks.io/docker_practice/


常用工具

CanIUse: https://caniuse.com/#
Carbon美化: https://carbon.now.sh/
Nginx配置生成: https://nginxconfig.io/
Shield生成: https://shields.io/
Gitignore生成: https://gitignore.io/
正则表达式: https://jex.im/regulex/#!embed=false
浏览器兼容性测试: http://browsershots.org/
浏览器CSS前缀: http://pleeease.io/play/ (难道不是用PostCSS)
CodePen: https://codepen.io/
开源中国综合工具: http://tool.oschina.net/
工具箱整合版: http://www.atoolbox.net/
Cron生成: http://cron.qqe2.com/

转义加密优化:
JS/CSS/JSON/转码工具: http://tool.9958.pw/
JSFuck代码符号加密: http://www.jsfuck.com/
JS代码颜文字加密: http://utf-8.jp/public/aaencode.html
JS混淆加密转码: https://www.css-js.com/
与佛论禅: http://www.keyfc.net/bbs/tools/tudoucode.aspx
玛丽苏加密: https://funnyjs.com/marysue/ (苏莉安)

其他工具
网站时光机: https://archive.org/ (国内上不去)
我的世界Chunkbase: https://chunkbase.com/apps
ProcessOn流程图: https://www.processon.com/
Whois站长之家: http://whois.chinaz.com/
远程工作桌面: https://uzer.me/
WebXSS平台: http://webxss.com/
视频下载: http://www.downfi.com/video/
Youtube下载: https://www.videosolo.com/zh-CN/online-video-downloader/
iqdb图片搜索: http://iqdb.org/
SauceNAO图片搜索: http://saucenao.com/
画图生成HTML: https://sketch2code.azurewebsites.net/


图形字体资源

字体名速查表: http://www.9958.pw/post/html_font-family
前端特效整理: https://zhuanlan.zhihu.com/p/34645979 (知乎方应杭)
免费媒体资源整理: https://www.yuque.com/ruanyf/share/free-photos
界面尺寸: https://www.jianshu.com/p/5f1cab644f99
网站配色: http://color-themes.com

图标库
Iconfont: http://www.iconfont.cn/
IconMoon: https://icomoon.io/app/
SVG-Icon: https://leungwensen.github.io/svg-icon/

PNG、ICON小图
EasyICON: https://www.easyicon.net/
ICON库: http://www.icontuku.com/
FreeClip: https://clipart.info/ (国外免费站,有时候上不去)

艺术字
QT86: http://www.qt86.com/
艺术字转换: http://www.akuziti.com/

素材站
千库: http://588ku.com/
懒人图库: http://www.lanrentuku.com/


图片在线工具

在线PS: https://ps.gaoding.com/#/
在线压缩: http://mini.bxiaob.top/
在线去背景: https://www.remove.bg/
免费图床: https://ddd.cat/
地图柱状图: http://pixelmap.amcharts.com/
词云: https://wordart.com/
循环图生成: https://patterninja.com/
循环图库: http://thepatternlibrary.com/
神经网络放大: http://waifu2x.udp.jp/index.zh-CN.html (上不去可用国内备用服务
创客贴在线设计: https://www.chuangkit.com/
Gopng(.9.png设计): http://alloyteam.github.io/gopng/
半色调二维码: https://spacekid.me/halftone-qr-code-generator/
二维码美化: http://mh.cli.im
泼辣修图在线: http://www.polaxiong.com/editor


技术摘录

阮一峰的优质文章
Flex布局: http://www.runoob.com/w3cnote/flex-grammar.html
Grid布局: http://www.ruanyifeng.com/blog/2019/03/grid-layout-tutorial.html
CORS: http://www.ruanyifeng.com/blog/2016/04/cors.html
WebComponents标准: http://www.ruanyifeng.com/blog/2017/06/custom-elements.html
WebComponents实战: http://www.ruanyifeng.com/blog/2019/08/web_components.html
DOM性能: http://www.ruanyifeng.com/blog/2015/09/web-page-performance-in-depth.html
SSL协议: http://www.ruanyifeng.com/blog/2014/09/illustration-ssl.html
Node事件循环: http://www.ruanyifeng.com/blog/2014/10/event-loop.html
RESTifulAPI设计指南: http://www.ruanyifeng.com/blog/2014/05/restful_api.html
RESTifulAPI最佳实践: http://www.ruanyifeng.com/blog/2018/10/restful-api-best-practices.html
理解RESTiful架构: https://www.ruanyifeng.com/blog/2011/09/restful.html
OAuth 2.0四种方式介绍: http://www.ruanyifeng.com/blog/2019/04/oauth-grant-types.html
理解OAuth: http://www.ruanyifeng.com/blog/2014/05/oauth_2_0.html

Mozilla的更多内容
WebAPI接口: https://developer.mozilla.org/zh-CN/docs/Web/API
HTML手册: https://developer.mozilla.org/zh-CN/docs/Web/HTML
HTTP协议: https://developer.mozilla.org/zh-CN/docs/Web/HTTP
CSS手册(雪碧图/BFC等/边距折叠): https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS

CSS3媒体查询
MDN: https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Media_queries
Runoob: http://www.runoob.com/cssref/css3-pr-mediaquery.html
用法总结: https://blog.csdn.net/u014175572/article/details/49420539

网络与请求
XHR相关: https://www.cnblogs.com/xiaohuochai/p/6036475.html
上传文件编码设置: https://blog.csdn.net/mazhibinit/article/details/49667511
FormData介绍: https://blog.csdn.net/u014607184/article/details/52372551
前端缓存控制: https://zhuanlan.zhihu.com/p/55623075 (知乎方应杭)

CSS和样式
等比例缩放div: https://www.zhangxinxu.com/wordpress/2017/08/css-percent-padding-image-layout/
padding-bottom百分比值: https://segmentfault.com/a/1190000004231995
with的几个auto属性: https://www.zhangxinxu.com/wordpress/2016/05/css3-width-max-contnet-min-content-fit-content/
理解伪元素: https://www.cnblogs.com/ranzige/p/4554484.html
另见:content属性应用
CSS世界中的相册效果: https://designshack.net/articles/css/use-pseudo-elements-to-create-an-image-stack-illusion/
CSS居中方案大全: https://segmentfault.com/a/1190000013082888
BFC块级格式化上下文: https://www.cnblogs.com/lhb25/p/inside-block-formatting-ontext.html

AMD和CommonJS: https://www.jianshu.com/p/fc858878d891
Chrome桌面通知API: https://segmentfault.com/a/1190000002606430
Session本质: http://www.freebuf.com/articles/web/10369.html (作者360webboy)
障碍辅助属性aria和role: https://blog.csdn.net/dearcode/article/details/52218689
重学前端课程: https://www.w3cplus.com/relearn-the-front-end-techniques.html
聊聊重学前端(作者大漠): https://blog.csdn.net/tja8N2m2G46OMtF/article/details/86587037
前端面试题: https://www.cnblogs.com/hzg1981/p/5718157.html
Git基础: https://backlog.com/git-tutorial/cn/intro/intro1_1.html
方应杭前端押题: https://xiedaimala.com/tasks/e67878e4-ef45-4545-9cad-a1946c6e21f1
ShadowDOM: https://aotu.io/notes/2016/06/24/Shadow-DOM/index.html
Webpack优化: https://segmentfault.com/a/1190000007891318
渲染原理优化: https://segmentfault.com/a/1190000019504744?utm_source=weekly&utm_medium=email&utm_campaign=email_weekly