我的前端技术栈

现在 AI 编程工具日新月异,极大的提升了编程效率,可以说是革命性生产力工具,尤其是对前端项目,更是如虎添翼。拥有自己的前端技术栈,我觉得还是有必要的,在自己掌控的架构内,按照自己的编程习惯,可能发挥效果更好,由于自己不是一直在写前端项目,只是偶尔写一下,过段时间都忘了如何选型,每次开始一个项目都会纠结选型,外加前端技术日新月异,在此整理记录一下,便于自己每一次前端项目选型,同时也可以随时更新这个文章。

  1. 整理常用的前端 UI 库,作为导航
  2. 整理不同项目的前端框架,UI 等选型方案
  3. 前端工具类库
  4. 灵感库导航

没有评分代表未深入使用

前端 UI 库

整理常用的前端 UI 库,作为导航

React

综合库

  1. 蚂蚁 Ant Design ⭐⭐⭐⭐⭐
  2. 淘宝 fusion⭐⭐⭐⭐
  3. 抖音 semi ⭐⭐⭐⭐
  4. 腾讯 TDesign
  5. 字节 arco
  6. shadcn/ui
  7. material-ui

图表库

  1. 百度 echarts ⭐⭐⭐⭐⭐
  2. 淘宝 BizCharts
  3. Ant Design Charts
  4. visactor

Vue

TDesign 和 arco 都支持 Vue

  1. element ⭐⭐⭐⭐⭐

图标

  1. lucide ⭐⭐⭐⭐⭐
    支持 react,vue,icon font 等

前端项目选型

后台管理系统

Ant Design Pro ⭐⭐⭐⭐⭐

https://github.com/ant-design/ant-design-pro
首选方案选择该方案,方案成熟,社区活跃,出自蚂蚁金融,该方案采用umijs+ant design

飞冰 ⭐⭐⭐⭐

https://fusion.design/pc/template/739

我使用最多的是 ice.js,最早是提供了很多 block 级模板,后续演化出了 ice.js。
该方案采用 ice.js+fusion

ice.js 很容易入手,属于渐进式,虽然有一系列开发工具,不过组件和模板建设不如 ant design。如果只是单纯选 react 框架,我更愿意使用 ice.js。

vite+semi ⭐⭐⭐

虽然没有成熟模板,但是 vite 确实很适合快速搞个轻量级项目,文档丰富,使用简单。稍微搞搞就可以自己搞个简单后台管理系统项目。

落地页/文档型网站

dumi ⭐⭐⭐⭐⭐

https://github.com/umijs/dumi

我的 book 和 toolkit 都是该技术方案,使用简单,唯一不足是 2.0 主题我觉得没有 1.0 好看。

Starlight ⭐⭐⭐⭐⭐

https://starlight.astro.build/

Starlight 是一个基于 Astro 框架构建的全功能文档主题。 Astro 非常灵活,什么都能做,但文档站点是一个特别常见的场景。所以 Astro 团队就推出了 Starlight:帮助开发者快速搭好文档站,不用自己每次造轮子

astrowind ⭐⭐⭐⭐⭐

https://github.com/onwidget/astrowind

一个使用 Astro 5 和 Tailwind CSS 的免费落地页模板

VuePress

https://vuepress.vuejs.org/

暂未使用

自定义网站/官网

目前选择 Vite + Tailwind CSS

我现在的官网就是这个方案:trumandu.top

前端工具类库

记录自己常用库

灵感库导航