2019年Web開(kāi)發(fā)與全站工程師技術(shù)指南和趨勢(shì)

這是一個(gè)2019年你成為前端,后端或全棧開(kāi)發(fā)者的進(jìn)階指南:
- 你不需要學(xué)習(xí)所有的技術(shù)成為一個(gè)web開(kāi)發(fā)者
- 這個(gè)指南只是通過(guò)簡(jiǎn)單分類(lèi)列出了技術(shù)選項(xiàng)
- 我將從我的經(jīng)驗(yàn)和參考中給出建議
- 首選我們會(huì)介紹通用的知識(shí), 最后介紹2019年的Web的一些趨勢(shì)
1. 基礎(chǔ)前端開(kāi)發(fā)者
1.1 HTML & CSS
最基礎(chǔ)的知識(shí):
- 語(yǔ)義化的HTML元素
- 基礎(chǔ)的CSS語(yǔ)法
- Flexbox & Grid
- CSS變量
- 瀏覽器開(kāi)發(fā)者工具
1.2 響應(yīng)式布局
響應(yīng)式設(shè)計(jì)將不再是網(wǎng)頁(yè)的加分項(xiàng), 而是必須的
- 設(shè)置viewport
- 非固定寬度
- 媒體查詢(xún)
- 使用
rem
替代px
- 移動(dòng)優(yōu)先,柱狀顯示
1.3 基礎(chǔ)的部署工作
學(xué)會(huì)如何部署一個(gè)靜態(tài)網(wǎng)站到服務(wù)器
- 注冊(cè)一個(gè)域名(NameCheap, Google Domains)
- 管理共享主機(jī)或虛擬機(jī)(Inmotion, Hostgator, Bluehost)
- FTP, SFTP 文件上傳(Filezilla, Cyberduck)
- 靜態(tài)頁(yè)面托管(Netlify, Github Pages)
1.4 SASS預(yù)處理器
雖然不是必須的, 但是推薦去學(xué), 基礎(chǔ)知識(shí)的掌握很簡(jiǎn)單
- 結(jié)構(gòu)化CSS
- 變量
- 嵌套樣式表
- Minxins & 函數(shù)
- 繼承
1.5 原生JavaScript語(yǔ)法
不使用任何框架和庫(kù)區(qū)學(xué)習(xí)原生的JS語(yǔ)法
- 數(shù)據(jù)類(lèi)型, 函數(shù), 條件判斷, 循環(huán), 湊總府
- DOM操作和事件
- JSON
- Fetch
- ES6+(箭頭函數(shù), Promise, async/await, 解構(gòu))
1.6 滿(mǎn)足了基本的前端開(kāi)發(fā)者的條件
- 構(gòu)建靜態(tài)站點(diǎn)
- 構(gòu)建UI布局(拿到設(shè)計(jì)圖能夠使用HTML/CSS還原)
- 添加一些交互功能
- 部署和維護(hù)網(wǎng)站
現(xiàn)在能找到最低水平的Web開(kāi)發(fā)工作, 但是這是遠(yuǎn)遠(yuǎn)不夠的....
2. 一個(gè)成熟的前端開(kāi)發(fā)者
2.1 HTML & CSS框架
HTML/CSS框架目前沒(méi)有以前那么有意義, 但是我還是介意你選擇一個(gè)學(xué)習(xí)(這里作者想隱射的應(yīng)該是, 在jquery時(shí)代, HTML/CSS框架的學(xué)習(xí)是必須的).
- BootStrap
- Materialize
- Bulma
2.2 Git和其他工作流工具
Git絕對(duì)是每一個(gè)Web開(kāi)發(fā)者必須掌握的工具, 這里也有一些其他的工作流工具的建議.,
- 基礎(chǔ)的命令行(
touch
,cd
,mkdir
什么的總得會(huì), 命令行在下面的工具中都會(huì)用到) - Git(版本控制)
- NPM 或 Yarn(包管理)
- Webpack 或者 Parcel(打包工具)
- Gulp 或者 Grunt(任務(wù)管理和構(gòu)建工具)
- 編輯器插件(ESLint, Prettier, Live Server等)
2.3 前端框架
學(xué)習(xí)一個(gè)前端框架在目前前端開(kāi)發(fā)中是必須的.
- 在大公司開(kāi)發(fā)中非常流行
- 更多的交互 & 有趣的UI組件
- 組件化 & 模塊化前端代碼
- 對(duì)團(tuán)隊(duì)有利
2.4 狀態(tài)管理
對(duì)于使用框架的大型前端項(xiàng)目, 你也許需要使用狀態(tài)管理工具去管理你的應(yīng)用級(jí)的狀態(tài)
- Redux(Context API)
- Apollo(GraphQL Client)
- Vuex
- NgRx
2.5 滿(mǎn)足一個(gè)成熟的前端開(kāi)發(fā)者條件
- 構(gòu)建一個(gè)優(yōu)秀的前端應(yīng)用
- 流暢和穩(wěn)定的前端工作流
- 多人開(kāi)發(fā) & 熟練使用Git
- 請(qǐng)求后端API & 前端數(shù)據(jù)響應(yīng)
滿(mǎn)足以上條件, 你能夠順利的找到一個(gè)前端的工作并干得很出色~
3 全棧開(kāi)發(fā)工程師
3.1 學(xué)習(xí)一門(mén)后端語(yǔ)言
成為一個(gè)全棧工程師或軟件工程師, 你將需要學(xué)習(xí)一個(gè)服務(wù)端語(yǔ)言和相關(guān)技術(shù)
- Node.js
- Python
- PHP
- C#
- Go
學(xué)習(xí)的順序:
- 基礎(chǔ)的后端語(yǔ)言語(yǔ)法
- 數(shù)據(jù)結(jié)構(gòu)和工作流
- 包管理
- HTTP/路由
3.2 服務(wù)端框架
不要重復(fù)造輪子, 學(xué)習(xí)一門(mén)框架去構(gòu)建更好和更快的應(yīng)用
- Node.js(Express, Koa, Adonis)
- Python(Django, Flask)
- PHP(Laravel, Symfony)
- C# (ASP.NET)
3.3 數(shù)據(jù)庫(kù)
絕大多數(shù)覺(jué)得應(yīng)用都會(huì)使用到數(shù)據(jù)庫(kù), 這里有一些選擇:
- 關(guān)系型數(shù)據(jù)庫(kù)(MySQL, PostgreSQL, MS SQL)
- 非關(guān)系型數(shù)據(jù)庫(kù) (MongoDB, Counchbase)
- 云服務(wù) (Firebase, AWS, Azure, DocumentDB)
- 輕量級(jí)(SQLite, NeDB, Redis)
3.4 服務(wù)端渲染
像React, Vue 和 Angular等端架都可以進(jìn)行服務(wù)端渲染
- Next.js(React)
- Nuxt(Vue)
- Angular Universal(Angular)
3.5 內(nèi)容管理系統(tǒng)
內(nèi)容管理系統(tǒng)允許快速開(kāi)發(fā)并為您的客戶(hù)提供更新內(nèi)容的能力. 在你需要快速開(kāi)發(fā)網(wǎng)站的時(shí)候, 它們是很適合的. 特別是對(duì)于自由開(kāi)發(fā)者.
- 基于PHP的 (Wordpress, Drupal)
- 基于JS的 (Ghost, Keystone)
- 基于Python的 (Mezzazine)
- 基于.Net的 (Piranha, Orchard CMS)
3.6 DevOps 和部署
學(xué)習(xí)語(yǔ)言和框架是一回事, 但是安裝環(huán)境, 測(cè)試和部署有事另外一回事
- 部署 (Linux, SSH, Git, Nginx, Apache)
- 平臺(tái) (Digital Ocean, AWS, Heroku, Azure)
- 可視化(Docker, Vagrant)
- 測(cè)試 (單元測(cè)試, 集成測(cè)試, 函數(shù)式測(cè)試, 系統(tǒng)測(cè)試)
3.7 滿(mǎn)足全棧工程師的條件
- 設(shè)置全棧的開(kāi)發(fā)環(huán)境和工作流
- 構(gòu)建后端服務(wù)API和微服務(wù)
- 數(shù)據(jù)庫(kù)操作
- 能夠獨(dú)立開(kāi)發(fā)應(yīng)用(前端和服務(wù)端)
- 部署到云端(SSH, Git, Servers等等)
4. 2019技術(shù)趨勢(shì)和其他
4.1原生應(yīng)用開(kāi)發(fā)
- React Native(使用React構(gòu)建原生應(yīng)用)
- NativeScirpt(Angular, Typescript, JavaScript)
- Ionic (HTML/CSS/JS 實(shí)現(xiàn)混合應(yīng)用)
- Flutter (使用Dart語(yǔ)言開(kāi)發(fā)原生應(yīng)用的移動(dòng)端SDK)
- Xamarin (使用C#開(kāi)發(fā)的移動(dòng)端應(yīng)用)
4.2 使用Electron開(kāi)發(fā)桌面應(yīng)用
Electron是一個(gè)使用JavaScript構(gòu)建跨平臺(tái)的桌面應(yīng)用工具.
- 使用到了 Chromium內(nèi)核和Node.js
- 兼容Windows, Mac & Linux
- 崩潰報(bào)告, 調(diào)試和性能分析
4.3 GraphQL & Apollo
GraphQl是對(duì)于A(yíng)PI的一種革命性新方法,查詢(xún)語(yǔ)言比標(biāo)準(zhǔn)RESET嚴(yán)格得多
- 只查詢(xún)你想要的東西
- 前端和后端可以合作得更為順利
- 查詢(xún)語(yǔ)句非常簡(jiǎn)單且很像JSON語(yǔ)句
- Apollo是一個(gè)發(fā)送請(qǐng)求到GraphQL的客戶(hù)端
- 使用的是Gatsby靜態(tài)站點(diǎn)生成器
4.4 TypeScript
TypeScript是一個(gè)JavaScript的超集, 它添加了靜態(tài)類(lèi)型等很多特性.
- 變量, 函數(shù)等類(lèi)型
- 類(lèi)
- 其他ES6的特性
- 在A(yíng)ngular中被使用到, 同時(shí)也可以在React和Vue中被使用
4.5 無(wú)服務(wù)架構(gòu)
無(wú)需創(chuàng)建和管理自己的服務(wù)器
- 使用第三服務(wù)執(zhí)行“無(wú)服務(wù)器功能”
- 例如 AWS, Netify & Firebase
- 在Gatsby靜態(tài)站點(diǎn)生成器很流行
- 無(wú)服務(wù)框架
4.6 AI和機(jī)器學(xué)習(xí)
AI和機(jī)器學(xué)習(xí)已經(jīng)被廣泛應(yīng)用在所有的程序和技術(shù)中, 甚至包括web開(kāi)發(fā)中.
- 機(jī)器學(xué)習(xí)可以允許Web應(yīng)用程序隨時(shí)間進(jìn)行調(diào)整
- 雖然AI還有很長(zhǎng)的路要走, 但是我們會(huì)看到它會(huì)更多的用在web中
- 雖然目前絕大多數(shù)都是Python寫(xiě)的, 但也有Tensorflow.js和Brain.js這些JS的庫(kù)
4.7 區(qū)塊鏈技術(shù)
現(xiàn)在許多公司使用區(qū)塊鏈技術(shù)進(jìn)行數(shù)字交易, 因?yàn)樗鼈兏踩陀行?
- Solidity(一門(mén)智能合約的編程語(yǔ)言)
- Mist(以太坊開(kāi)發(fā)的瀏覽器, 用于發(fā)送交易和合約)
- 比特幣API(可以構(gòu)建app和整和比特幣的區(qū)塊鏈開(kāi)發(fā))
4.8 PWA
Progressive Web Apps是一個(gè)web app但是在功能和樣式上給用戶(hù)帶來(lái)原生應(yīng)用使用體驗(yàn)的一項(xiàng)技術(shù).
- 響應(yīng)式
- 在離線(xiàn)環(huán)境下也能夠提供服務(wù)
- 類(lèi)似App的交互
- HTTPS
- 可靠, 迅速, 更好
4.9 Web Assembly
類(lèi)似匯編的二進(jìn)制格式的代碼可以被瀏覽器執(zhí)行. 可以使用類(lèi)似C/c++和Rust等高級(jí)語(yǔ)言進(jìn)行編寫(xiě).
- 比JavaScript執(zhí)行效率快
- 更安全 - 強(qiáng)制的瀏覽器同源和安全協(xié)議
- 開(kāi)放 & 可調(diào)試
相關(guān)文章
- 這篇文章主要介紹了Python可以從事的工作/就業(yè)崗位,結(jié)合目前市場(chǎng)行情總結(jié)分析了學(xué)習(xí)Python可以從事的各種常見(jiàn)工作與相應(yīng)的薪資待遇,需要的朋友可以參考下2019-07-01
2019年IT行業(yè)就業(yè)形勢(shì)報(bào)告
這篇文章主要介紹了2019年IT行業(yè)就業(yè)形勢(shì)報(bào)告,通過(guò)大量數(shù)據(jù)形式分析了2019年IT熱門(mén)職位的相關(guān)技能需求與就業(yè)前景,需要的朋友可以參考下2019-06-28學(xué)完Java之后,有哪些就業(yè)方向?前景怎么樣?
很多同學(xué)在學(xué)Java前,常常問(wèn),學(xué)Java前景好么?能不能找到工作啊?學(xué)Java的人那么多,Java的就業(yè)形勢(shì)怎樣?。肯旅嫘【幘鸵黄鸶蠹襾?lái)探討一下2019-06-26- Python作為人工智能和數(shù)據(jù)分析第一語(yǔ)言,使得Python程序員成了當(dāng)前人才市場(chǎng)的“搶手貨”,工資待遇也水漲船高。下面就來(lái)為大家介紹一下Python的前景怎么樣?就業(yè)薪資高嗎2019-06-26
還在苦惱學(xué)python不知道方向,你還不看嗎?未來(lái)python就業(yè)的幾種方向
隨著人工智能的出現(xiàn),Python語(yǔ)言的熱度越來(lái)越高,因?yàn)镻ython語(yǔ)言簡(jiǎn)單,沒(méi)有學(xué)計(jì)算機(jī)語(yǔ)言的0基礎(chǔ)的,學(xué)起來(lái)快,本文就來(lái)介紹一下未來(lái)python就業(yè)的幾種方向,感興趣的就跟隨2019-04-23Python的就業(yè)薪資具體多少?發(fā)展前景到底如何?
Python是一門(mén)面向?qū)ο蟮木幊陶Z(yǔ)言,編譯速度超快,從誕生到現(xiàn)在已經(jīng)20來(lái)個(gè)年頭了。Python的排名從去年開(kāi)始就借助人工智能持續(xù)上升,那么Python的就業(yè)薪資具體多少?發(fā)展前景2019-04-10- 在本篇文章中我們給大家整理了關(guān)于Python程序員就業(yè)行情以及前景分析的相關(guān)內(nèi)容,如果你是一個(gè)python程序員可以看一下,對(duì)你的就業(yè)有好處。2019-04-09
2019年P(guān)ython趨勢(shì)解析?。ǔ绦騿T轉(zhuǎn)型需知)
這篇文章主要為大家介紹了近幾年P(guān)ython的發(fā)展趨勢(shì),結(jié)合大量數(shù)據(jù)分析了2019年P(guān)ython的發(fā)展情況與未來(lái)前景,并給程序員轉(zhuǎn)型提供了若干意見(jiàn),需要的朋友可以參考下2019-06-26