场景：后端老手。正规应用，前端都是有人用。
但偶尔一些应用场景还是需要自己能鼓捣出来页面展示，不能所有的全依赖于前端。
前端目前能力：之前的数十个大小前端项目，vue 项目居多。也就是会看看代码，看看前后交互，改改配置项，编译部署。react nextjs 也有几个项目，修改各类 js 代码可以。紧急情况下，也可以写一些 js 。 前端水平，如果有人把页面搭建搞好了，自己能完成剩下所有事情。
主要困惑：1.css 难读难写。2.如果要设计一个稍微复杂一点的页面，觉得无从下手。 不知是否有一种快速搭建页面的技术存在?
形势所需，自我要求多掌握游一些技能，请各位有类似经验的指点一二，谢谢！

css 难读难写：tailwind ？不用的话，用它的文档学 CSS 也不错。稍微复杂一点的页面：flex 或 grid 嗦到底？不知道这里的复杂是状态复杂、动画复杂还是布局复杂。快速搭建：ai? v0.dev ?

直接用 template engine ，最简单，无需 node 环境，比如 thymeleaf

Cursor 解君愁

＃1 多年后端，写前端遇到的最大的问题就是不会布局，一个单位就搞的自己晕头转向，px, rem, vh ... ，每次写起来都焦头烂额的，感觉现在唯一能写的就是 管理后台了，就这样也是照葫芦画瓢，不过更大的可能是自己太菜了。

tailwind 在一个 nicegui 的项目里 全程用过它，很好。还不知道在 nextjs 或者 vue 里面怎么用它,回头我查查资料 哦，多年前用过，我原以为这是一种过时的技术，如果现在有新的能用，我也看看 AI 编程插件我只用于部分独立的语句。 全局方面 还是想自己先掌握了。

我遇到的困惑跟你一模一样，总结出两条重点：1. 布局 flex 套 flex ，别想别的。2. css 用 tailwind ，全交给 ai 。无从下手的问题：选一个抄，直接网页截图发给 chatgpt 让他帮你写好框架，然后用 flex 套 flex 的思路一把梭。要避坑的点：太早考虑适配不同尺寸的问题，直接先按自己屏幕大小写死尺寸，写完再慢慢调。

推荐 vue3 一把梭，或者用 layui

可能不是菜 而是思路没跟上前端的思路，管理后台也是后端最需要的 确实是这样的后端困惑，你说的思路我会试试 知道这个好，就还是不知道怎么梭 vue3 技术栈先后看了不少 改写一点东西基本能搞定，要开个新项目或搭建歌新页面 就呆住了。

骨架让 ai 帮忙写没问题的，不用担心 ai 让你掌握不了细节，你可以这么用：先让他给你生成一个参考，然后你基于它的一点一点，我刚开始就是这样，改到最后跟它生成的一点关系都没有了，但起码会有个着手点，不至于抓瞎。另外我个人觉得，vue 比较好入门，它整套都是定好的，更容易集中注意力在重点上，react 太灵活，初学很容易纠结在一些无关紧要的小事情上。

投 tailwind 一票

如果要设计一个稍微复杂一点的页面，觉得无从下手如果不打算花很多时间精力做前端，其实还不如不做复杂的页面，就做简单的。其实复杂也没啥好处，很多设计都是过度设计。另外，可以先做一个最最最简单的页面，再慢慢改复杂。不要一开始就做复杂。

难道我真的老了吗？竟然没看到 ＃Bootstrap

1. CSS 基础书籍学起来啊。2. 复杂的页面，也是一点一点堆起来的。先布局，调样式，加特效等等。不懂的 CSS 搜一下。我看你基础太弱了。系统的学下 CSS 和 JavaScript 吧！别上来就框架。

   谢谢各位的建议

css 不难，快速上手的方式是买一本 css 的书，花个 3-5 天时间通读一遍，遇到问题向 gpt 请教。对于编程老手，估摸着也就 1 周时间能基本精通了

有推荐的 吗

对前端感觉复杂会不会是因为你布局系统没掌握，直接学习 flex ，position 的使用，可以实现 99%的界面，js 的话是编程语言学起来简单

可以自己思考实现一个后台管理的骨架出来，做完基本掌握前端的布局了 0.0

CSS 一个难点在有很多属性要记。多看几本书，MDN 经常看看。一些参考资料1. MDN - developer.mozilla.org/en-US/docs/Web/CSS2. CSS roadmap - roadmap.sh/r/css-6nqag3. 深入研究 CSS 的英文博主： ishadeed.com/

看你后端语言啊，我主要用 laravel ，基于后端的全栈技术很完善，不需要学太多前端的东西了。

别学

最近学前端做了个服务号， 用 padding 用的真爽

哈哈，一样的，现在基本上都是 flex 套 flex+tailwind ，再复杂点的页面，就花几十块钱，淘宝让 人工 gpt 上了。。。

后端能写好的人，前端是没有问题的，你把前端页面划分为几个层次，层->块-元素 层是指你的页面中会有多少层，主要是对话框，遮罩层，这些层在什么什么时候显示隐藏。块就是把每个页面按功能分多少块，如果在页面宽度或内容多少发生变化的时候，每个块的大小如何发生变化，使用 flex 布局很简单，只通过 padding 或 marging 来间隔块就行了，如果还复杂，就多套一个 div 。元素就是 html 元素，你使用合适的元素和事件就行了。使用现在的框架来组合上面说的就行了，现在基本没有框架完不成，需求直接手搓 css 的了。

C＃准备研究一下 Blazor ，不过也只能跳过 jshtml 和 css 还是跳不过

层是怎么体现的，也是 div 和全局 className 实现吗

谢谢各位的建议，用新思维，再挑战一下自己

层是指 position 产生的 z 轴，正常布局都在同一层，层互相独立。块就是 y 轴自动向下沿伸，块互相独立。元素是块里的 x ，水平排列会换行。然后整个页面就是坐标系的俯视图。也有属性可以改他们的相对关系，比如 transform 、float ，想进一步了解需要看文档+多用

1. 好多朋友讲的很对，css 必须要掌握 flex 布局，grid 布局 这俩会了你发现写页面布局很简单2. 但是非常复杂的页面，用这俩写 css 就感觉很啰嗦，很繁琐， 这个时候就可以使用 tailwinds, 可以省去写大量 css 的时间3. 复杂的页面可以想想能不能用 vue 的组件思想，搞些组件复用4. 如果是 ERP 这种项目，那有些页面确实很复杂，也不好组件复用， 就复制粘贴呗，反正大部分都是列表的增删改查，小部分复杂的就让前端同事处理

如果只做 web 端，真心觉得 htmx 很棒。如果要支持多端，还是前后端分离吧，用 react/vue/ng 。

nextjs 加上 tailwind ，大概学一周，就能做挺好的东西了。贴一下自己的水文： svtter.github.io/post/2024-03-12-react-for-old-django/

页面设计是 ui 的活吧，前端也没几个会设计的

管什么前端后端，不都是搞开发，抽时间选一个主流框架学就行了

作为一个后端，觉得前端的难点主要在以下方面：1.布局难搞，没法随心所欲的安放元素位置。2.效果不会实现目前我得解决方法就是，尽量用 ui 库。像 elementui,vant 啥的。没有这些东西，我一个功能都实现不了

可以稍微学习一下,而且后端搞前端基本都是用的现成的 ui 库,自己稍微调整下排版就可以,复杂组件就只能甩给前端了