七個不可錯過的 React 元件庫與開發框架

發表於2017-09-11

React-_thumb

React是如今最火爆的前端技術,而React最棒的一個特點就是有大量功能豐富的元件庫和開發框架可用。從按鈕到卷軸到工具條,應有盡有,而且這些元件可以各行其是,也可以組裝成複雜的UI,你也可以把UI分解成獨立的可服用的模組。

以下IT經理網介紹幾個非常重要而有用的React元件庫和開發框架,方便你在現有React元件基礎上快速拼裝UI:

1.React Material UI

Material UI是實現谷歌擬物設計原則最流行的框架,包含大量元件,如工具條、表格、按鈕、導航等等。甚至還為UI設計提供了超過900個不同的SVG圖示。

2.React Bootstrap

React Bootstrap提供面向React元件的Bootstrap重構框架,Bootstrap是目前最流行的UI框架,將它與React元件合體,夫復何求?

3.React Belle

React Belle提供哦你一系列漂亮的,可配置的元件,包括開關、下拉選單框、評分、文字輸入、卡片等等。這個框架引以為傲的是為桌面和移動端都做了優化的同時,也支援進行樣式上的高階自定義配置。

4.React ToolBox

React Toolbox是非常流行的React元件庫,包含大量擬物設計元件。React Toolbox基於最流行的方案例如CSS Modules(由SASS編寫),Webpack和ES6,能夠與Webpack工作流無縫整合,並且非常容易定製,也非常靈活。雖然包含多大十種元件,React Toolbox的可配置性非常高,提供絕佳的UI開發體驗。

5.React Grommet

Grommet是一個非常強調體驗的的React元件庫,所有元件都可訪問,具備跨瀏覽器相容性且支援主題定製。通過對屬性的配置,元件的靈活性也可以進一步提高。Grommet顏值很高,非常適合用來快速開發乾淨簡潔,具備關鍵基本功能的UI。

6.Semantic UI

React Semantic UI是React官方整合的Semantic UI元件庫。作為一個開發框架,Semantic可用來建立介面美觀的響應式佈局,支援對HTML標籤或元件渲染的控制。你也無需增加額外的巢狀元件來編輯元件功能和屬性。這對於同時使用MenuLinks和React-router來說非常重要。

7.React With Bit

Bit是一個非常強大的工具,可以呼叫任何其他應用或者程式碼庫中找到的任何元件。Bit在你的原始碼檔案之上增加了一個虛擬層,幫助建立、管理和複用元件,而無需匯入整個程式碼庫。Bit會自動解析文件並在任意地點和框架中執行元件測試,這使Bit成為一個極為有用的React元件工具。在Bit community hub社群,你還能找到所需的幾乎任何React UI功能

相關資源:React元件和程式碼庫列表

相關文章