【外文阅读】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

 

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开发人员的概述ide

布拉德删掉了不少你在社交媒体上听到的炒做。他的建议是切合实际的。我赞成他对你的建议。模块化

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

请记住: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这样的话,我想让你知道是什么。而后你能够选择你是否想学。”

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

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

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

 

This slide and all subsequent slides come from Brad's video. The underlines indicate the tools he personally recommends.

 

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框架。

这就是说,他说,当你为不一样的雇主作项目时,可能会遇到这些问题。

 

Bootstrap is still by far the most popular CSS framework, but there are a few other widely-used ones, too.

 

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,这并不奇怪。

 

Some of the fundamentals you should get good with. Brad has videos for most of these topics, and most of this is covered in the freeCodeCamp curriculum as well.

 

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站点速度很是快,不须要服务器。