WEB前端 「懶人」養成計畫

2021-07-15 04:43:31 字數 1368 閱讀 2310



人類歷史上曾誕生了琳琅滿目的懶人科技,不斷遷就著人性的弱點,有汽車、火車、飛機這種大型地、顛覆式發明,也有一些非常酷炫的小型創意,甚至還誕生了不錯的服務,事實上,整個第三產業的市場就是**於「懶人不想做的事情」。這些創意在改變人類生活的同時,也改變了懶漢的定義,在擁有了大量的新鮮玩意之後,他們的境界正大有提高,事實上,懶已經不是完全意義上的貶義詞,在一定程度上,代表著高逼格。

作為一名碼農,更作為一名頁面仔,我只想說:哪乙個程式設計師,不想在寫**的時候偷點懶?當然這個懶,不是指那種當個純粹的搬運工(ctrl+c,ctrl+v大神),而是用更少的時間去完成日常的工作任務。正是為了更「懶」、更爽、更有逼格的寫**,才有了這篇文章。

乙個標準頁面仔的日常,應該是這樣子:寫寫html,調調css,然後除錯js,然後頁面搞定(送去給測試,發現ie bug ,哈哈)。說實話,寫這個無聊的html,css,能把人寫吐,或許你需要這個:

還有這樣:

emmet:前端神器,頁面仔必備啊!

這年頭,你要是出去面試,不知道less,sass,postcss,你都不好意思說你是前端。可見less,sass之流行。在我理解看來,一直把less,sass還有其他的比如postcss看成一種工具,沒當成語言來看待,就是為了讓css可程式設計,更方便的去寫css,更好的管理css,然後編譯生成css。

當然,這篇文章不會討論他們語法差異以及誰好誰壞,在我看來,適合自己的,適合專案的,就是好的。

sass十分鐘入門

sass一瞥

乙個命令就可以建立好乙個http伺服器,真是爽飛了

有關具體gulp的介紹,請參考gulp

頁面仔每天做的最多的事就是,重新整理瀏覽器,f5 or ctrl+f5 …

試想,當我寫完html,css,js 瀏覽就自動重新整理,這真是飛一般的感覺。browsersync給你想要的,甚至還它還內建了移動端除錯神器weinre,簡直不要太diao。

browsersync官網

step-1:準備好各種環境

首先你得有nodejs環境,然後你得全域性安裝gulp,http-server,browsersync,如下所示:

安裝超時的同學,建議使用**npm源,具體可見cnpm

step-2:轉殖我事先寫好的git懶人模板倉庫

git clone

step-3:檢視倉庫readme檔案

在終端執行: npm install(安裝超時的同學,建議使用**npm源,具體可見cnpm)

完成後執行: npm run http-server ,

再另啟個終端,執行: npm run bs-server

step-4:體驗一把做懶人的感覺o(∩_∩)o

step-5: 懶人第一階段完成,好了不寫了,我要去好好搬磚了

WEB前端 「懶人」養成計畫

人類歷史上曾誕生了琳琅滿目的懶人科技,不斷遷就著人性的弱點,有汽車 火車 飛機這種大型地 顛覆式發明,也有一些非常酷炫的小型創意,甚至還誕生了不錯的服務,事實上,整個第三產業的市場就是 於 懶人不想做的事情 這些創意在改變人類生活的同時,也改變了懶漢的定義,在擁有了大量的新鮮玩意之後,他們的境界正大...

懶人筆記 Web前端開發庫

專案需要乙個頁面展示,於是我冒充了2個月的web前端,這裡記錄下用到的相關工具和庫。web框架用的是django,不得不說,對於我這樣的前端小白來說,上手容易很多。也讓我進一步了解到python的強大。工具用途 說明djangoweb框架 前端小白快速上手,功能強大,為了和django celery...

學web前端有什麼計畫?

隨著十四五大力發展職業教育的政策公布,it職業開發教育再次登上熱門行業,所以學習web前端的小夥伴越來越多,但你知道學習web前端之前都需要準備什麼嗎?學web前端提前準備的計畫 首先對於自學的同學來說,完整的教程和學習路線是你需要提前準備的,否則你學習到一半發現教程接不上了或者學習一半不知道接下來...