中国领先的IT技术网站
51CTO旗下网站
现代Web开发需要学习的15大技术
本文概括了一系列我们应该学习的编程语言/工具，以便于理解势不可挡和快速变化的现代web开发。
作者：小峰来源：码农网| 09:59
将近4年前，我写了一篇名为《Future of Web and Mobile: HTML5, CSS3 and
Javascript》的博客文章，其中我提到了Javascript的出现，以及JavaScript框架，例如jQuery、Knockout等的爆 发。
快进到现在，我发现现代web开发再一次将发生压倒性的改变。信息资讯的铺天盖地令人迷惑，尤其对于初学者而言。首要原因是新的框架，例如 Angular&2和ReactJs出现了，使用了尚未完全定型的ECMAScript
6特性。并且有更多的工具可用于转换ES6代码为普通的旧的JavaScript代码，也就是ES5。
我概括了一系列我们应该学习的编程语言/工具，以便于理解势不可挡和快速变化的现代web开发。
JavaScript
这是唯一一种所有浏览器都理解的编程语言，并且它是前端开发的支柱。JavaScript也被称为ECMAScript，ES 5。在深入其他语言之前好好理解这门编程语言非常重要。
这是Javascript语言的扩展，而且许多浏览器正在实现ES6。好处是哪怕是现在，你也可以开始编写ES6代码，因为你可以使用 transpiler（转译器）如Babel来转换ES6代码为ES5代码。经历这些并了解新功能是一件好事。不过，没有不要钻研得太深因为它们很容易发 生变化。
这是最流行的ES6到ES5转译器之一。此外，它还被许多框架，如React所推荐。要想实时地将ES6转换为ES5代码，在https://babeljs.io/repl/有一个可用的REPL。
需要注意的是Babel不仅仅是ES6到ES5的转译器。它也是JSX到JavaScript的转译器。不知道什么是JSX？那么请看下面。
NodeJS是一个服务器端平台，它允许你用JavaScript语言构建后端。为什么我要提NodeJS呢？这是因为，即使你对后端开发不感兴趣，但是许多前端工具依赖于NodeJS。至少要熟悉node和它的命令行工具。
NPM是node的软件包管理器。就像pip之于Python，ruby gems之于Ruby，以及Maven之于Java。了解如何安装/删除/升级软件包，尤其是package.json文件结构。
Grunt或Gulp
这两个是运行在Node平台上最为流行的任务运行器。从技术上讲，它们是针对npm的软件包。它们允许你自动化许多前端任务，如Lint源文件，串联，缩减，部署以及更多。
这是用于前端库本身的一个软件包管理工具。想添加Jquery到你的应用程序？和使用bower install jquery一样容易。
上述工具用于基本的前端开发已经足够。不过下面我还要说一说两个最流行的框架，即React和Angular。
ReactJs是构建视图最流行的前端库。请注意，它不仅仅是MVC中的V，因此和框架如Angular没有比较性。ReactJs是用ES6写的，并且可以用Babel转译为ES5。它还使用也可以用Babel转译为JavaScript的JSX。
WebPack或Browserify
这两个都是最流行的模块打包机。它们可以获取js源代码，找出正确的依赖关系，并发出可以驱动整个应用程序的JavaScript文件。我更喜欢WebPack。点此查看关于WebPack。
Flux或Redux
React组件被布置在一个层次结构中。大部分时间，数据模型遵循层次结构。在这种情况下，Flux并不怎么有用。然而，有时候你的数据模型是不分层的。当你的React组件开始接收外部道具，或你有少量的组件开始变得非常复杂的时候，那么你可能会想要试试Flux。
Immutable.js
Immutable.js提供了一套数据结构，可以帮助解决在构建React app时的某些性能问题。这是一个伟大的库，你可能会在你的app中大量使用它，但是当你关注于性能影响时，它就完全没用了。
Angular 2是JavaScript中最流行的MVC框架之一的下一个版本。它被完全重新设计过了，并且有一条陡峭的学习曲线。全面支持双向数据绑定。在选择Angular 2开发时要小心评估。
TypeScript
Angular 2推荐TypeScript作为编程语言的首选。我不是很熟悉TypeScript，但我认为它增加了静态类型到Javascript的动态特性中。最后，我相信它只是一个转译器。
Service workers
实验性的API。它就像是在浏览器用于做各种工作的一个后台线程。我想它也增加对离线浏览的支持。
Fetch API和Push API
请自行阅读链接。因为到目前为止我自己对此也是知之甚少。
译文链接：
英文原文：
【编辑推荐】
【责任编辑： TEL：（010）】
大家都在看猜你喜欢
头条头条热点头条原创
24H热文一周话题本月最赞
讲师：108831人学习过
讲师：171309人学习过
讲师：82830人学习过
精选博文论坛热帖下载排行
Linux出色的网络功能堪称当今操作系统中的佼佼者，无论在功能还是在支持能力上都有令人满意的表现。Linux内置的多个服务器，几乎包含了目前...
订阅51CTO邮刊1、Web 程序员需要了解哪些知识点
Web应用程序主要是运行在浏览器上，我们平时打开的网页就是一个 Web 程序，常见的 Web 技术有：
IP protocols
Coldfusion
2、浏览各式各样的网站
在我们通常使用的浏览器中如 Chrome，Firefox 可以按下 F12 按键（或者右击鼠标=》查看源码）来查看网页的源代码。
网站类型有：企业站、门户站、个人博客、信息百科、社交等。
3、学会使用一种流程图软件
可以是：MS Visio 或 Xmind。
4、熟悉网站结构
熟悉网站的树形结构、站点地图、导航设置等。
5、可以学习一种图片处理软件
6、学习基本的互联网基础知识
基本Web服务协议（HTTP，FTP，SMTP和POP3或IMAP4）
Web服务器软件（Apache、Tomcat、Nginx等）
浏览器（Chrome、Firefox等）
电子邮件服务器和客户端软件
7、学习 HTML 和 CSS
如果将网站比作一个房子，HTML 类似网页的砖头结构，CSS 就是对房子进行装修的材料。
可直接上菜鸟教程网站学习。
8、学习 XML 、JSON 及相关技术
还是菜鸟教程
9、使用 HTML 创建一个简单的静态页面
10、学习客户端脚本语言
客户端脚本语言可理解为房子里头的各种开关：电灯、热水器等。
语言有：JavaScript、VBScript、Java Applet(废弃了)，推荐直接学 JavaScript 吧。
JavaScript 是客户端脚本语言，它很重要，好好学。
再说一遍：菜鸟教程有。
11、学习一种后端语言
可以是 PHP、JSP、ASP.Net等。这些语言主要用于与后台数据的交互，涉及到增加、删除、修改、查看数据等操作。
12、自己尝试写一个小项目
可以是一个个人的博客系统、购物车等……
13、参与一个 Web 项目的开发
学习只是一个开始，最重要的成长还是在项目开发中……
参考地址：/Become-a-Programmer
记住登录状态
重复输入密码17851被浏览895801分享邀请回答6.1K344 条评论分享收藏感谢收起/参与完整个Camp之后，你不光学习到了知识，也获得了开发经验。FCC的论坛里已经有很多零基础学习者通过完成课程之后成功找到开发工作的真实例子。在FCC整个学习路径中，你可以获得四个资质认证：前端开发认证完成前端开发认证需要学习基本的HTML/CSS/JQuery和Bootstrap知识。完成10个前端开发任务，和学习基本的Javascript算法。数据可视化认证学习有关Sass, React 和 D3的技术。开发完成5个React应用，5个D3.js的数据可视化应用。后端开发认证学习Node.js, Express, 和MongoDB相关知识，学习版本控制软件Git等。完成5个API开发任务，5个全栈App开发任务。全栈开发认证运用你所学的知识为公益组织开发真实可用的Web应用。你需要开发两个全新的项目，维护两个已有的项目，这些都是公益组织会真实投入使用的应用，完成也就意味着你有了真正的开发工作经验。点击这里加入：===============================================================已经有很多从知乎过来的朋友加入了，欢迎更多的人参与到FCC当中来，现在就可以加入中文聊天室和大家交流：如果你的英文还说得过去的话，还是推荐到英文官网去学习：===============================================================FCC的题目除了一关一关地学习Web编程知识以外，还有许多需要自主完成的任务，例如创建一个个人主页、当地天气应用、JavaScript计算器、股票应用甚至是克隆Pinterest，完整学习下来并完成所有的任务还是需要付出相当努力的，不过不需要担心，课程的设置完全是从零开始，一步一步，循序渐进的。FCC的题目除了一关一关地学习Web编程知识以外，还有许多需要自主完成的任务，例如创建一个个人主页、当地天气应用、JavaScript计算器、股票应用甚至是克隆Pinterest，完整学习下来并完成所有的任务还是需要付出相当努力的，不过不需要担心，课程的设置完全是从零开始，一步一步，循序渐进的。FCC鼓励Read-Search-Ask的学习方法。即阅读文档和错误-搜索问题-询问他人获得帮助。并且建立了很成熟的社区：在线聊天室：交流论坛：FCC中文社区QQ群：FCC在很多平台上都非常活跃，再给几个比较有用的链接：Youtube频道： 这里有FCC官方的视频课程，学习者为公益组织开发项目的展示等等。Linkedin 大学主页： 是的你没有看错，Linkedin认证FCC为大学机构，你可以把你在FCC学习的经历填写在你的Linkedin主页里。Medium主页： FCC官方分享的一些技术干货等。Github 主页：1.3K148 条评论分享收藏感谢收起查看更多回答　　互联网经过这么多年的发展，已经出现了众多的 Web 开发技术，像 .Net/Java/PHP/Python/Ruby 等等。对于 Web 开发人员来说，不管是初学者还是有一定经验的开发人员都需要时刻学习新的开发技术。如今，网上有各种开发技术的相关网站，有大量开发资料可以参考。下面是我收集的15个非常优秀的学习 Web 开发技术的国外网站，如果大家有收藏更好的网站，欢迎推荐！
是学习Web开发技术最著名的网站之一，订阅者超过10万，分享各种适合不同阶段的开发人员阅读的优秀教程。
CSS Tricks&是学习CSS的最佳去处，发布关于CSS各个方面的教程，想加强CSS技术的朋友一定要收藏。
Smashing Magazine 是最优秀的前端技术网站之一，有各种优秀的前端设计和开发技术文章。
一看名字还以为.NET教程网站，其实这个网站分享的主要内容是前端设计和开发的。
W3Schools &拥有非常齐全的 Web 开发技术资料，包括 HTML/CSS/JavaScript/ASP.NET/PHP/Web Services 等等。
Pixel2Life 拥有好90个类别，超过80,000的教程，有 Photoshop/Flash/HTML/CSS/JavaScript/PHP 等等。
Webmonkey 分享各种 Web 开发和设计文章，有很多文章还是值得一读的。
Treehouse 很特别，是一个会员制的学习网站，是学习Web应用和iOS应用开发及设计的好地方。
Sitepoint 重要分享 PHP、HTML5、CSS3、设计网页设计以及移动开发方面的教程和资讯。
故名思议，是一个帮助在校学生学习Web设计的网站，这个网站很有多精心编写的文章。
是一个历史悠久的网站，创立于1998年，是分享Web开发和设计各个方面内容的优秀网站。
Developer Drive 发布 Web 前端及后端开发的各类优秀教程和资讯，值得收藏。
这也是一个非常不错的学习 Web 开发技术的网站，分享的内容涉及 JavaScript/HTML5/CSS3/PHP 等等。
相信这个网站大家都非常熟悉，主要分享最新的前端开发技术，流行框架等，也有 Java、.NET 和 PHP 方面的内容。
Tutorialzine 是一个分享各种高质量 Web 开发技术教程和资源的网站，偏前端开发。
这是一个神奇的网站，每年的12月份连续发布24篇关于Web 设计和开发方面的文章，其它时间不更新。
您可能还喜欢
本文链接：
编译来源：
阅读(...) 评论()}