web前端工程師是近幾年的新興職業(yè)，也是目前火爆而且高薪的職業(yè)狡赐。不同的公司也有不同的叫法窑业，比如：網(wǎng)頁界面開發(fā)，網(wǎng)站設(shè)計等枕屉，要學(xué)好web前端開發(fā)常柄，需要掌握什么方法與技巧？
一搀擂、div和table
這個是最簡單的西潘，也是最基礎(chǔ)的。要熟練掌握div哥倔、form table秸架、ul li 、p咆蒿、span东抹、font這些標簽，這些都是最常用的沃测，特別是div和table缭黔，div用于布局、table也可以用于布局蒂破，但是不靈活馏谨，基本 table是用來和數(shù)據(jù)打交道。
二附迷、CSS
這里說的css不包括css3惧互，一般我們看到web前端開發(fā)工程師的要求里面，有一個會使用css+html 或者 css+div 來進行界面布局喇伯，所以css是用于輔助html來布局和展示的喊儡，我們稱之為“css樣式”。
為什么會說css+div呢?
因為我上面說了div就是 html主要用于布局的東西稻据，所以div就是核心掌握的東西艾猜！那么css肯定必須要配合div來使用才好。css要熟練掌握float捻悯、 position匆赃、width、height今缚，以及對于的最大最小算柳、會使用百分百
三、JS
可能前兩個大家覺得還過的去荚斯，看到j(luò)s就蛋疼了埠居。
其實查牌，js入門很簡單的事期，不需要會很多東西的滥壕，只要會根據(jù)某個id、或者name拿到網(wǎng)頁dom或者樣式兽泣、或者值绎橘，然后會給某個id或者name的元素標簽賦值、或者追加數(shù)據(jù)唠倦、追html称鳞，代碼一點都不難，會了這些基礎(chǔ)js稠鼻，其他的直接百度就好了冈止。然后看多了，用多了候齿，就什么都不是問題了熙暴。、overflow慌盯、margin周霉、padding等等。為什么會說css+div呢?
四亚皂、jQuery
jquery是相當(dāng)于把js封裝了一套的一個js插件俱箱，目的就是操作起來更方便，代碼寫的更少灭必，jquery入門也很簡單狞谱，那些是入門需要學(xué)的和js一樣，只是換成了jq的代碼禁漓。其他的一樣百度就夠了跟衅。
五、最好會點后臺語言
比如java璃饱、php与斤，為什么呢?因為我們前臺界面的數(shù)據(jù)都是從后臺來的，如果會點后臺代碼荚恶，就知道怎么跟后臺交互數(shù)據(jù)是最好的撩穿，這樣節(jié)約時間，也可以讓前端代碼更規(guī)范谒撼。不然可能因為你的寫法和后端給來的數(shù)據(jù)不能結(jié)合上食寡，那么前端代碼又得重新寫，那就更蛋疼了廓潜。
六抵皱、學(xué)習(xí)CSS3+HTML5
隨著這移動互聯(lián)網(wǎng)快速發(fā)展的時代善榛，尤其是4G時代，HTML5+CSS3已然成為新一代的web前端技術(shù)呻畸。隨著HTML5的發(fā)展和普及移盆，了解 HTML5 也將成為 Web開發(fā)人員的必修課。涉及到網(wǎng)頁外觀時伤为，就需要學(xué)習(xí) CSS 了咒循，它可以幫你把網(wǎng)頁做得更美觀。
小編推薦一個學(xué)Web前端的學(xué)習(xí)裙【 547绞愚，302叙甸，383 】，無論你是大牛還是小白位衩，是想轉(zhuǎn)行還是想入行都可以來了解一起進步一起學(xué)習(xí)裆蒸！裙內(nèi)有開發(fā)工具，很多干貨和技術(shù)資料分享糖驴！
第一階段：
HTML+CSS:
HTML進階僚祷、CSS進階、div+css布局遂赠、HTML+css整站開發(fā)久妆、
JavaScript基礎(chǔ)：
Js基礎(chǔ)教程、js內(nèi)置對象常用方法跷睦、常見DOM樹操作大全筷弦、ECMAscript、DOM抑诸、BOM烂琴、定時器和焦點圖。
JS基本特效：
常見特效蜕乡、例如：tab奸绷、導(dǎo)航、整頁滾動层玲、輪播圖号醉、JS制作幻燈片、彈出層辛块、手風(fēng)琴菜單畔派、瀑布流布局、滾動事件润绵、滾差視圖线椰。
JS高級特征：
正則表達式、排序算法尘盼、遞歸算法憨愉、閉包烦绳、函數(shù)節(jié)流、作用域鏈配紫、基于距離運動框架径密、面向?qū)ο蠡A(chǔ)、
JQuery：基礎(chǔ)使用
懸著器笨蚁、DOM操作睹晒、特效和動畫趟庄、方法鏈括细、拖拽、變形戚啥、JQueryUI組件基本使用奋单。
第二階段：HTML5和移動Web開發(fā)
HTML5：
HTML5新語義標簽、HTML5表單猫十、音頻和視頻览濒、離線和本地存儲、SVG拖云、Web Socket贷笛、Canvas.
CSS3:
CSS3新選擇器、偽元素宙项、臉色表示法乏苦、邊框、陰影尤筐、background系列屬性改變汇荐、Transition、動畫盆繁、景深和深透掀淘、3D效果制作、Velocity.js框架油昂、元素進場革娄、出場策略、炫酷CSS3網(wǎng)頁制作冕碟。
Bootstrap:
響應(yīng)式概念拦惋、媒體查詢、響應(yīng)式網(wǎng)站制作鸣哀、刪格系統(tǒng)架忌、刪格系統(tǒng)原理、Bootstrap常用模板我衬、LESS和SASS叹放。
移動Web開發(fā)：
跨終端WEB和主流設(shè)備簡介饰恕、視口、流式布局井仰、彈性盒子埋嵌、rem、移動終端JavaScript事件俱恶、手機中常見JS效果制作雹嗦、Zepto.js、手機聚劃算頁面合是、手機滾屏了罪。
第三階段：HTTP服務(wù)和AJAX編程
WEB服務(wù)器基礎(chǔ)：
服務(wù)器基礎(chǔ)知識、Apache服務(wù)器和其他WEB服務(wù)器介紹聪全、Apache服務(wù)器搭建泊藕、HTTP介紹。
PHP基礎(chǔ)：
PHP基礎(chǔ)語法难礼、使用PHP處理簡單的GET或者POST請求娃圆、
AJAX上篇：
Ajax簡介和異步的概念、Ajax框架的封裝蛾茉、XMLHttpRequest對象詳細介紹方法讼呢、兼容性處理方法、Ajax框架的封裝谦炬、Ajax中緩存問題悦屏、XML介紹和使用。
AJAX下篇：
JSON和JSON解析吧寺、數(shù)據(jù)綁定和模板技術(shù)窜管、JSONP、跨域技術(shù)稚机、圖片預(yù)讀取和lazy-load技術(shù)幕帆、JQuery框架中的AjaxAPI、使用Ajax實現(xiàn)爆布流案例額赖条。
第四階段：面向?qū)ο筮M階
面向?qū)ο蠼K極篇：
從內(nèi)存角度到理解JS面向?qū)ο笫⒒绢愋汀?fù)雜類型纬乍、原型鏈碱茁、ES6中的面向?qū)ο蟆傩宰x寫權(quán)限仿贬、設(shè)置器纽竣、訪問器。
面向?qū)ο笕筇卣鳎?/p>
繼承性、多態(tài)性蜓氨、封裝性聋袋、接口。
設(shè)計模式：
面向?qū)ο缶幊趟季S穴吹、單例模式幽勒、工廠模式、策略模式港令、觀察者模式啥容、模板方法模式、代理模式顷霹、裝飾者模式咪惠、適配器模式、面向切面編程泼返。
第五階段：封裝一個屬于自己的框架
框架封裝基礎(chǔ)：
事件流硝逢、冒泡、捕獲绅喉、事件對象、事件框架叫乌、選擇框架柴罐。
框架封裝中級：
運動原理、單物體運動框架憨奸、多物體運動框架革屠、運動框架面向?qū)ο蠓庋b。
框架封裝高級和補充：
JQuery框架雛形排宰、可擴展性似芝、模塊化、封裝屬于傳智自己的框架板甘。
第六階段：模塊化組件開發(fā)
面向組件編程：
面向組件編程的方式党瓮、面向組件編程的實現(xiàn)原理、面向組件編程實戰(zhàn)盐类、基于組件化思想開發(fā)網(wǎng)站應(yīng)用程序寞奸。
面向模塊編程：
AMD設(shè)計規(guī)范、CMD設(shè)計規(guī)范在跳、RequireJS枪萄，LoadJS、淘寶的SeaJS猫妙。
第七階段：主流的流行框架
Web開發(fā)工作流：
GIT/SVN瓷翻、Yeoman腳手架、NPM/Bower依賴管理工具、Grunt/Gulp/Webpack齐帚。
MVC/MVVM/MVW框架：
Angular.js元践、Backbone.js、Knockout/Ember童谒。
常用庫：
React.js单旁、Vue.js、Zepto.js饥伊。
第八階段：HTML5原生移動應(yīng)用開發(fā)
Cordova：
WebApp/NativeApp/HybirdApp簡介象浑、Cordova簡介、與PhoneGap之間的關(guān)系琅豆、開發(fā)環(huán)境搭建愉豺、Cordova實戰(zhàn)（創(chuàng)建項目，配置茫因，編譯蚪拦，調(diào)試，部署發(fā)布）冻押。
Ionic：
Ionic簡介和同類對比驰贷、模板項目解析、常見組件及使用洛巢、結(jié)合Angular構(gòu)建APP括袒、常見效果（下拉刷新，上拉加載稿茉，側(cè)滑導(dǎo)航锹锰，選項卡）。
React Native：
React Native簡介漓库、React Native環(huán)境配置恃慧、創(chuàng)建項目，配置渺蒿，編譯痢士，調(diào)試，部署發(fā)布蘸嘶、原生模塊和UI組件良瞧、原生常用API。
HTML5+：
HTML5+中國產(chǎn)業(yè)聯(lián)盟训唱、HTML5 Plus Runtime環(huán)境褥蚯、HBuilder開發(fā)工具、MUI框架况增、H5+開發(fā)和部署赞庶。
第九階段： Node.js全棧開發(fā)：
快速入門：
Node.js發(fā)展、生態(tài)圈、Io.js歧强、Linux/Windows/OS X環(huán)境配置澜薄、REPL環(huán)境和控制臺程序、異步編程摊册，非阻塞I/O肤京、模塊概念，模塊管理工具茅特、開發(fā)流程忘分，調(diào)試，測試白修。
核心模塊和對象：
全局對象global妒峦，process，console兵睛，util肯骇、事件驅(qū)動，事件發(fā)射器祖很、加密解密笛丙，路徑操作，序列化和反序列化突琳、文件流操作若债、HTTP服務(wù)端與客戶端、Socket.IO拆融。
Web開發(fā)基礎(chǔ)：
HTTP協(xié)議，請求響應(yīng)處理過程啊终、關(guān)系型數(shù)據(jù)庫操作和數(shù)據(jù)訪問镜豹、非關(guān)系型數(shù)據(jù)庫操作和數(shù)據(jù)訪問、原生的Node.js開發(fā)Web應(yīng)用程序蓝牲、Web開發(fā)工作流趟脂、Node.js開發(fā)Blog案例。
小編推薦一個學(xué)Web前端的學(xué)習(xí)裙【 547例衍，302昔期，383 】，無論你是大牛還是小白佛玄，是想轉(zhuǎn)行還是想入行都可以來了解一起進步一起學(xué)習(xí)硼一！裙內(nèi)有開發(fā)工具，很多干貨和技術(shù)資料分享梦抢！
快速開發(fā)框架：
Express簡介+MVC簡介般贼、Express常用API、Express路由模塊、Jade/Ejs模板引擎哼蛆、使用Express重構(gòu)Blog案例蕊梧、Koa等其他常見MVC框架。
Node.js開發(fā)電子商務(wù)實戰(zhàn)：
需求與設(shè)計腮介、賬戶模塊注冊登錄肥矢、會員中心模塊、前臺展示模塊叠洗、購物車甘改，訂單結(jié)算、在線kf即時通訊模塊惕味。
