现代前端网络开发是一种极端体验：许多人喜欢它，其他人则鄙视它。
长沙网站建设是现代网络开发的忠实粉丝，虽然我会把它描述为“神奇” - 魔术有其优点和缺点：
当您了解如何使用网络开发的神奇工具（babel！bundlers！watchers！等！）时，您的开发工作流程快速，强大且令人愉快
如果你不明白的web开发的神奇工具，这是非常令人困惑
...并且试图了解魔法是如何工作的常常是悲惨的，除非你有人帮助引导你解决网络上的行话，热点和过时的信息。
最近，我一直需要向那些只有粗略的香草网络开发工作流程的人解释“现代网络开发工作流程”......
这很难解释！
即使仓促的解释也会持续很长时间。
因此，在努力编写更多我的解释时，这是对Web开发演变的长期而仓促解释的开始：
第1部分：我们如何从静态网站到巴贝尔
- - - - - - - - - - -
最简单的网站：静态网站
让我们从“经典”前端Web开发开始，我将假设您 - 读者已经理解。
在经典的前端Web开发中，我们直接修改HTML / CSS / JavaScript文件。要预览更改，我们在浏览器中本地打开HTML文件，并在开发时刷新页面以进行更新。
开发流程
开发工作流程如下所示：
在Atom等文本编辑器中编辑HTML / CSS / JavaScript文件。
将文件保存在文本编辑器中。
在浏览器中打开并重新加载文件。
编辑JavaScript，保存文件，刷新页面以查看更新
部署
然后，当您想将网站发布到互联网时，只需将HTML / CSS / JavaScript文件上传到互联网。
那太简单了！为什么我们让事情变得复杂？！
因此，如果您了解“经典”Web开发工作流程的工作原理，您可能会问：Gee，这非常简单方便。为什么我们偏离了那个？！为什么现代Web开发流程如此复杂？
简短的回答：...好吧，也许我有两个简短的答案。
两个简短的答案：
你不具备，使之更加复杂。“经典”的Web开发工作流程非常棒！并且足以满足您的需求！您永远不应该添加多余的工具或您不理解其目的的工具。
但对于某些项目，您将从更复杂的工作流程中受益。您添加到工作流程中的每个工具都旨在解决问题。
为了理解现代Web开发的工具，我们必须了解 Web开发的问题。
在这个漫长而仓促的旅程中，我们将逐个解决每个问题，从一个已经存在了几十年的旧网络开发问题开始：
一个老问题：JavaScript的局限性
直到最近，JavaScript和Web API都有很多限制（由于无数的原因，这个长期'匆忙的帖子都不会涉及）。
举几个例子来说明：
没有模块
没有常数
没有承诺/异步
没有Array.includes（）（!!）
很多常见基元的笨拙语法/缺失（没有for-of，模板文字，箭头函数语法，模板解包......）
（Web API）无数的DOM操作不必要地复杂（比如添加/删除类名，隐藏元素，选择元素，删除元素......）
浏览器只能执行JavaScript，因此当JavaScript语言存在限制时，就不会像使用其他语言一样; 你必须使用你拥有的东西。
旁白：JavaScript和Web API之间的区别？
您可能已经注意到我在上面说过“JavaScript和Web API”。这是两件不同的事情！
当您为网页编写JavaScript时，任何与网页本身交互的API调用都是Web API（恰好用JavaScript编写），而不是JavaScript语言的一部分。
一些例子：
Web API：document以及每个方法document; window和每一种方法window; Event，XMLHttpRequest，fetch，等。
JavaScript的：函数，const/ let/ var，阵列，Promise等
因此，例如，如果您正在编写Node.js服务器，那么您将使用JavaScript编写，这意味着您可以使用例如Promises但您无法使用document.querySelector（也没有意义这样做）。
一个古老的解决方案：jQuery和朋友
早在2006年，jQuery就发布了：它是一个帮助解决JavaScript和Web API的许多缺点的库。
jQuery包含有助于显着处理常见Web任务的API，如DOM操作，异步处理，跨浏览器差异和资源获取。
所以基本上：所有这些东西在技术上都是可能的，使用旧的JavaScript /旧的Web-APIS，但它们非常烦人，乏味，而且通常很难编写代码 - 所以不要让每个Web开发人员编写相同的繁琐代码，例如下载和进程和JSON文件，您可以改为下载jQuery库并使用jQuery的漂亮API。