【外文閱讀】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站點速度很是快，不須要服務器。