行业内每年都会出现新的技术和工具来提高开发者的工作效率，为用户提供更好的网站。对他们来说，在Web开发游戏中保持领先的挑战变得越来越大。
今天我们就来讨论一下2020年成为Web开发者的完整地图。这将是所有开发者的实用指南。让我们和前锋广州边肖一起来看看吧！
1.首先确定你的目标或者路径。
我们将讨论许多技术、趋势和工具，但我们不希望你不知所措，所以你需要首先决定如何成为一名Web开发人员，因为这将帮助你选择正确的工具。还有学习技术。
成为一名Web开发人员有很多原因。以下是一些选择因素:
你想去公司做网页开发，这是最常见的原因。
你想以自由开发者的身份开创自己的事业或代理公司。
可以做其他公司的顾问。
你可以创建自己的应用来赚钱。
编码是你的爱好。
从以上感兴趣的领域或目标，你可以为你的目标选择合适的工具和技术。如果你的目标是成为前端开发人员，可以选择前端开发的工具和技术。后端和全栈开发也是如此。
2.Web开发的基本工具和软件
电脑和操作系统:没有电脑和操作系统，就写不出代码。学习Web开发，不需要什么高端电脑。您可以使用任何类型的中型笔记本电脑或台式机。对于操作系统，可以使用适合自己的MacOS、Windows或者Linux。
文本编辑器/IDE:毫无疑问，VSCode适用于大多数情况和大多数语言。它具有良好的性能、出色的可扩展性、内置的终端功能和大量的功能。在2019年StackOverFlow调查中，VSCode也是开发者的首选。也可以选择一些其他的好的选择，比如Sublime Text或者Atom。如果说IDE，那就是Visual Studio，Eclipse，Netbeans。是个不错的选择。
网页浏览器:Chrome或Firefox是大多数开发者的首选。Chrome速度快，使用V8引擎。火狐也有了很大的进步，有些好东西chrome浏览器里没有。两种浏览器都有优秀的开发工具，可以排查Web开发中的问题。
终端:您将使用一些系统命令在CLI中完成大量工作。您可以为您的Web开发项目使用默认或第三方终端。Bash、Zsh、Powershell、Git Bash、iTerm、Hyper都是可用的选项。
设计:不是每个人都需要学习。在公司里，有专门的团队做图像、logos或者草图，但是如果你是自由职业者，你可能要学习Adobe XD、Photoshop、Sketch或者Figma。
3.从HTML和CSS开始
HTML和CSS是Web开发的基本构件。不管你的Web应用有多高级，也不管你用的是什么框架和后端语言，都必须使用HTML和CSS来构建前端应用。所以，这是Web开发首先要学的。
HTML5
CSS颜色、字体、位置、盒子模型等基础知识。
Grid和Flexbox对齐内容或创建列。
CSS自定义属性
4.响应式布局
您的应用程序应该可以在所有类型的设备上查看和使用。因此，知道如何创建响应式设计或布局非常重要。我们来看一些重要的话题。
了解如何设置视口
媒体询问不同的屏幕尺寸。
流体宽度
雷姆单位
先移动
5.自定义可重用的CSS组件
与其依赖大型CSS框架，不如创建自己的模块化、可重用的CSS组件在项目中使用。如果您构建自己的自定义设计，则不需要导入完整的库。您创建只需要特定UI的组件。
最近，CSS的新趋势也出现了可以帮助更有效地编写CSS代码的代码。如果你已经知道了CSS，那么你就不需要花很多精力去学习Saas。Saas CSS预处理器可以给标准CSS增加更多的功能，使其更加高效。
可以使用变量、嵌套和条件语句来减少CSS的重复，提高效率。您还可以为每个可重用组件创建一个单独的Saas文件。Sass确实节省了很多时间，所以2020年绝对要学。
6.CSS框架
CSS学习框架不像去年那么流行了，但是对于不擅长设计的开发者来说还是很有相关性或者很有用的。有许多流行的CSS框架可用，其中一些如下。
Bootstrap是最流行的CSS框架。学习计划也有助于学习其他框架。
Tailwind CSS是另一个流行的框架，它与其他框架几乎不同。它是一组实用程序类，所以你可以创建自己的按钮和其他看起来与其他按钮不同的东西。它们也是高度可定制的。
物理和化学的
布尔玛
7.前端语言必须是Javascript。
学习完HTML和CSS之后，接下来需要学习的是香草Javascript。对于开发者来说，掌握javascript的基础知识非常重要。你会在服务器端语言中用到很多javascript，如果你想和React、Angular、NodeJS、Vue或者其他任何javascript框架或库一起使用，你真的需要学习这门语言。这里有一些你应该在javascript中涉及的重要主题…
Javascript的基础知识
数字正射影像图
数据
提取API
如果你想移动到React，Vue，Angular或者其他框架，现代JS概念对于学习是非常重要的。
8.一些重要的工具
一些工具将用于Web开发。这些工具将帮助你调试、提高生产力、管理代码、与其他开发者合作等等。让我们来讨论其中的一些工具。
Git和Github是2020年你一定会学到的最流行的工具。Git有助于与其他开发人员合作和管理代码。也可以选择一些其他的选项，比如GitLab，Bitbucket等。
了解如何使用浏览器开发工具。无论是chrome还是firefox，都应该知道如何使用不同的标签页，比如元素标签页、javascript控制台、请求和响应的web标签页、应用程序标签页以及其他不同用途的标签页。
大多数IDE或文本编辑器都有添加扩展或插件的能力，这对提高生产力和构建Web应用程序非常有帮助。例如，Visual Studio代码中的VSCode扩展可以帮助下载扩展，如实时服务器或实时saas编译器，以便与React一起使用。
Emmet是另一个伟大的工具，它允许你编写非常快速的HTML和CSS，这有助于提高开发人员的生产力。
学习javascript包管理器，比如NPM和Yarn。如果你用的是Javascript框架或者库，那么这些包管理器会用很多，但是对于其他语言，你会用不同的包管理器。
如果要在前端安装NPM软件包，必须使用Webpack或packages。如果你想创建自己的模块，或者把一个javascript文件带到另一个中，默认情况下不能只使用浏览器来做这些，所以需要Webpack或者package来捆绑。
9.基本部署
至此，一旦你知道了前端开发应该学习哪些工具或技术，你就需要知道如何在互联网上部署前端网站。如果你正在为小型企业构建一些小型应用程序、登录页面或个人网站，你不需要学习AWS或DevOps，只是因为它们闪闪发光、新潮时尚。你会把事情变得比简单更复杂。2020年需要学习一些部署工具和步骤。
域名注册
托管
静态主机
SSL证书。
FTP和SFTP非常适合小型应用程序。
SSH，用于高级应用程序。
CLI和Git。
到目前为止，我们讨论的任何工具、技术趋势或步骤都是前端开发的一部分。你还不知道框架，但是你可以为个人和小企业建立网站，或者适合移动设备的布局。您还可以使用到目前为止讨论过的工具或技术来部署小型应用程序或项目。如果想求职，学点前端框架就很棒了。
10.前端框架和状态管理
框架使您能够进行更高级的前端开发。该框架为您提供了许多优势，如可重用的组件、更有组织的UI或页面交互。这更有利于协作，有助于编写简洁的代码。另外，了解状态管理。每个框架都有不同的方法。下面是2020年流行的一些框架和状态管理器。
React:React库是Web开发最流行的学习方法。与其他框架和库相比，这是相当容易的。React开发者还有很多工作要做。您可以使用Redux和带有钩子的上下文API进行状态管理。
Vue:Vue越来越流行，开发者更喜欢学习Vue。相比React和Angular，Vue最容易学。VueX是为视图构建的状态管理器。
Angular:这种框架通常用于大型组织。它的学习曲线相当陡峭。用Angular学Typescript也不错。它允许您使用可选的静态类型，并支持ES2015的功能。NGRX和服务是很好的状态管理器，可以从这个框架中学习。
可选研究:
如果你了解这三个框架中的一个，那么你也可以使用Svelte，它是一个Javascript编译器，可以让你生成纯原始的JS代码，帮助你轻松构建用户界面。
了解服务器端渲染。JS和NextJS是允许你在服务器上运行React和Vue的框架。两者都有不错的功能，比如更好的SEO、文件系统路由、自动代码拆分、静态导出、JS中的CSS等诸多功能。
静态网站生成器:盖茨比和网格
我们已经讨论了所有最前端的开发工具和技术。现在我们来讨论一下成为后端开发者或者全栈开发者的语言和技术。
1.服务器端语言
您应该至少知道一种服务器端语言。为了在2020年选择一种语言，下面提供了一些选项。...
开发
计算机编程语言
爪哇
服务器端编程语言（Professional Hypertext Preprocessor的缩写）
红宝石
C#
去
注意:无论你喜欢学习哪种服务器端语言，都要确保你知道使用该语言的数据结构和算法。数据和算法将帮助您向用户呈现数据，并帮助您优化Web应用程序中的代码。我们特别建议您专注于使用数组和字符串。您将同时使用这两种方法。
12.服务器端框架
一旦你学会了自己选择的服务器端语言，你就可以使用其中一种语言框架。你可以选择下面给出的选项之一。...
node . js–Express、Koa、Adonis、Feather.js、Nest.js
姜戈，弗拉斯克，
Java:Spring MVC，Grails
PHP:Laravel，Symfony，Codeignitor，Slim
Ruby:Sinatra的Ruby on Rails
c#:ASP.NET MVC
去:狂欢
13.数据库ˌ资料库
大多数Web应用程序都需要一个存储数据的地方。在某些情况下，某些数据库可以使用某些技术或语言。例如，在Mern stack中，M代表MongoDB，而在LAMP stack中，M代表MySQL，但这完全取决于您希望为您的应用程序选择哪个数据库。我们将在2020年讨论一些流行的数据库。
关系数据库:RDBMS仍然是最流行的数据库。我最喜欢用PostgreSQL，MySQL，MS SQL。
NoSQL:MongoDB，RethinkDB，CouchDB
云:Firebase、azure couldbb、AWS
轻量级和缓存:Redis、SQLlite、NeDB
学习数据库的时候，也会学习RDBMS、ORM或者ODM的SQL。
GraphQL:现在可以了解一下流行的GraphQL。这是API的查询语言。它有一个类似于JSON的简单语法，很容易实现。
14.CMS:内容管理
你肯定应该了解内容管理系统，尤其是如果你是一个自由职业者。CMS用于向您的网站或应用程序添加内容。客户可以更新他们自己的内容，这很好。
传统的CMS:WordPress，Drupal，Keystone，Enduro
其他CMS :DEDECMS，帝国CMS，PHPcms，Prismic.io，Strati。
15.部署和开发运维
全栈或后端应用程序比仅前端应用程序更复杂，尤其是当您有一个数据库时。确保您知道如何使用CLI进行部署。了解关于部署应用程序的以下内容。
在大多数公司中，有不同的团队在开发运维。因此，了解DevOps是完全可选的。如果你正在做自己的项目，你可以了解到这一点。
嘘
服务器环境:NGINX、Apache
应用托管:Linode，Heroku，AWS，Azure，Now。
虚拟化:码头工人，流浪者
测试:单元、功能、集成等
负载平衡、监控、安全性。
以上所有的技术工具，足以让你成为一个前端、后端或者全栈的开发者。前锋广州边肖建议，你应该根据最终目标选择合适的工具和技术，而不是追求大而全，但专业化和精细化是整个堆栈的基础。
