hana-ui - 一個清新二次元風格的React-UIKit

dtysky發表於2018-02-24

Logo

hana-ui(官網Github)是一個二次元清新風格的React-UIKit,使用ES6+SASS+Typescript開發,擁有豐富的元件用以構建複雜前端介面系統,目前已在Bilibili管理後臺和一些前端頁面進行了應用。

有興趣的來點個Star吧www

初心

這個專案是在B站完成的,完成者是我和另外兩個同事,其名字源於我和其中一位同事的一次飯後討論,死宅嘛,總想要搞出一些東西為二次元啊業界啊做出些貢獻,於是便有了這個UIKit,懂行的人一看hana-ui這個名字大概也就明白這個庫是什麼風格了。

其實不嚴格來說,這個專案在去年五月份差不多就完全完成並投入使用了,但由於公司等原因一直沒有開發出來,而在這空閒的幾個月我們將其升級到了React16,並新增了一些新的特性,並進一步完善了官網和文件。

定位

overview

定位方面,由於我們團隊都比較務實,比較討厭現在吹來吹去的所謂“Design Language”,所以定位也就是一個單純的React用UIKit,一個UI元件庫。

設計

components

基本UIKit應該有元件的都有了。元件分為種子(seeds)、芽(burgeon)和花(flower)三部分,複合性層層遞增。

風格方面,主題可配置,預設走清新風格。

程式碼方面。主程式碼走一套ES6加上一套Eslint(專案開始的時候還沒上Typescript),不過補上了一套ts頭可以和Typescript相容。

測試暫時沒有,但在複雜工程中過了很久了所以也算是得到了最好的測試。關於純前端檢視層的單元測試必要性問題這個見仁見智,我的觀點是模型可以測,檢視方面測試純屬吃力不討好。

請幫助我們!

不過想必大家也發現了,現在UIKit整體的設計有些地方還有些糙,這個我們也很無奈。我不知道公司如何定位我們這個元件庫,當時(現在也是)處於弱勢的我們部門並沒有為這個元件庫爭取到設計資源,所以設計也是我們三個自己操刀的。

讓前端來做設計嘛,和讓設計來寫前端差不多,做到這樣我們已經盡力了,所以在這裡如果有專業的設計師死宅同學給出幫助我們是再歡迎不過了。

不過由於不被重視,所以這個庫的開源和B站毫無關係,完全是hana-group自行維護,自由度也高一些。

二次元本就是一個去中心化的創作叢集,由無數有愛人士共同貢獻,在這一點上hana-ui也是一樣的。
個人力量畢竟有限,所以希望大家能積極參與!

相關文章