網(wǎng)友解答: 第一步：HTML + CSS前端的入門門檻極低，體現(xiàn)在HTML和CSS上。運行環(huán)境就是瀏覽器，推薦Chrome。你需要的一些前端工具箱，推薦Dreamwear/Sublime

網(wǎng)友解答:

第一步：HTML + CSS

前端的入門門檻極低，體現(xiàn)在HTML和CSS上。運行環(huán)境就是瀏覽器，推薦Chrome。你需要的一些前端工具箱，推薦Dreamwear/Sublime/Photoshop/SVN等。HTML和CSS不是編程語言，前者只是結(jié)構(gòu)標(biāo)簽，后者則是樣式配置，入門是非常簡單的。網(wǎng)上資料也有很多，剛?cè)腴T查閱資料可以用w3school或者M(jìn)DN（https://developer.mozilla.org/zh-CN）。

進(jìn)階可以學(xué)習(xí)下：

HTML主要是學(xué)了H5的Canvas。

掌握預(yù)處理工具Sass、Less。

前端框架：Bootstrap、Foundation。

第二步：JavaScript

這是至關(guān)重要的階段。

javascript 要學(xué)的內(nèi)容實在很多，如果沒有其他編程語言的基礎(chǔ)的話，學(xué)起來可能要費些力，還是建議先在 w3school上學(xué)習(xí)。之后建議馬上看《javascript語言精粹》，js是一門很混亂的語言，這本書能夠幫助你區(qū)分哪些是語言的精華，哪些是糟粕，對于語言精華，應(yīng)該深入學(xué)習(xí)。糟粕部分能看懂別人寫的代碼就行，自己就不用嘗試了。

在有了基礎(chǔ)之后，進(jìn)一步學(xué)習(xí)內(nèi)容包括：

1. 簡單框架，薦先學(xué) zepto，簡單易用

2. 復(fù)雜框架，是指 react、vue、angular 等不直接操作dom的框架。這類框架建議js基礎(chǔ)打扎實后再學(xué)習(xí)。

學(xué)習(xí)前端需要方法，更需要一顆平常心，不要把前端想的多難，需要吃什么苦。。。既然學(xué)習(xí)這么痛苦，為什么不快樂一點學(xué)呢？

anyway~希望大家可以成為一個優(yōu)秀的前端er！

網(wǎng)友解答:

雖然我不是 web前端開發(fā)工程師，但是我會web前端，前端開發(fā)我通過自學(xué)掌握的。web前端相對容易， 雖然你沒有基礎(chǔ)，是個小白，但是你要對自己充滿信心，相信你很快就可以掌握。

web前端都包括什么？

三個大方向，HTML、css、JavaScript。html就不細(xì)說了，很多人都說html算不上編程語言，連個循環(huán)都寫不了。一個web頁面時三者共同努力的結(jié)果。

如何學(xué)習(xí)Web前端？首先你需要學(xué)習(xí)html的各個標(biāo)簽，掌握其用法和規(guī)范，明白其作用。開始學(xué)習(xí)css的使用，你先學(xué)習(xí)在html頁面中為標(biāo)簽增加css樣式，其次是將css寫在網(wǎng)頁的<head</head標(biāo)簽對的<style</style標(biāo)簽對中。學(xué)習(xí)如何引入外部的css文件。如何將css和div結(jié)合起來，css你需要學(xué)習(xí)各種效果、定位、組件設(shè)置、布局、響應(yīng)式等等這部分需要你學(xué)習(xí)一段時間。學(xué)習(xí)原生的css后你可以學(xué)習(xí)使用css框架，下方我列舉一些框架。之后你還需要學(xué)習(xí)JavaScript，還是從基礎(chǔ)知識開始學(xué)習(xí)，學(xué)習(xí)的同時你可以自己開發(fā)一些插件檢驗學(xué)習(xí)成果學(xué)習(xí)完基礎(chǔ)之后你需要學(xué)習(xí)JavaScript框架和一些js庫。最后你將三者結(jié)合起來開發(fā)一個網(wǎng)站的前端進(jìn)行練習(xí)，可以開發(fā)wordpress的主題等?；蛘吣阍賹W(xué)習(xí)后端語言開發(fā)一個網(wǎng)站。關(guān)于前端學(xué)習(xí)我覺得一個網(wǎng)站非常好，那就是w3cschool%%%cn，里面有個編程實戰(zhàn)闖關(guān)模塊，花點時間通過他會對你有很大幫助。編程實戰(zhàn)難度不大，我很快就通關(guān)了。css的框架

Bootstrap—— 富有創(chuàng)意并且強(qiáng)大的移動為先的前端框架，幫助你快速開發(fā)web應(yīng)用

Semantic—— 通過創(chuàng)造一個用來方便分享UI的語言使得開發(fā)人員和設(shè)計師的可控范圍更為廣泛。

kube—— 極簡但非常豐富的組件開發(fā)自適應(yīng)或者響應(yīng)式的網(wǎng)站。 擁有靈活的Grid和漂亮的字體排版。絕對自由，沒有多余強(qiáng)制的樣式。

Less框架—— 是一個CSS的網(wǎng)格系統(tǒng)，幫助你設(shè)計自適應(yīng)的網(wǎng)站。包含了4個布局和3套字體排版預(yù)設(shè)，所有的都基于同一個Grid。

YAML—— 是一個模塊化的CSS框架，重點在于靈活性，良好的訪問和響應(yīng)式的設(shè)計。這個框架重點在于設(shè)備獨立的屏幕設(shè)計和靈活的布局模塊化管理。

js框架

AngularJS—— 有著諸多特性，最為核心的是：MVVM、模塊化、自動化雙向數(shù)據(jù)綁定、語義化標(biāo)簽、依賴注入等等。

React —— 是一個 Facebook 和 Instagram 用來創(chuàng)建用戶界面的 JavaScript 庫。

Vue.js ——是用于構(gòu)建交互式的 Web 界面的庫。它提供了MVVM數(shù)據(jù)綁定和一個可組合的組件系統(tǒng)，具有簡單、靈活的 API。

jQuery —— 是一個“寫的更少,但做的更多”的輕量級 JavaScript 庫。

最后加油吧，祝你早日掌握前端?。。?/p>

碼了這么多字，點個贊關(guān)注下再走吧?。。?/p>

關(guān)注萌新程序猿（本人咯），了解更多IT以及程序猿的知識?。?！