跳到主要内容位置

11个前端工程师必备的网站

张旭乾
软件工程师 / B站UP主

好多小伙伴有疑问,就是说有哪些值得去关注的前端网站,我知道大家可能都苦于找不到一些有价值的,还有值得信赖的网站去学一些比较货真价实的前端技术。生怕有哪些水文或者是一些乱七八糟的网站,把咱们的这个知识给误导了。这里呢我准备了几个我经常关注的一些网站,一部分是国外的,然后有一部分是国内的,因为国内的好多的都是质量参差不齐,但国外的话普遍的质量比较高(事实如此)。不过呢,咱们国内的也有一些比较好的平台,我在这里给咱们一共准备了 11 个可以关注的网站。

国外

首先咱们先看看国外的。国外的网站一般作者都会用一些真实的数据或者例子去支撑他的论点,所以说他们的这些网站的信息都比较权威,尤其是一些库和框架的官方文档,这些是一定要看的。

MDN

MDN 他原来是 Mozilla 开发者中心, 也就是出火狐浏览器的那个组织的,但是呢,现在他是由一群社区的开发者,还有一些文档专家来维护的这么一个文档项目,它上面有好多关于 web 开发的一些文档,有 html, JavaScript 和 css,还有浏览器内置的一些 web API,包括还有后端的 node.js 和 express 开发。他的文档都很权威,而且很全面,还很新。是咱们这个前端工程师必须要关注的网站。

MDN Web Docs

Caniuse

Caniuse 这个网站它是用来查询一些 css 特性或者是 JavaScript 的特性,能不能在咱们当前的这个浏览器版本里面用,它会有一个详细的列表来显示这个特性哪些浏览器支持,哪些浏览器不支持。如果咱们大家不确定一个属性能不能在一个浏览器上用,可以通过这个网站去查一下。

Can I use... Support tables for HTML5, CSS3, etc

Css-tricks

这个网站是主要介绍 css,另外呢也会有 html,JavaScript 和 php 的文章。他的文章大部分都是关于怎么实现一个 css 的特效,然后有一些 css 的最佳实践,比如说响应式布局,Flexbox 属性详解,或者是实现某一个特定的组件。它的内容有文章形式的,也有视频形式的,还有一些代码的示例,咱们想实现一个特效的时候,可以在这上面找一找。

CSS-Tricks

Codepen

它是一个在线的代码编辑器,它还支持社交的功能。这样他有好多前端工程师,就把用这个在线编辑器写好了代码共享出来,他这个代码涉及的类别就比较多了,有关于网页组件的,还有关于游戏的,还有关于 3d,和 canvas 的这种。他的首页有列出来的一些比较热门的,大家可以没事浏览浏览,找找灵感。上面的牛人也比较多,它们写的代码都比较高深。

CodePen: Build, Test, and Discover Front-end Code.

Medium

Medium 是一个现在很火的,特别大的博客平台,它上面的文章什么类别都有。然后关于编程的也有不少,当然也有咱们关于前端的。如果大家用谷歌搜索过的话,那么大部分的搜索结果可能都是这个 medium 平台上的,这上面的文章质量也都比较好。适合咱们大家做一些深入的概念性的学习。

Medium – Get smarter about what matters to you.

Hacker noon

hacker noon 也是一个关于软件开发的平台, 上边也是各种关于软件开发的主题,比如说有加密啊,代码,还有一些创业的,或者是社区、AI 等这些类别。里面关于前端的也不少,而他的文章呢也基本上算是入门到中级的这种比较多。作者的一般文风都很通俗,咱们这一看就能看懂,所以说适合学习一些新的框架的入门还有进阶一点教程

Hacker Noon

StackOverflow

Stackoverflow,这个算是一个比较老的网站,也算是全世界程序员都知道的一个网站,他是程序员用来问问题还有回答的地方,上面的问题也都是比较精辟,然后回答的也都比较详细,因为它这个社区有一个特别严谨又特别完善的规范,不是什么人都能问出一个好的问题来,如果问得不好的话就会被关闭,回答的不好的话也会被人呛,所以说他这种严谨的规范就造出来了这么一个比较完美的社区,这上面基本上所有的软件开发的问题都能在上面找到,大家搜问题的时候在谷歌上那肯定出来的结果前几条就有这个网站,大家没事也可以去浏览一下,看看有哪些待解决的问题,自己也可以去试着回答一下。只有在自己给别人讲明白了之后,才能说明自己真正的懂了。

