前端入门湿货整理

因为水平不够，整理出来的东西不能叫干货

前端的入门

有人总结了前端工程师的必须清单，但其中也有些过时的，和一些很后期的东西。需要甄别着学。

一名【合格】前端工程师的自检清单

永远绕不开的三件套：HTML CSS JavaScript

权威的资料库，不仅有三件套知识，也有很多其他网络知识。

学习 Web 开发 | MDN

其他三件套学习好网站

W3Schools Free Online Web Tutorials

w3school 在线教程

菜鸟教程 - 学的不仅是技术，更是梦想！

w3cschool菜鸟教程

视频教程

目前国内，B站已经形成了编程技术资料发布的主要平台。做这方面的up主都会在B站开设账号。只要输入关键词搜索都会出现一大批视频，而且质量颇高。

[](https://www.bilibili.com/v/te...)

nodejs

当学会了一些基础之后，正真进入有生产力的开发模式，你一定绕不开nodejs

中文官网

Node.js 中文网

npm

所有发布的库都登记在此，可以查看使用方法等。

npm

webpack

本身只是npm中的一个库，但是它的地位很重要。官网上这样定义：

本质上，webpack 是一个用于现代 JavaScript 应用程序的静态模块打包工具。

webpack

框架

react

中文官网

React 官方中文文档 - 用于构建用户界面的 JavaScript 库

Vue

最新的版本是3，3和之前的版本有很多不同，现在入门建议不用看以前的版本资料了。

angular

三大框架中最没落的一家，大概率用不上，建议放弃。

Angular

JS的加强版TypeScript

TypeScript中文网 · TypeScript--JavaScript的超集

前端游乐场

有这么一类网站，可以在网页上进行前端编程。想试试某些效果的时候非常好用。

codepen

非常有名的网站，有非常多的前人做好效果分享，省去我们重头做事的麻烦

Create a New Pen

codesandbox

特点是预设了很多框架，我们本地不用npm install也可以玩各种东西了

CodeSandbox: Online Code Editor and IDE for Rapid Web Development

其他

还有很多我就不例举了，搜索这些关键词 best js playground 自然会出现很多推荐文章。

开发IDE

工欲善其事必先利其器

vs code

最火的免费开发IDE，没有之一。

当然不仅是前端，各种语言都可以用它开发。

Visual Studio Code - Code Editing. Redefined

Web Storm

功能强大但是收费。

[](https://www.jetbrains.com/web...)

浏览器调试

按了F12，才知道打开了一扇新世界的大门

你可能不知道的chrome调试技巧

浏览器的过去与现在

了解一下浏览器的发展史和现状，对于之后的学习和开发非常有好处。

前端万字精华--浏览器简史及其核心原理详解

碰到问题

不懂就问，是个好习惯。

根据个人经验，计算机类问答网站首推还是stack overflow最靠谱。不要害怕英文，用网页翻译可以解决99%的问题。

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

总之，搜索是个好东西，别忘记用。（有条件的推荐上谷歌，谁用谁知道）

前端入门湿货整理