定义:
程序员:只会写代码,不懂设计
漂亮的网站:设计比较现代化的,过渡的动画样式比较丰富的
个人网站:有高定制性要求的,不适合直接拷贝一个开源方案的
我的情况是 vue 写过一些项目,react 完全没学。后端程序员的个人网站,不是专业前端,不要求商业化级别,但是我十分想把网站做得好看,主页点开看起来各种元素的设计,交互方式都比较现代化的那种感觉,不太想要搞一个打开以后看起来干巴巴的。
但是我也不是学平面设计的,外加实在没有工时,比如说一个按钮写几百行代码,一个人做怕是要累死了。所以感觉路径就是通过使用开源的组件库,人家设计好的样式我去调用这样。不过目前用 vue 的感觉,不论是 vue2 时代还是 vue3 时代,我对 vue3 的功能性倒是没有任何抱怨,我觉得已经足够好用了,但是感觉组件库生态还是很薄弱。常见的一些库,elementplus 我觉得设计得不好看。vuetify 我觉得设计得挺好看的,动画交互比较复杂了,但是我感觉定制性很差啊,很多时候连把元素放到合适的位置和大小都做不到。。
最近也看了很多 v 站发个人网站的,感觉各有各的问题,现在在想是不是换个工具以后开源生态会好不少,就会有那种既有成熟的组件库,也不会定制起来比较难用的?
React 好看的组件库有:
https://nextui.org/
https://v2.chakra-ui.com/
https://mui.com/material-ui/
https://ui.shadcn.com/
https://semi.design/zh-CN
Vue 好看的组件库:
https://www.naiveui.com/
https://ui.nuxt.com/
倒是有些库基本是必选的那就是动画库,GSAP ,animejs 、animatecss ,诸如此类,替换掉默认的 ease 、linear 曲线观感就已经有很大不同了。
各大框架的技术栈都有相应的 UI 库,现在用的多的是 antd 系列,但不适合你说的个人网站。而且本身 UI 库和个性化就是冲突的,UI 库的出发点就是解决通用性的设计问题,减少重复劳动。你要说方便定制化的,那肯定是原生 JS 或 jQuery 生态。
ps.自己刚好在重构(重写)网站,放弃了 Angular 之上的 SSR 方案,选择原生+jQuery 方式,UI 采用自定义+Bootstrap 定制,毕竟如你所说,2C 的网站定制化程度太高,已经不适合框架和 UI 库了……
以前的人用 jQuery 是因为浏览器普遍兼容性特别差,jQuery 能够抹平很多浏览器兼容性问题。现在 2024 年了,主流浏览器( Safari 、Firefox 、Chrome 、Edge )可以放心使用现代 API 。个人网站以内容为主,不需要多少 JS ,你说的 Vue 、React 这些东西本身也没法帮你解决动画这些问题,反倒几行 CSS 就能搞定。
如果你不想写 CSS ,也有 Tailwind 这种东西,让 GPT 生成一组用 Tailwind 的 HTML ,自己改改就能上线,用前端框架说不定还在折腾工具链。