POST TIME:2018-12-03 21:10
近幾年Web前端框架層出不窮,好比 React, Vue, AngulaJS等吸引了大量的注意力,前端技術(shù)發(fā)展勢頭迅猛,各大互聯(lián)網(wǎng)公司也越來越重視前端開發(fā),前端開發(fā)再也不是過去那種根據(jù)設(shè)計圖做靜態(tài)網(wǎng)頁,再隨便寫點(diǎn)jQuery的職位了?,F(xiàn)在,市場上對于前端開發(fā)的需求越來越大,我們經(jīng)常聽說前端開發(fā)入門難度低,但學(xué)習(xí)前端開發(fā)究竟需要多長時間呢?學(xué)多長時間就能找到工作賺到錢?結(jié)合了周邊同事和自身的經(jīng)驗(yàn)來談?wù)剬W(xué)習(xí)網(wǎng)頁開發(fā)到底需要花多長時間。
Note:必然要下定決心,而且要堅(jiān)持。
1. 網(wǎng)頁設(shè)計的基本概念和理論知識(10天)
在學(xué)習(xí)制作網(wǎng)頁之前,必需掌握網(wǎng)頁設(shè)計的基本概念和理論知識。什么是靜態(tài)網(wǎng)頁?什么是動態(tài)網(wǎng)頁?網(wǎng)頁的整體布局是什么?網(wǎng)頁設(shè)計的原則是什么?網(wǎng)頁基本構(gòu)成要素是哪些?基礎(chǔ)的網(wǎng)頁設(shè)計概念都不了解,那么對于之后要制作網(wǎng)頁更是難上加難。我認(rèn)為利用 10 天時間了解網(wǎng)頁設(shè)計的基本概念和理論是必不成少的,時代在不停變革,網(wǎng)頁設(shè)計也會更新?lián)Q代。所以了解基礎(chǔ)知識是為了之后設(shè)計制作打好基礎(chǔ)。當(dāng)然,還需要了解基礎(chǔ)的SEO知識。網(wǎng)上的視頻教程個人建議還是少看,一本好的書絕對讓你受益匪淺。保舉幾本好書供大家學(xué)習(xí):
制作網(wǎng)頁設(shè)計1. HTML AND CSS: DESIGN AND BUILD WEBSITES, BY JON DUCKETT
如何讓網(wǎng)頁設(shè)計更加功能化2. JAVASCRIPT AND JQUERY: INTERACTIVE FRONT-END WEB DEVELOPMENT, BY JON DUCKETT
前端開發(fā)3. LEARNING WEB DESIGN: A BEGINNER’S GUIDE TO HTML, CSS, JAVASCRIPT, AND WEB GRAPHICS, BY JENNIFER NIEDERST ROBBINS
可用性:4.DON’T MAKE ME THINK, REVISITED: A COMMON SENSE APPROACH TO WEB USABILITY, BY STEVE KRUG
2. CSS+HTML+JavaScript( 1 個月)
相對來說, HTML是最簡單的,只是標(biāo)簽語言, 格式規(guī)范; CSS相對來說復(fù)雜一些, 有瀏覽器的兼容問題等。但二者組合就能實(shí)現(xiàn)很多頁面效果, 里面涉及的變革太多了。如果你只會基礎(chǔ)語法, 而沒有實(shí)際去寫過, 那樣是很難真正掌握的。我在這里說說我的經(jīng)驗(yàn)吧,我一開始學(xué)習(xí)的Bootstrap,簡單點(diǎn)說,就是給現(xiàn)有電商項(xiàng)目套上Bootstrap做的響應(yīng)式皮膚。Bootstrap確實(shí)挺好上手,靠著官網(wǎng)的手冊,基本上遇到的問題都能本身解決。
JavaScript 也沒有那么難,你要知道Brendan Eich創(chuàng)建JavaScript語言一共就用了 10 天時間,所以它的語法并不復(fù)雜,相信你很快就能掌握基本語法。你可能還需要學(xué)習(xí)一些常見的庫的API,這個可以按照你的需求來擺設(shè),你要用到什么庫,就學(xué)習(xí)它的文檔。
我覺得最好的網(wǎng)頁開發(fā)學(xué)習(xí)資料就是 Mozilla Developer Network(https://developer.mozilla.org)的文檔了,涵蓋了HTML, CSS, JavaScript的方方面面,豈論是初學(xué)還是老手查閱都是非常有用的,保舉給大家。
3. 開始制作網(wǎng)站(1個月)
了解了基本的知識,做了一些小練習(xí)之后,我認(rèn)為最重要的是盡早參與實(shí)際項(xiàng)目,這樣才能得到真正的熬煉。使用 Jekyll + GitHub Pages 為本身搭建一個靜態(tài)博客是一個很好的開始,只需要簡單的配置,不需要任何后臺開發(fā),幾乎完全是前端開發(fā)。
建站的時間取決你本身對網(wǎng)站完成的滿意度,如果參考模板, 那么幾個小時內(nèi)就可以搞定了;如果是要獨(dú)立開發(fā)一個新的網(wǎng)站又要內(nèi)容全面好看,1個月是跑不掉的,甚至需要更長時間。
4. 工具軟件學(xué)習(xí)(半個月)
工具的掌握程度完全靠個人的領(lǐng)悟能力和學(xué)習(xí),網(wǎng)上有很多關(guān)于以下這些工具的教學(xué)視頻,跟著學(xué)會事半功倍的。需要學(xué)習(xí)的基本軟件:
編纂器:Sublime Text
初學(xué)者我不建議立即使用強(qiáng)大的 IDE,先使用編纂器有利于學(xué)習(xí)。Sublime Text 是一款我個人非常喜歡的編纂器,界面優(yōu)雅,操作流暢,自動支持語法高亮,還有豐富的插件,你也可以試試。
設(shè)計出圖、切片:Photoshop
Adobe Photoshop,簡稱“PS”,是由Adobe開發(fā)和發(fā)行的圖像處理軟件,Photoshop主要處理以像素所構(gòu)成的數(shù)字圖像,使用其眾多的編修與繪圖工具,可以有效地進(jìn)行圖片編纂工作,PS有很多功能,在圖像、圖形、文字、視頻、出版等各方面都有涉及。Photoshop非常專業(yè),也稍顯復(fù)雜,是專業(yè)的平面圖片設(shè)計人員必需掌握的一款工具。作為前端開發(fā),你需要跟設(shè)計師緊密配合,學(xué)習(xí)一些 PS 知識會對你之后的開發(fā)更有幫手。
原型設(shè)計:Mockplus(時間成本最低)