认识达内从这里开始

随着互联网的不断发展，我们在选择编程开发语言学习上也有了更多的选择目标。今天，我们就一起来了解一下，想成为专业的web前端开发程序员都需要掌握哪些能力。

学习HTML基础

HTML让你的页面变得有结构。它就像人类的骨架，让你保持站立。一件事情就是学习它的语法及其它提供的每一样东西。那么现在，你应该把焦点集中在下面这些点上：

学习基础并学会如何编写语义化的HTML

了解如何将页面划分为多个部分以及如何正确地构建DOM

任务 —：一旦学会了HTML的基础知识，就要至少制作5个HTML页面。我推荐你选择网站上的页面，例如：查看任何github上的个人资料页面或twitter的登录页面。并专注于正确构建内容。尽管目前看起来是丑陋的，但先不要担心这一点，把主要的精力放在页面的结构上。

学一些CSS

现在我们已经学会了如何为页面准备骨架，是时候在上面添加一些皮肤并让它看起来更漂亮了。CSS——用来美化你HTML页面的级联样式表。

你先要做的是学习语法并熟悉常见的CSS属性。

了解box模型以及如何使用Grid和Flexbox来准备布局。

一旦你完成了这个任务，再来学习如何让你的网站对媒体的查询做出回应。

任务 —：一旦你掌握了基本的东西，你接下来要做的就是在后一步中完成你所设计的HTML页面。例如，如果你为Github的概要文件编写了HTML页面，那么是时候应用CSS并让它看起来就像实际的Github页面。在前面的步骤中所写的5个页面都应该这样做。

学习JavaScript基础

JavaScript可以让你添加更多的交互到HTML页面。例如你可以在网站上看到的所有这些滑块，弹出和显示提醒，还有重新加载页面的特定部分而不用刷新整个页面，都是使用JavaScript完成的。这一步，你将要学习JavaScript为旅程做准备——

学习它的语法和基础框架。

学习如何使用JavaScript操作DOM，例如如何使用JavaScript将页面中的一些元素删除，如何添加元素，添加或者删除类，应用CSS样式等等。

在完成了这些之后，学习并理解像范围，闭包，提升机制，以及事件冒泡等这些概念。

学习如何用通过XHR或者Ajax调用HTTP。Ajax可以执行特定的操作而不用刷新整个页面。

学习了之后，现在该学习ES6+中的所有新特性。ES6只是JavaScript的一个版本，它引入了大量语言方面的有趣的更新，例如类，声明变量的不同方法，向数组添加新函数，字符串连接等。由于老式浏览器不支持，你在网上可以找到的大部分文章会用Babel来解析ES6，它是一个将新JavaScript转换到老式JavaScript的转换器。但是现在不用担心Babel，只要了解这个概念，在实践的时候在任何支持ES6的新的浏览器使用它就可以。我们之后会重提ES6的。

我应该学习jQuery吗?

有一段时间每个人都热衷于jQuery，而且理由充分;它是一个很强大的库，为JavaScript的上层提供了一个封装，让你可以用浏览器兼容的方式执行任何操作。但是那段时间已经过去了，在新的项目中现在用它没有那么多了，但是还有一些人在用。你不用必须学习它，但是它真的很简单，而且如果你想去看看，它会对你有好处。

实践时间

我说了很多次，而且在这我再次提起了它，如果没有实践，你什么也学不会。短时间内你可能感觉你都明白了，但是如果你不实践，就会忘记。确定你尽可能多的实践，虽然你跟着路线图。

继续使用JavaScript为一些响应式网站添加交互。你可以复制当前你能在网上找到有趣的web网页，但是记住要把至今所有学到的东西都用上。

一旦已创建了一些网站，该进入到真实的业务中了。

节选：开源翻译

【免责声明】：本内容转载于网络，转载目的在于传递信息。文章内容为作者个人意见，本平台对文中陈述、观点保持中立，不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。