你知道什麼是Layui嗎？也許有人知道，也許有人不知道，可是我相信大部分人都應該知道BootStrap吧，這個layui也和它差很少，是一個前端UI框架，不過他們都是有各自的特色，還真不能說人家是同樣的！javascript
我一衝動爲啥想着學習layui呢？由於我看他說了這麼一句話前端
準確地說，她更可能是爲服務端程序員量身定作，你無需涉足各類前端工具的複雜配置，只需面對瀏覽器自己，讓一切你所須要的元素與交互，從這裏信手拈來。java
好吧，衝着這句話，我必須學習一下啊，專門爲服務端程序員量身定作，不可不學啊。程序員
那麼如今開始自學layui了！數據庫
首先，找點視頻吧，直覺告訴我，沒有這方面相關的視頻教程，若是直接去找視頻教程比較浪費時間，因此放棄看視頻教程的念頭，那去網上搜博客學習，這個卻是不錯，不過至少應該去官網看一下吧bootstrap
你還別說，這頁面我喜歡，別貧了，看看他的官方文檔吧瀏覽器
挺詳細的，畢竟是我們國內人士開發的，那就先從這個文檔學習吧，先看看這個開始使用，在這個開始使用當中，提供了最簡單的使用方法，無非就是下載layui，而後導入本身的項目，本身跟着操做一遍，挺簡單，看到了效果，嗯，感受就這麼回事，不是很難啊（只是皮毛，可能都算不上）微信
接着往下看文檔吧，緊接着我看了下基礎說明中的底層方法，發現這塊就須要稍微動點腦子了，把這個底層方法看完以後，大體有點了解他這個模塊的一些使用方法了。框架
由於layui說的是經典模塊化嘛，因此模塊對於layui是個重點，看到這個layui的模塊使用，感受和element ui的使用有那麼幾分類似，跟bootstrap就有點差異了，我知道這必定是這個所謂的模塊化搞的鬼，有些東西仍是不太理解，趕忙接着看文檔吧。模塊化
接下來的重點就是頁面元素啦
通常這種前端ui框架上來就會先介紹總體佈局，這個layui也不例外，首先說的是佈局，這裏面說的是柵格系統，這個就比較熟悉了，由於bootstrap中就有這個啊，你還別說，看他這個文檔，我感受比
bootstrap中講柵格將的好，無論說多說少，最起碼你得說的我聽懂吧，這點，layui對於我而言，作到了。
這裏還提到了一個後臺佈局，我得趕忙試試，原本覺得很複雜，結果一看，就這麼多代碼，仔細看看代碼，非常簡單明瞭，本身就實際操做實例一下
就是這麼個效果，嗯呢，感受挺不錯的，接着看文檔吧，剩下的就是在ui中常見的一些圖標，按鈕和表單什麼的，看了下用法，都挺簡單易用的，他這個重要的就是有些使用起來要加載相應的模塊，好比你使用表單，你就要加入「form」這個模塊，像這樣加入
<script>
//Demo
layui.use('form', function(){
var form = layui.form;
//監聽提交
form.on('submit(formDemo)', function(data){
layer.msg(JSON.stringify(data.field));
return false;
});
});
</script>
對這一塊的理解其實蠻重要的，這些我以爲吧對於layui都是基礎使用了，重要的使用應該都是接下來的內置模塊。
通過頁面元素的的學習，這個layui的文檔大概看了一半，剩下的就是重點--內置模塊了。
這一看沒關係，立馬感受到費腦子了，第一個是彈出層，看文檔描述，這是個很牛X的功能，能夠獨立使用，不過讓我以爲很是讚的是這個模塊的學習他提供了在線調試
把相應代碼放進去，就能夠立馬運行看到效果，不得不說很貼心。
這個內置模塊應該說是layui的重點學習內容了，能夠說是對簡單頁面元素的綜合使用，不少都是作好的功能，這裏叫作模塊或者組件了，使用起來相比較單一的頁面元素會更顯複雜。
我以最快的速度把這些內置模塊看了一遍，有的還親手操做了一遍，最後發現很快會忘記，因此這塊我感受比較好的學習方法就是針對每個內置模塊都要單獨的去學習，好比咱們經常使用的表單這塊，就要單獨拿出來學習，以爲本身差很少會用了，而後開個項目，作一個小的demo，使用它作一些簡單的頁面，好比登陸頁面啥的，再結合後面的數據表格，鏈接上數據庫，實現數據查詢等實實在在的例子。
這樣的學習方式會比較高效！不過此次只是簡單的入門，後續還須要不斷學習。。。
接下來是個比較有意思的事情，知乎上一個關於這個框架和做者的一個相關問題，這裏摘抄自做者自己的回答
很是建議你去看下原文，尤爲第一個回答：
https://www.zhihu.com/question/58435239
我就感受吧，程序員這個羣體，最見不得別人裝逼了，尤爲是技術這塊，無論你服不服，必定會有人噴你。。。
成功無捷徑，學習有方法！
推薦閱讀：之後能夠給你們多多爭取極客時間的福利了！
本文分享自微信公衆號 - 編碼以外（ithuangqing）。
若有侵權，請聯繫 support@oschina.cn 刪除。
本文參與「OSC源創計劃」，歡迎正在閱讀的你也加入，一塊兒分享。