對DevUI組件庫王哥的專訪

今天小助手有幸採訪到了DevUI組件庫的王哥，瞭解到了 DevUI 組件庫的一些「內幕消息」，她的前世此生，以及將來的一些規劃。

在過去的一年裏，DevUI 在社區一直都是一個祕密，由於沒有人真正認真地介紹過她。

提到 DevUI，

有些社區的朋友只知道是華爲的一個UI組件庫；

有些朋友雖然隱約聽過 DevUI，但不知道她的全名，而叫作「Dev」；

還有些朋友由於不瞭解 DevUI，認爲她只是 Ant Design 的複製品。

這是多麼大的誤解啊。

爲了讓社區的朋友更多地瞭解 DevUI，小助手特地採訪了王哥，將採訪獲得的第一手的消息，第一時間分享給各位讀者朋友們。

如下是採訪的正文。

---

🎙️小助手

王哥您好！

👨王哥

你好！

🎙️小助手

感謝您百忙之中抽出寶貴的時間來接受個人採訪。最近一年常常在 掘金、 知乎、 思否等國內技術社區看到 DevUI 的身影（最近甚至在國外的 DEV社區也看到 DevUI 在活躍），小助手我呢，也有幸參加了掘金去年在嗶哩嗶哩的年度創做者打榜直播，DevUI 團隊但是得到了團隊第5名的好成績呢，恭喜恭喜🎉。

👨王哥

謝謝你對 DevUI 的關注，小小成績，無足掛齒。

🎙️小助手

雖然 DevUI 去年纔剛開始開源，不過據說 DevUI 創立的時間遠遠不止一年，而且華爲雲內部已經有衆多商業項目都在使用 DevUI，您能給咱們簡單介紹下 DevUI 的歷史嗎？

👨王哥

這說來可就話長了，早在 2017 年年初的時候，DevUI 組件庫就已經開始搭建，當時 Angular 2 正式版本也纔剛發佈3個多月。那時 DevUI 也還不叫 DevUI 呢，叫 AvenueUI，也只有兩三我的在邊作業務邊兼職開發。當時雖然人少，可是你們都頗有熱情，不到一年的時間，就已經開發了 30+ 個組件，而且陸陸續續有業務開始使用 AvenueUI 組件庫，AvenueUI 就是 DevUI 的原型。

到 201八、2019 年，AvenueUI 跟隨 Angular 版本升級了 Angular 4 和 Angular 7 版本，持續增長了很多組件，並大大擴展了 DataTable 表格組件的能力。

到 2019 年年末的時候，AvenueUI 正式更名爲 DevUI，並更換了 LOGO。

2020 年是 DevUI 開源的元年，通過這許多年，DevUI 已經經受了 DevCloud 大量線上用戶的考驗，成爲穩定、高效、體驗流暢的UI組件庫。爲了讓社區更多開發者可以享受 DevUI 帶來的沉浸式的用戶體驗，咱們決定將 DevUI 所有組件開放給社區，並接受來自社區的考驗，同時也增長 DevUI 在社區的影響力，完善 Angular 在國內的生態。

到如今 2021 年，已經有 100+ 大小業務在使用 DevUI，DevUI 也在各類業務場景的考驗下，不斷地演進和完善，目前 DevUI 已經開源的組件一共有 61 個。

🎙️小助手

哇！從僅有兩三我的兼職開發的 AvunueUI，到如今已經有 60 多個開源組件的 DevUI，真了不得！爲 DevUI 點贊👍在作 DevUI 以前，大家有沒有考慮過使用現成的組件庫，好比小助手瞭解到 Google 的 Material UI 和阿里的 NG Zorro 就是很是不錯的 Angular 組件庫呢，爲何不直接用它們呢？

👨王哥

你可能有所不知，Material UI 如今是 Angular 官方的組件庫，也是全世界最受歡迎的 Angular 組件庫，不過 17 年 18 年那個時候Angular社區生態沒有這麼豐富，那時的 Material UI 還不是很完善，無法知足 DevCloud 這邊複雜的業務場景。而 NG Zorro 也是在同時期發佈，NG Zorro 的 1.0 版本 18 年中旬正式發佈。

當時有一個相對完善的 Angular 組件庫作得很不錯，叫 PrimeNG，咱們也有輕度試用。不過組件庫的設計風格和和交互和咱們的產品仍是不太契合，後來就打算本身作，也就是如今的 DevUI。

🎙️小助手

還真沒仔細瞭解過 Material 和 Zorro 的歷史，漲姿式了！前面提到 DevUI 2020 年開始開源，大家爲何要開源呢？又沒什麼好處。

👨王哥

