【外文阅读】Web Development in 2020: What Coding Tools You Should Learn---Quincy Larson

原文链接：https://mail.qq.com/cgi-bin/readtemplate?t=safety&check=false&gourl=https%3A%2F%2Fwww.freecodecamp.org%2Fnews%2Fweb-development-2020%2F&subtemplate=gray&evil=0

前端部分原文+翻译如下（百度翻译，对不顺畅的语序做调整，基本不太需要，百度翻译已经很发达了~），转载请注明出处（本文的链接），谢谢

Web Development in 2020: What Coding Tools You Should Learn

Quincy Larson The teacher who founded freeCodeCamp.org.

Today one of my favorite teachers, Brad Traversy, published an overview of what he recommends you learn to become a web developer in 2020.

Brad cuts through a lot of the hype you hear on social media. His advice is practical and realistic. And I agree with him on pretty much everything he recommends you learn.

The main thing Brad emphasizes - and that I always emphasize - is don't feel daunted or let yourself get overwhelmed.

Remember: freeCodeCamp's curriculum covers most of these tools, and it has helped more than 40,000 people get jobs as developers. When in doubt, just focus on that.

I've summarized Brad's main insights below for your convenience. This said, I encourage you to watch his full video, which I've embedded below. He adds a lot of detail way beyond what these notes convey. It's a 73-minute watch.

2020年的网络发展：你应该学习哪些的编码工具

今天，我最喜欢的一位老师，Brad Traversy发表了一篇关于他推荐的，你如何在2020年学习成为一名web开发人员的概述

布拉德删掉了很多你在社交媒体上听到的炒作。他的建议是切合实际的。我同意他对你的建议。

布拉德强调的最主要的事情——我也一直强调——是不要感到胆怯或者让自己不知所措。

请记住：freeCodeCamp的课程涵盖了这些工具的大部分，它帮助超过40000人获得了作为开发人员的工作。有疑问的时候，集中精力。

为了您的方便，我在下面总结了布拉德的主要见解。这就是说，我鼓励你看他的完整视频，我已经嵌入下面。他在这些说明之外添加了很多细节。这是个73分钟的视频。

Web Development in 2020: An Overview

The main goal of the video is to give you familiarity with some of the more mainstream web development tools available to web developers.

"I'm not trying to overwhelm you with technologies. These are just options that you have... There are a lot of technologies out there. When you hear something like Nuxt or Gatsby I want you to know what it is. And then you can choose if you want to learn it or not."

Brad starts by encouraging people to first ask what they want to do. Do you want to work on a product company? Or work as a consultant? Do you want to freelance? Or build a product of your own?

A lot of his advice about what to learn boils down to what your goals are. And he frames a lot of his tool suggestions in this light.

As a starting point, he recommends learning what he calls "The Necessities."

2020年网络发展综述

本视频的主要目的是让您熟悉一些可供web开发人员使用的更主流的web开发工具。

“我不是想用科技压倒你。这些只是你的选择。。。有很多技术。当你听到Nuxt或Gatsby这样的话，我想让你知道是什么。然后你可以选择你是否想学。”

布拉德首先鼓励人们先问他们想做什么。你想在一家产品公司工作吗？或者做顾问？你想做自由职业者吗？还是自己做产品？

他对学习什么的很多建议归结为你的目标是什么。他从这个角度提出了很多工具建议。

作为起点，他建议学习他所说的“必需品”

One counter-intuitive thing he points out: you don't need a fancy computer for web development. "It's not like game engine development or something like that, so you can use a mid-range laptop or desktop, or even in some cases a lower-end computer."

He uses MacOS, Windows 10, and Linux for cloud servers and even for some of his media servers.

He is a big fan of VS Code for his editor, and uses Chrome and its built-in DevTools for browser-based debugging. This said, he thinks Firefox has come a long way as well and is a viable alternative.

He recommends starting with standard HTML and CSS, and learning newer CSS tools like Flexbox and Grid.

He says learning responsive web design in 2020 should be a given. "Every serious project that you create should look good and be completely usable on all devices."

Instead of relying on CSS frameworks like Bootstrap, he recommends you practice building your own modular CSS components that you can then re-use throughout your project.

This said, he says you may encounter these as you work on projects for different employers.

他指出，有一点与直觉相反：你不需要一台花哨的计算机来进行网络开发。”这不像游戏引擎开发之类的，所以你可以使用中端笔记本电脑或台式机，甚至在某些情况下使用低端电脑。”

