一、HTML

HTML是網頁內容的載體內容就是網頁製作者放在頁面上想要讓使用者瀏覽的資訊，可以包含文字、圖片、影片等。要熟練掌握div、table、ul li 、p、span等這些標籤,這些都是最常用的。

二、CSS（Cascading Style Sheets）—樣式。

一般看到web前端開發工程師的要求裡面,有一個會使用css+html 或者 css+div 來進行介面佈局,所以css是用於輔助html來佈局和展示的,

稱之為“css樣式”,CSS要熟練掌握float、position、width、height，以及對於的最大最小、會使用百分百、overflow、margin、padding,標題字型、顏色變化，或為標題加入背景圖片、邊框等等,這些都是跟佈局有關係的樣式,必須要掌握的。

三、JavaScript：

學習JavaScript的基本語法，以及如何使用JavaScript程式設計將會提高開發人員的個人技能。

四、作業系統：

瞭解Unix和Linux的基本知識，對於開發人員有益無害。

五、網路伺服器:

瞭解Web伺服器，包括對Apache的基本配置，htaccess配置技巧的掌握等。

Web前端開發工程師，主要職責是利用(X)HTML/CSS/JavaScript/Flash等各種Web技術進行客戶端產品的開發。完成客戶端程式（也就是瀏覽器端）的開發，開發JavaScript以及Flash模組，同時結合後臺開發技術模擬整體效果，進行豐富網際網路的Web開發，致力於透過技術改善使用者體驗。

Vue, React, Angular

WebAssembly,PWA

小程式

Flutter

Webpack ,CLI工具

TypeScript

Vue 在 2018、2019 年繼續增長，其在 GitHub Stars 已經超過了 React ，國內公司更喜歡 Vue。

雖然 Angular 與 React 和 Vue 等庫相比，粉絲較少，但它仍然是專業專案的熱門選擇。

無論是Vue3.0, React16.8 ,還是angular 8 , 在技術方面，三大框架趨於穩定，都是奔著更快、更小、更易維護、更易於原生，開發者更爽的目標發展，寫法上也越來越像。

2、WebAssembly

WebAssembly 旨在透過提供在 web 上執行二進位制格式，最大限度地提高效能，減小檔案大小，並支援多種語言的 web 開發, 所有主流瀏覽器都已經支援。

WebAssembly結合日漸成熟的WebGL技術，使得大型的遊戲等應用遷移到瀏覽器將逐漸成為可能.

隨著基礎的到位和不斷推動改進的Web體驗，WebAssembly將開始看到更多的應用。

3、PWA

PWA使用多種技術來增強web app的功能，能夠模擬一些原生功能，比如通知推送，能使web應用具有離線功能和無縫的移動/桌面體驗。

（1）移動端：PWA能夠取得媲美 Native APP 的效能， PWA 本質上是 Web App，藉助一些新技術也具備了 Native App 的一些特性，兼具 Web App 和 Native App 的優點。

（2）桌面端：Google 、微軟 接下來會大力推進 PWA 桌面版，Web 應用將在桌面達到近乎原生的體驗。

PWA 將會改變前端與移動端之間的格局，再加上WebAssembly 為 JS 帶來的效能上的突破，JavaScript 將應用所有領域，從移動端、到桌面應用、物聯網、VR、AR、遊戲等 。

4、小程式依然火爆

5G 時代很快就到了，在網速、記憶體和 CPU 更高的情況下，小程式的載入會更快，達到秒開，小程式將會有更廣泛的應用。

5、Flutter

作為谷歌的開源移動UI框架，Flutter可以快速在iOS和Android上構建高質量的原生使用者介面，今年，Google I/O 大會宣佈了 flutter 支援 web 開發。

flutter 目前的目的就是全平臺開發，一套程式碼同時執行在 iOS 、Android、web和桌面端。

6、Webpack

Webpack作為前端工程化中重要的一項熱門工具，將前端各種資源（包括CSS及其預編譯方案、JS及其預編譯方案）統一打包為.js檔案和資原始檔（圖片），Webpack歷經4個版本，不斷改進，即將釋出V5版本。

Webpack5 的一些變化

使用持久化快取提高構建效能；

使用更好的演算法和預設值改進長期快取；

清理內部結構而不引入任何破壞性的變化；

引入一些breaking changes，以便儘可能長的使用v5版本。

7、CLI工具繼續火爆

各種管理工具的CLI包的建立，讓開發人員不必花好幾天去糾結配置的問題，專注於應用程式和業務邏輯，幾個框架的CLI工具主要如下：

Angular CLI：

https://cli.angular.io/

Vue CLI：

https://cli.vuejs.org/

Create React App 2

https://reactjs.org/blog/2018/10/01/create-react-app-v2.html

還有其他的一些框架：Next.js（SSR for React），Nuxt.js（SSR for Vue），React Native的Expo CLI。

2019 年， 各CLI 也會有更多的改進及最佳化。

8、TypeScript將繼續發展，也許是Javascript的未來

JavaScript因沒有靜態型別變數而飽受爭議, 試圖解決這個問題的主要庫有TypeScript、Flow、Reason、PureScript、Elm。

TypeScript 提供了可選的靜態型別和業界認可的類（ ES5+ 也支援）、泛型、封裝、介面面向物件設計能力，以提升 JavaScript 的面向物件設計能力。

相比其他，TypeScript更流行一些，Angular 和 Vue 都採用了 TypeScript，並將其作為開發者社群的標準，2019 年 TypeScript 將有非常大的增長。

對於開發者而言，唯一不變的就是學習能力，掌握了學習能力就能夠應對這些趨勢變化，祝大家2019技術進步！

在前後端分離的架構上，前端技術應該比較廣泛。我們團隊是將傳統的html，css，js作為前端技術，還把客戶端技術歸結為前端：

android，ios，小程式這類，我們也歸結為前端技術

Html、Css、JavaScript是Web前端人員需要掌握的基礎內容，其次，一名優秀的Web開發工程師還需要熟練掌握各種前端框架的使用，比如vue、AngularJS等，以及一些當下熱門技術，比如一些優秀UI框架，在專案過程中很多優秀框架比較實用，如Mint UI、WeUI、at-ui、vant UI等，這些都是需要在平時的開發過程中不斷積累學習的。同時自己也應該開發自己的組建庫。