我想大概是開源情結和對技術的熱情吧，我相信全部作開源的組織和我的開發者都會有這種一種情結和精神，就是有一個好東西，想要和別人分享的樸素的願望。另外咱們做爲國內 Angular 的使用者之一，也但願爲國內 Angular 生態貢獻一點力量，Angular 仍是很不錯的，它提供了很是豐富的工具，可以極大地提高開發者的效率和用戶的體驗。

事實上，在開源社區，咱們也認識了不少優秀的開發者，目前咱們的 DevUI 官方羣已經有 240+ 人，你們都對前端技術，對 Angular 技術頗有熱情，很活躍也很積極地討論問題。

🎙️小助手

這我知道，由於我是羣主，這羣可愛的小夥伴們都是我拉進來的，哈哈哈！在王哥看來，和 Material、Zorro 這些 Angular 組件庫相比，DevUI 最大的優點是什麼呢？

👨王哥

不能否認，Material 和 Zorro 都是很是優秀的組件庫（很榮幸咱們還跟Zorro團隊有過技術交流），不過 DevUI 是獨一無二的，它是從華爲雲 DevCloud 研發工具體系孵化出來的，帶着很鮮明的個性特徵，不論是直觀視覺上，仍是沉浸式的交互上，或者是流暢的動畫上，都與別的組件庫不一樣。她從研發工具鏈業務來，也最適合作 ToB 的工具類產品，由於這類產品不追求酷炫的樣式，而更在乎工具是否穩定、使用起來是否高效，是否能真正讓用戶忘記工具、在使用工具的過程當中達到心流狀態。

這就是 DevUI 一直致力於作的事情，沉浸、至簡、靈活，這是 DevUI 的價值觀，也是 DevUI 的一大優點。

另外，DevCloud 業務複雜，場景衆多，DevUI 如何設計 API 以保持靈活和通用，如何在知足多種業務需求的同時，保持自身的獨立性，而不與業務耦合，這也是 DevUI 一直在思考和實踐的。咱們除了精心打磨每一處交互細節，咱們還精心設計每個 API，不只讓用戶用得舒服，也對開發者友好。

「燒不死的鳥是鳳凰」，我想，DevUI 經歷了 100+ 業務的歷練，她已然是一個成熟、穩定、高效的UI組件庫。她不須要跟別人比，而是盡力作好本身，服務好開發者。

🎙️小助手

我看了下 DevUI的官網，裏面有很多組件，我看其它UI組件庫都是沒有的，好比 甘特圖、 象限圖，以及新出的 分類搜索、 精靈導航等，我想這也是 DevUI 的特點和優點吧。

👨王哥

是的，咱們是面向 ToB 的工具類產品的，有一些別的組件庫可能沒有的組件，但咱們有，由於工具類產品須要。咱們的每個組件都是有大量的業務場景的，並非憑空作的。

🎙️小助手

我想大概這就是 DevUI 獨特的魅力吧。大家有沒有考慮作 Angular 以外的其餘技術棧的組件庫呢？好比 Vue、React 等。

👨王哥

有很多社區的朋友也但願咱們提供 Vue、React 的版本，DevUI 有一套通用的設計體系和設計價值觀，Angular 是咱們的設計體系的一個實現，理論上移植到其餘技術棧是徹底沒問題的。不過，咱們更但願社區的小夥伴參與進來，一塊兒建設 DevUI 的生態，這咱們是很是歡迎的。

🎙️小助手

小助手我有了解到像 And Design 和 Element UI 都有作 Admin 這種中後臺解決方案，Ant Design 有 AntD Admin，Element UI 有 Vue Element Admin，DevUI 有計劃作 Admin 系統嗎？

👨王哥

有的，這也是社區對 DevUI 的指望和訴求，咱們從去年就開始籌劃Admin系統，很快 1.0 版本就會跟你們見面，盡情期待！

🎙️小助手

最後再問王哥一個我本身一直比較好奇的問題，就是 DevUI 的 LOGO 我看挺有意思的，它是有什麼特殊的含義嗎？

👨王哥

這個還真有，當時咱們的設計團隊給咱們設計了十幾個 LOGO，這是你們一塊兒評選出來的，一眼看去，你以爲它像什麼？

🎙️小助手

像兩個箭頭？

👨王哥

真聰明！她有兩個象徵意義，一個是 HTML 元素中的左右尖括號，表明咱們是作開發工具鏈的，是爲開發者服務的；另外一個是 V 字手勢，表明 DevUI 是和業務協做雙贏的，業務的成功就是 DevUI 價值的體現。

🎙️小助手

感謝王哥的耐心和時間，也祝 DevUI 在 2021 年愈來愈好，有更多的開發者使用和喜好 DevUI！