您的位置:首頁>科技>正文

前端小白和想轉行的 應該怎麼樣系統的學習web前端開發

第一、 前端入門

先熟悉前端基礎, 再做些小項目快速上手。

前端的基礎:JavaScript, HTML, CSS, 然後學習jQuery。

基礎入門可以按照Web前端工程師學習路徑學習, 看教程的同時, 要多多練習。 走向大神的路無他, 唯手熟爾。 可以模仿自己喜歡的漂亮的網站, 寫寫頁面, 實現一些特效。

想學好前端的可以來我們晚上的課堂聽課, 每天晚上都會講一個小案例或小專案或分析前端面試以及工作和發展, 更多的是談一些學習路線和方法, 零基礎和原生JavaScript都有, 可以加裙623966806 (這些都是免費的, 每天都有)給你課堂地址和往期錄製好的視頻。

基礎篇

1.Web - HTML基礎入門

如果你想製作自己的網頁, 做網頁設計, 網站開發, 那麼你首先要學習的就是HTML, 本教程就是入門HTML實驗。

2.Web - CSS速成教程

CSS即層疊樣式表(Cascading StyleSheet)。 在網頁製作時採用層疊樣式表技術, 可以有效地對頁面的佈局、字體、顏色、背景和其它效果實現更加精確的控制。

3.Web - Javascript基礎(新版)

介紹 JavaScript 的語法及事件、物件、DOM 等基礎知識。

4.HTML5 - HTML5基礎入門

HTML5有很多新特性, 本實驗將做入門介紹。

5. Web - jQuery基礎入門

jQuery是繼prototype之後又一個優秀的Javascript庫。 它是羽量級的js庫 , 它相容CSS3, 還相容各種流覽器。

6.Web - Bootstrap3.0入門學習

項目篇

下面是一些有意思的前端練手小項目, 如果不過癮可以在這裡找你感興趣的全部 - 課程 - 實驗樓

1.HTML5 - HTML5兩步實現拼圖遊戲

使用HTML5和css3實現的九宮格拼圖遊戲。

2.Web - 網頁版掃雷

相信大家都玩過windows系統自帶的掃雷, 今天我們來做一個網頁版的掃雷。

3.Web - 親戚稱謂計算器

使用html,css,jquerymobile帶你完成一個親戚稱謂計算器, 幫你快速想起你的親戚的稱謂

4.Web - 打造網頁版「大白」

使用 HTML 和 CSS 來打造自己的「大白」, 最好對 HTML 和 CSS 有一定的瞭解。

5.Web - 網頁版-別踩白塊遊戲

用最基礎的html, css, 以及原生的JavaScript實現一個網頁版本的“別踩白塊”遊戲, 有圖有真相。

6.Web - Ajax歌詞同步播放機

用JS實現動感的歌詞同步播放機,僅需簡短的JS代碼就可以實現歌詞同步播放,配合簡單的幾十行php既可以實現切換歌曲。全部是Ajax哦,非常簡單。

7.PHP - 轉盤抽獎

使用javascript、html、css、jquery和php實現一個轉盤抽獎,讓你窺探抽獎背後的秘密。

8.HTML5 - HTML5 本地裁剪圖片

利用HTML5的File API和Canvas實現本地的圖片裁剪

9. Web - SCSS(SASS)畫小黃人

SCSS(SASS)畫小黃人,學習CSS3。

第二、 如今的前端

近幾年前端發展迅速,ES6的普及速度更是驚人,所以一定要學習ES6/7(ECMAScript 6入門)。

其次是Node.js,Node.js是伺服器端的一個平臺,其給前端開發提供了很多實用的工具,是如今前端開發的重要組成部分。

工具推薦:Babel,Webpack,Postcss。

框架推薦:React,Vue.js。

第三、不止前端

使用Hexo(一個Node.js平臺下的靜態博客)在 github page 上面搭建一個博客,通過博客寫下自己學習過程中的經驗和問題可以與更多的人交流,提交自己的代碼到github上面保存自己的成果。寫博客是一個很好的成長方式。

前端已不是從前的前端,不僅僅是切頁面做特效,如今的前端專案越來越龐大,需要重視專案組織和管理,需要工程化,需要前端架構。

同時,學習一門後端語言更有利於在前端的路上走得更遠。

6.Web - Ajax歌詞同步播放機

用JS實現動感的歌詞同步播放機,僅需簡短的JS代碼就可以實現歌詞同步播放,配合簡單的幾十行php既可以實現切換歌曲。全部是Ajax哦,非常簡單。

7.PHP - 轉盤抽獎

使用javascript、html、css、jquery和php實現一個轉盤抽獎,讓你窺探抽獎背後的秘密。

8.HTML5 - HTML5 本地裁剪圖片

利用HTML5的File API和Canvas實現本地的圖片裁剪

9. Web - SCSS(SASS)畫小黃人

SCSS(SASS)畫小黃人,學習CSS3。

第二、 如今的前端

近幾年前端發展迅速,ES6的普及速度更是驚人,所以一定要學習ES6/7(ECMAScript 6入門)。

其次是Node.js,Node.js是伺服器端的一個平臺,其給前端開發提供了很多實用的工具,是如今前端開發的重要組成部分。

工具推薦:Babel,Webpack,Postcss。

框架推薦:React,Vue.js。

第三、不止前端

使用Hexo(一個Node.js平臺下的靜態博客)在 github page 上面搭建一個博客,通過博客寫下自己學習過程中的經驗和問題可以與更多的人交流,提交自己的代碼到github上面保存自己的成果。寫博客是一個很好的成長方式。

前端已不是從前的前端,不僅僅是切頁面做特效,如今的前端專案越來越龐大,需要重視專案組織和管理,需要工程化,需要前端架構。

同時,學習一門後端語言更有利於在前端的路上走得更遠。

Next Article
喜欢就按个赞吧!!!
点击关闭提示