平时上网有随手收藏感兴趣网站的习惯，上学的时候大部分收藏的都是游戏音乐电影不可描述之类的网站，工作之后反而全是技术学习资讯之类的了。前几天整理浏览器书签的时候，发现竟然有二百多个书签了，而且一不小误删了几十个恢复起来非常麻烦，于是觉得有必要换种方式记录一下，同时精选一些觉得不错的网站分享给有需要的同学。
文章（包括以往的文章）和浏览器导出的完整书签放在github上以作备份，后面可能会更新添加新内容。
如果部分国外网站访问不了的，请自行解决。
开发工具
平时工作开发时用到的一些辅助工具类网站
| 网址 | 说明 |
|---|---|
| regexr.com | 正则表达式验证匹配 |
| www.gitignore.io | 根据选择生成.gitignore文件 |
| unbug.github.io/codelf | 变量命名推荐（支持中文） |
| www.html.cn/tool/css3Pr… | css box-shadow阴影预览及代码生成 |
| www.internetke.com/jsEffects/2… | css渐变预览及代码生成 |
| xuanfengge.com/easeing/cea… | css动画缓动函数预览及生成 |
| www.toptal.com/developers/… | 多张图片合成雪碧图，并生成对应css |
| tool.lu | 众多工具集合，包括时间戳转换，进制转换等 |
| www.bootcdn.cn 或 cdn.baomitu.com | 国内的CDN库，速度快 |
| www.jsdelivr.com | 国外的cdn库，支持github，npm，WordPress |
在线编辑
代码在线编辑运行
| 网址 | 说明 |
|---|---|
| jsrun.net | 国内网站，有代码提示，支持cdn库导入，不支持创建项目，有代码示例市场。 |
| jsbin.com | 国外网站，功能少，支持本地搭建 |
| codepen.io | 国外网站，支持cdn库导入，支持创建项目（非会员只支持一个项目），有大量丰富的代码示例市场。 |
| stackblitz.com | 国外网站，有代码提示，支持npm，可以创建项目（默认创建类型没有vue）。 |
| codesandbox.io | 国外网站，支持npm和cdn库导入，可以创建各种类型项目 |
编程题库
通过刷题和编程训练来提升编程思想
- freecodecamp
- freecodecamp中文版（旧版）
- freecodecamp中文版（新版）
- leetcode
- leetcode中文版
- 赛码
- scriptoj
- codewars
- codecademy
注：据fcc社区说法，旧版题目已不再维护更新，推荐使用新版，账号不互通。（感谢Ricowang评论指出）
视频教程
技术分享和教程视频。
| 网址 | 说明 |
|---|---|
| Frontendmasters | 有很多大佬的课程，英语课程，英文字幕，少部分课程免费，大部分需要订阅会员，费用较贵，可以等黑五打折时买年费。 |
| Egghead | 英语课程，英文字幕。 |
| IT大咖说 | 国内技术大会分享录像为主。 |
| 慕课 | 国内网站，免费课挺多，实战课付费，按课付费，价格偏贵。（其他如腾讯课堂，网易云课堂等都差不多一个路数） |
| Udemy | 网站有中文语言和中文课程，大部分英文课程也有中文字幕，按课收费，打折中的付费课程还算能接受。 |
可能看视频更加清楚直观，所以很多人都更喜欢看视频，尤其是刚入门的时候。网上现在也有很多培训机构的课程视频，能找到了也可以看一看，但是进阶时建议多看些国外视频，拓宽下视野，顺便练下英语能力。
上面大部分网站的视频还是付费的，如果想看免费的视频其实可以看youtube，上面技术分享的视频也非常多，重点是都是免费的。
下面推荐几个youtube的技术账号，可以关注一下。
这只是我关注的一部分，还有非常多，大家可以自行探索。
文章资讯博客
学习技术，了解行业最新动态。
国内
- 掘金
- 博客园
- CSDN
- 简书
- infoQ
- 大前端
- 众诚翻译
- w3ctech
- v8
- w3cplus
- 张鑫旭博客
- TechBridge博客
- 酷壳 左耳听风博客
- 淘宝 FED
- 京东凹凸实验室
- 百度 FEX （技术周刊还在更新）
- 奇舞周刊 （建议公众号订阅）
- 大搜车技术团队博客
国外
- Echojs
- Front-End Front
- Hashnode
- css-tricks
- Devchat （音频形式）
- Medium （可订阅邮件）
- Dev （可订阅邮件）
- HTML5 Weekly （可订阅邮件）
- CSS Weekly （可订阅邮件）
- JavaScript Weekly （可订阅邮件）
- React Status （可订阅邮件）
- Ponyfoo （可订阅邮件）
- Jake Archibald blog
- Dan Abramov blog
- David Walsh Blog
建议申请一个专门用来接收订阅邮件的邮箱，因为会接收到大量邮件
问答论坛
开发中遇到问题，去这些地方就对了。
| 网站 | 说明 |
|---|---|
| 知乎 | 没什么说的，有了知乎应该没有人会再去用百度知道那垃圾东西了吧。 |
| Segmentfault | 更专注技术问题。 |
| Stack Overflow | Segmentfault的外国原版，非常强大。 |
| cnodejs | node社区 |
| react-china | react社区 |
| V2EX | 程序员的1024？ |
开源框架和库的问题，去github上找到项目查询issue通常都能找到解决方案。
github相关
毕竟全球最大同性交友平台，上面牛逼的人和项目非常至多，除了轮子也有很多教程，这里推荐一些对前端学习有帮助的项目。
| 项目名 | 说明 |
|---|---|
| 30-seconds-of-code | 短小精悍的工具函数，有中文版。 |
| Front-end-Developer-Interview-Questions | 前端面试题整理，有中文版，没答案。 |
| front-end-interview-handbook | 前端面试手册，有中文版，带答案。 |
| Front-End-Checklist | 前端开发清单 |
| javascript-algorithms | js算法和数据结构 |
| 33-js-concepts | 前端开发需要掌握的33个概念，有中文版。 |
| awesome-javascript | javascript资源列表，有中文版。 |
| nodebestpractices | node最佳实践列表，有中文版。 |
在github上，awesome-*相似名称可以找到其他类似项目，比如node资源列表awesome-node，react资源列表awesome-react。
学习的时候不建议以面试题为主，不容易形成体系。
最后
这里整理的网站，是我比较常看的，一些久未更新的就没有列出来，而且可能会遗漏一些网站，如果大家还有其他优秀的学习网站也可以评论分享出来，希望这些网站能够大家的学习和平时开发带来帮助。
今天的文章前端工作学习相关网站收集整理分享到此就结束了，感谢您的阅读。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
如需转载请保留出处：https://bianchenghao.cn/14278.html
