前端指南：UI 库

关于《银河系漫游指南》系列

用户界面库

Tailwind CSS

引导程序

实现 CSS

jQuery

React JS

Vue.js

结论

参考

关于《银河系漫游指南》系列

这一系列文章致力于帮助开发者探索和驾驭 Web 生态系统。Web 开发浩瀚无垠，令人望而生畏，每个人都需要一份指南。

用户界面库

UI 库是第三方代码，通常提供开发者用于创建应用的 UI 组件和实用程序类。库通常会提供影响样式和布局的类以及可复用的 UI 组件。较新的库可能还会提供用于创建有状态组件的语法。

以下是一些流行的图书馆。

1. Tailwind CSS
2. 引导 CSS
3. 实现 CSS
4. jQuery
5. React.js
6. Vuejs

Tailwind CSS

最近感觉这篇 Dev.to 文章如果不提tailwind就不算什么了。它非常受欢迎，这其中有充分的理由。它有非常多的实用类，你可以用它来调整应用中需要编写 CSS 的最小细节。

引导程序

另一个流行的库是Bootstrap，它通常是许多开发人员的首选。它不如 Tailwind 灵活，但易于使用，并且拥有大量主题和示例。

实现 CSS

这是我个人快速构建 Web 应用的首选。Materialize CSS非常适合创建遵循 Material Design 规范的应用。

jQuery

这个老旧的库更值得一提。在 2017-2019 年左右，没有jQuery搭建网站简直不可思议。它提供了易于使用的 API，用于跨浏览器 DOM 操作、AJAX 和附加事件处理程序。

从那时起，诸如 document.querySelector() 和 fetch() 之类的 API 的标准化在某种程度上取代了该库的常见用例。

然而，jQuery 至今仍在使用，并催生了其他项目，如jQuery UI和Quint。

React JS

你可能想知道为什么它没有排在最前面。根据JS 现状调查，ReactJS自 2016 年以来一直是使用最广泛的“前端框架”。React 在这篇文章中排名第五，因为它既是一个库，又是一个框架。

React 允许逐步采用，您可以将其用作库。但是，建议使用 CLI 工具来引导和编译项目，使其更像一个框架。

React 与上述选项的不同之处在于，它允许你创建具有状态的可复用组件。例如，你可以使用自定义标签（例如 ）创建新元素<counter></counter>。

计数器由两个按钮和一个数字输入框组成，按钮可以改变输入框的值。计数器元素可以多次重复使用，并且每个计数器的值都可以轻松访问和重新赋值。React 不提供 UI 组件，而是允许您创建自己的组件。

我认为 React 的文档通俗易懂，基础知识可以很快掌握。React 还拥有声明式的编码风格，让你能够编写更可预测、更易于调试的代码。

Vue.js

Vue感觉就像是 React 的事实上的替代品。它比 React 有一些性能提升，而且不需要你用 JavaScript 编写 JSX 或 CSS。

Vue 是继 Angular 和 React 之后第三受欢迎的“前端框架”（根据 JS 现状调查）。与其他框架不同，Vue 并非由 Facebook（React）或 Google（Angular）等大型科技公司开发。Vue 生态系统仅靠社区支持就能取得如此大的进展，令人印象深刻。

结论

至此，我们结束了本次旅程的第一个目的地之旅。接下来还有7站！如果您觉得这篇文章对您有帮助，请考虑在dev.to或Twitter上关注我，这样您就不会错过本系列的下一篇文章了。

您最喜欢的 UI 库是什么？为什么？

参考

• JS 状态
• Vuejs 与其他框架的比较