他将MacOS、Windows 10和Linux用于云服务器，甚至用于他的一些媒体服务器。

他非常喜欢编辑器的VS代码，并使用Chrome及其内置的DevTools进行基于浏览器的调试。这就是说，他认为火狐也取得了长足的进步，是一个可行的选择。

他建议从标准的HTML和CSS开始，学习Flexbox和Grid等新的CSS工具。

他说，在2020年学习响应式网络设计应该是一种必然。”您创建的每个重要项目都应该看起来很好，并且在所有设备上都完全可用。”

他建议您练习构建自己的模块化CSS组件，然后在整个项目中重用这些组件，而不是依赖于Bootstrap这样的CSS框架。

这就是说，他说，当你为不同的雇主做项目时，可能会遇到这些问题。

He specifically mentions Tailwind, which I hadn't heard of before. Tailwind is a bit different from other CSS frameworks. It's focused on "utility classes" that you can combine to accomplish what you want with the design.

It's no surprise that Brad recommends getting really good with JavaScript.

他特别提到了Tailwind，这是我以前没听说过的。Tailwind与其他CSS框架有点不同。它关注的是“实用类”，您可以将它们结合起来，以实现您想要的设计。

布拉德建议要真正精通JavaScript，这并不奇怪。

Learning at a Practical Pace

Throughout Brad's guide, he repeatedly emphasizes the need for practicality.

Yes - there are best practices for everything. But in many cases, there is a good enough way that will help you move faster and get more done, without getting mired in tools.

One of the most interesting (and perhaps heretical) things he says:

"There's no need to learn DevOps and AWS and all these things for a small site. A hosting site or a managed hosting site like InMotion or Hostgator is fine. It allows you to do [deployment] right in the browser. There's no need to overcomplicate things."

He argues that even in 2020, there's something to be said for using familiar tools.

以实际的速度学习

在布拉德的指南中，他反复强调实用性的必要性。

是的-每件事都有最佳实践。但在很多情况下，有一个足够好的方法可以帮助你更快地行动，完成更多的工作，而不会陷入工具的泥潭。

他说的最有趣（也许是异端）的一句话是：

“对于一个小网站来说，没有必要学习DevOps和AWS以及所有这些东西。托管站点或托管托管站点（如InMotion或Hostgator）可以。它允许您在浏览器中执行[部署]。没有必要把事情复杂化。”

他认为，即使是在2020年，对于使用熟悉的工具也有一些话要说。

For people new to web development, Brad recommends first getting to the point of being able to work as a basic front end web developer. This will allow you to build websites for local businesses as a freelancer.

"Hipsters will say you definitely need to use a front end framework. I don't think that is true. If you want to render templates on the server without using a front end framework, I think that's absolutely fine, but there are many many jobs that are looking for something like React or Vue."

But once you're ready to tackle front end frameworks, he recommends you explore React, Vue, and Angular. "Try all three and figure out which one you like the best."

He also gives a nod to Svelte - which isn't a framework, but rather a compiler. But he says it's probably too new to try and pick up in 2020.

And he discusses the increasing popularity of Server Side Rendering. File system-based routing means you don't have to create a complicated routing file. Instead, you can just put the files in the directory you want them to be in.

The two popular Server Side Rendering tools are Next.js (for React) and Nuxt.js (the Vue option).

Another emerging trend is Static Site Renders, which he says you don't need to learn but you should be aware of. For example, Gatsby sites are extremely fast and don't need a server.

对于刚接触到web开发的人，Brad建议首先能够作为一个基本的前端web开发人员工作。这将允许你作为一个自由职业者为当地企业建立网站。

“Hipsters （嬉皮士）时尚人士会说，你肯定需要使用前端框架。我不认为那是真的。如果您想在服务器上呈现模板而不使用前端框架，我认为这是完全可以的，但是有许多作业正在寻找React或Vue之类的内容。”

但一旦您准备好处理前端框架，他建议您探索React、Vue和Angular。”三个都试一下，找出你最喜欢哪一个。”

他还赞扬了Svelte——它不是一个框架，而是一个编译器。但他说，这可能是太新的尝试，并在2020年回升。

他还讨论了服务器端渲染的日益流行。基于文件系统的路由意味着您不必创建复杂的路由文件。相反，你可以把文件放在你想要的目录中。

两种流行的服务器端呈现工具是Next.js（用于React）和Nuxt.js（Vue选项）。

另一个新兴的趋势是静态网站呈现，他说你不需要学习，但你应该知道。例如，Gatsby站点速度非常快，不需要服务器。