Stack Overflow - Where Developers Learn, Share, & Build Careers

freecodecamp

FreeCodeCamp 这个网站就比较好玩,它主要是学前端的。然后呢,它是有一系列的学习步骤,然后每个学习章节都有一些小的练习题,然后等把这一套练习都做完之后,就能把这个技术给掌握了。另外呢,他最后还会有练手的项目让大家去做,把这个学完之后,他还可以给你颁发一些证书。

Learn to code|freecodecamp.org

各个库的官网

再接下来就是一些库的官网,比方说 react, vue, angular。 咱们要学习的话,就去看看它们官方文档的入门示例,把第 1 个项目跑起来,然后慢慢的再去研究它一些高级的特性。能尽快的运用到工作中去,就先应用到工作中去,一些高级的东西可以在工作中慢慢的再去学。

国内

好,咱们说完国外的一些网站之后,就来看看咱们国内的,因为国内的就好多文章都是一模一样的,而且有的还是标题党,只有一点点东西,所以说好多就是浪费时间,不过还是有一些好的大家也可以自己去鉴别一下。

SegmentFault

思否这个网站算是质量也比较高的,之前有好多同事也推荐给我看,但是呢,他就是只记得这个 logo 是绿色的,他也忘了这个名字是什么,大概这个网站知道他名字比较少,是因为这个名字又长又不好记,它叫 segment fault。里面也是各种文章都有,但是对于前端也是比较多的。

SegmentFault - 思否

掘金

掘金跟那个 segment fault 这个网站基本上类似,这也是有各种类别的,然后前端的话也算是比较热门的一个类别,但是呢,他这个重点咱们看一下他们这个官网,前端的这些热榜基本上就是关于面试的,还有工作原理的,另外还有一些实践的项目。

掘金

掘金 - 个人主页

简书

简书这个现在已经慢慢的淡出程序员的这个视野,因为他最近改版改的对这个作者都很不友好,但是呢,好歹他也火过一阵,所以这里再推荐一下,上面还会有一些遗留的比较好的文章。大家如果搜索某个问题或者是某个概念的时候,关注一下这个简书的搜索结果也可以。

简书 - 创作你的创作

CSDN

CSDN 算是一个特别老牌的社区了,我也是从 2010 年在上边写了第 1 篇文章,然后到现在就已经有 10 年多了,也断断续续的没写过多少,当时 10 年的时候写文章还是有好多阅读量,但是现在的话写完基本上就没什么看, 上面的人就已经是特别爆满了,而且。这文章也是质量参差不齐,它的推荐系统也一直在改版,所以现在还不好说未来是什么样子。如果大家用百度搜问题的话,可能它的这个搜索结果会比较多,但是就是对作者不太友好,因为他有好多文章就是容易被抄袭,好多就是写的一模一样的。但是呢,它上面有一些新闻,还有一些有价值的文章,大家还是可以去关注一下。

CSDN - 专业的技术社区

CSDN 我自己的博客

好了,这些就是我平时会去看的一些网站,我相信大家应该也都差不多知道这些,因为前端还有关于编程的网站也不是特别多,但是呢,如果小伙伴们没接触过这些网站的话,也可以去看看,同时呢也能了解我自己平时都是怎么学习的。希望这个文章能对大家有帮助,如果有什么疑问的话欢迎给我留言。

提示

一系列的课程让你成为高级前端工程师。课程覆盖工作中所有常用的知识点和背后的使用逻辑,示例全部都为工作项目简化而来,学完即可直接上手开发!

即使你已经是高级前端工程师,在课程里也可能会发现新的知识点和技巧,让你的工作更加轻松!

《React 完全指南》课程,包含 React、React Router 和 Redux 详细介绍,所有示例改编自真实工作代码。点击查看详情。

《Vue 3.x 全家桶完全指南与实战》课程,包括 Vue 3.x、TypeScript、Vue Router 4.x、Vuex 4.x 所有初级到高级的语法特性详解,让你完全胜任 Vue 前端开发的工作。点击查看详情。

《React即时通信UI实战》课程,利用 Storybook、Styled-components、React-Spring 打造属于自己的组件库。

《JavaScript 基础语法详解》本人所著图书,包含 JavaScript 全面的语法知识和新特性, 可在京东、当当、淘宝等各大电商购买