2017最新版13款不容錯過的前端開發Javascript和css類庫

編程語言 CSS JavaScript 軟件 奔跑中的蝸牛 奔跑中的蝸牛 2017-09-07

2017最新版13款不容錯過的前端開發Javascript和css類庫

前端的JS和CSS類庫日新月異, 在今天這篇介紹中,我們將精挑細選13款超棒的JS/CSS類庫, 希望大家在開發過程中會覺得有幫助~

分享之前我還是要推薦下我自己的前端群:524262608,群裡會不定期更新最新的教程和學習方法,我自己整理的一份2017最新的前端資料,送給大家,歡迎初學和進階中的小夥伴

1、Core UI

基於Bootstrap4的一套UI類庫, CoreUI是一套admin的管理模板,提供了高定製化的解決方案來創建控制模板和平臺。 這有幾種不同的版本幫助你快速的整合最流行的框架,比如, AngularJS, React.jS,Vue.jS等等

2017最新版13款不容錯過的前端開發Javascript和css類庫

2、React Trend

來自Unsplash的一個react版本的組件,用來方便的創建線圖,可以方便的展示趨勢和活躍相關的數據。這個項目使用了極簡的設計模式,給予你一個簡單直接的方式來達到目的。 所以不要期望提供了一個完整功能的類庫。 當然, 同時也提供了一個非官方的Vue版本,點擊 這裡 獲取

2017最新版13款不容錯過的前端開發Javascript和css類庫

3、Element

element是一個基於Vue2.0.js的UI框架。 包含了超過50個組件的樣式設計, 包含了特定的設計和顏色選擇。每一個元素都擁有非常好的文檔, 並且非常易於在線vue.js中定製化和實現。 這裡同樣也包含了一格實用的 Sketch模板 ,用來幫助你設計mockup

2017最新版13款不容錯過的前端開發Javascript和css類庫

4、BigPicture

現代lightbox插件可以同步支持視頻和圖片,提供了彈出式的順滑動畫。 特別拽的特性在於同時支持<img>標籤和background-image元素, 給於開發人員充分自由度。

2017最新版13款不容錯過的前端開發Javascript和css類庫

5、Reactive Listener

不要以貌取人, 這並非一個react的組件。 Reactive listener是一個來自Zurb的微型類庫,允許你創建先進的事件監聽, 響應點擊和懸浮相關的複雜行為。 目前只能識別用戶向元素移動, 但是未來更多很酷的監聽會被添加進去

2017最新版13款不容錯過的前端開發Javascript和css類庫

6、Eagle.js

Eagle.js是一個Vue.js框架的類庫,用來創建基於web的幻燈效果,非常類似reveal.js,支持動畫,主題,互動組件,所以非常易於組件,樣式,幻燈的重用

2017最新版13款不容錯過的前端開發Javascript和css類庫

7、Planck.js

這個類庫是知名的C++ Box2D類庫的Javascript版本實現, box2d已經被遊戲開發工程師使用了很多年了。planck.js優化了web/移動瀏覽器的引擎, 提供了開源的Javascript代碼基礎和API。 這個方式開發人員將會更加舒服的創建2D遊戲和其它物理相關體驗

2017最新版13款不容錯過的前端開發Javascript和css類庫

8、Create React Native App

隨著Create React App的成功, 這又出現了一個React Native app工具,不需要任何編譯配置。 允許React Native apps 被配置和測試, 而不需要安裝Xcode或者Android Studio

2017最新版13款不容錯過的前端開發Javascript和css類庫

9、Pushy Buttons

一個非常迷你的CSS-only的3D按鈕, 擁有非常好的下壓效果。 按鈕提供了4種尺寸, 3種顏色, 非常容易通過SASS定製化, 或者簡單修改CSS源文件

2017最新版13款不容錯過的前端開發Javascript和css類庫

10、MoveTo

輕量級的點擊移動動畫類庫, gzip後只有1kb,大家可以體驗

2017最新版13款不容錯過的前端開發Javascript和css類庫

11、Anchorme

一個強大的Javascript類庫, 可以檢測任何字符串或者文本中的URL地址。 快速,並且準確, 擁有很大多定製化的功能。 包含一些實用的功能, 比如, 將URL轉化成了可以點擊的<a>標籤

2017最新版13款不容錯過的前端開發Javascript和css類庫

12、RPG Awesome

免費的圖標字體, 擁有將近500個超棒的矢量圖標。 可以通過SASS定製化~

2017最新版13款不容錯過的前端開發Javascript和css類庫

13、Tent CSS

Tent CSS是一個提供了最簡單響應式開發的框架。 輕量級, 5kb, 擁有現代的flexbox網格來做頁面佈局

2017最新版13款不容錯過的前端開發Javascript和css類庫

最後給程序員一些建議:

1、解決問題的途徑比得到結果更重要

解決問題是一個通用的能力,本應在學生時代習得,若是不擅長解決問題,怕是短時間內很難提升,但在一個具體的領域裡,往往「途徑」更加重要。

當你在一個論壇或社區提出一個問題時,有些惜字如金的大牛會直接丟給你一個鏈接,不會多留下哪怕半個字,不要小看一個鏈接,它可能比直接告訴你答案更有價值。

當你進入一個新的領域,遇到問題時往往不知道應該去哪尋找答案,這時候你會想如果有一個網站,列出了作為新手可能遇到的一切問題該多好。但世上沒有這麼好的事情,往往這些問題和解答分散在不同的網站上 —— 從這個鏈接就可以點過去。

2、不要相信一句話就可以描述的真理

網絡上的大牛經常提出提出一些簡潔有力的口號,例如「抽象可以解決計算機領域的一切問題」、「好的代碼不需要註釋去解釋」、「動態類型語言才能提高編碼效率」、「PHP 是世界上最好的編程語言」等等

並不是說這些觀點是錯誤的,但它們就像「蘋果總是會落到地上」這種簡單的理論一樣,描述的情況是片面的,而非普適的。有些結論是前輩們花了大量的時間和精力探索出來的,但光知道一個結論對你的編程是沒有太多指導意義的,更多的細節隱藏在得出這個結論的過程中。

所以如果提出這些觀點的人沒有深入介紹、你也不打算自行了解,索性不如忘掉這些話。

3、前端開發Javascript和css類庫到這就結束了,還是要推薦下我的web前端學習群:524262608,群裡會不定期更新最新的教程和學習方法,我自己整理的一份2017最新的前端資料,送給大家,歡迎初學和進階中的小夥伴

web前端學習方法經驗可以關注我的微信公眾號:‘學習web前端’,每天一篇案例源碼或經驗分享,關注後回覆‘給我資料’可以領取一套完整的學習視頻

相關推薦

推薦中...