后端程序员想要学习一下前端，有无比较好的学习路线推荐

[hsuyeung]

情况

1. 后端开发（主力 JAVA ，平时也会写写 Go 玩儿）
2. 前端 JS 还行（自己玩玩的程度，工作肯定不够），CSS 老大难！
3. 喜欢看文档学，视频辅助，但是不喜欢一直看视频学习。
4. 学习更倾向项目驱动，有需求让我练手我就能很快上手一门新技术，但是纯学习就比较枯燥。

问题

1. 想要闲暇时学习一门前端框架，不用于工作，只为了自己也能写点页面什么的玩玩儿，算是兴趣爱好。Vue 、React 、Angular 纠结选择哪一个作为刚开始学习的框架以及该语言的学习路线。
2. 除了语言框架，有无一些比较好的 CSS 样式的框架推荐
3. 有没有什么比较好的练手的项目推荐（个人目前想法是，自己挺喜欢阮一峰博客那个样式，看起来也不是特别复杂，就准备决定了语言和框架后做仿一套练练手，不知是否合适）

[sinnosong1]

@j4talias https://chinese.freecodecamp.org/learn ，把前端相关的撸完就差不多了。我也是后端目前已经在写前端部分的了。

[AilF]

🐴一个

[dcsuibian]

后端程序员，我的路线是：
阮一峰 ES5 、ES6 。Vue 全家桶视频。Node.js 。Webpack 。《精通 CSS 》。Ant Design Pro Vue 。React 。。。

[yangzzzzzz]

前端入门基础百度 “表严肃” ，实战时 vue 和 react 都行，vue 的话推荐直接学 vue3 吧

[zhaol]

别理楼上生态的，以你的需求，vue 和 react 都足够了。vue 反倒是全家桶比较简单，可以直接撸代码。react 还要学其他的概念，后端的话推荐 vue ，简单粗暴，容易理解

[mxT52CRuqR6o5]

熟悉 spring 的话可以去看看 angular ，不熟悉 spring 就去学 react/vue

[murmur]

什么叫生态，vue 不能干活么，前端的脸面是 css ，css 是要自己画出来的

你需要 rn ，那叫生态，大的组件都是纯 js 的，不存在 react 能干 vue 就干不了

[sy20030260]

我自己是 React ，因为油管上 React 的优质教程比 Vue 多一些，但其实入门的话资源都不少，区别不大。CSS 的话蛮推荐简单了解下之后直接上 Tailwind CSS 的，既可以避开一些新手不友好的 CSS 技术细节，但又不至于像 ant 这类组件库一样完全屏蔽了 CSS ，达不到学习目的

[Dragonphy]

Vue ，里面提到的学一下 https://www.v2ex.com/t/831969

[murmur]

@sy20030260 tailwindcss 是看上去美好用起来坑，你还要自己组合各种东西

btn-warning 、btn-success 和 btn color-green height-30 fontsize-14 哪个更友好，很明显前者语义性更强

既然学不会 css 就慢慢学，用组件自带的主题不一定好看，但是也不会太丑

[zhwithsweet]

你看看这楼上的，哪个不是前端高手，哪个不是行业专家？你一个后端学得过他们？学个锤子，不学了

[sy20030260]

@murmur 问题不是组件库好不好看，而是用 ant 这类组件库基本就屏蔽了 css 达不到学习目的。用 Tailwind 也可以直接抄别人写好的 UI ，不需要自己组合，而且根据 className 直接就可以知道对应的 native css 是怎样的，后面转 css 就容易多了。反正我自己用 ant 这类组件库是没搞懂 css ，而用 Tailwind 写了两三个小项目基本就知道 css 该咋写了。Tailwind 语义性确实是个问题，但更多影响的大项目的可维护性，对于新手学习来说没有太大影响

[vsitebon]

react 走一遍初始教程，然后就直接上手项目，项目中学习会快很多

[dfkjgklfdjg]

React 和 Vue 还是 NG 的抉择

如果有 Java 和 JS 的基础，你可以学 React 并没有那么麻烦，很快就可以理解上手。
如果想要所有的问题都有一个明确解的可以选择 Vue ，只需要记住一些 API 和语法糖即可。
NG 真的不怎么推荐，国内应用太少了解决问题老大难，没有多少人可以和你聊起来。

生态的问题其实很虚，React 是很活跃，但不是所有人都想要从脚手架到状态管理都要自己搞定或者去一个一个辨别是否好用。
Vue 看起来没有那么活跃，但是都给出了一个工具给你用，大部分的人都在维护那么几个官方库，并不用自己去找很多基础的东西，心智负担会很少，可以没有顾虑的使用，只是有些地方确实有点黑盒。

-----

CSS 的问题其实不是靠学，而是靠积累，多自己纯手撸一些 CodePen 上好看的样式持续一段时间就清楚了，
然后就是组合 css 所需要的脑洞了。

[libook]

看 MDN ，即便很多东西你都知道了，有些边边角角的你不知道的信息可能对你解决问题有很大帮助，建议认真看一看。
教程部分： https://developer.mozilla.org/zh-CN/docs/Web/Tutorials
Reference 部分：
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference
https://developer.mozilla.org/zh-CN/docs/Web/HTML/Reference
https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference

都看完之后，MDN 上其他主题可以按需来看。

框架可以随便挑一个看，因为很多东西都是相通的，求快就看 Vue ，中文文档写得很好。

CSS 样式框架有两种，一种是跟前端框架绑定在一起的如 Element 、Ant Design ；还有一种是无框架依赖的，可以看看 Bulma ，主要用的是 flex 布局。

[liuw666]

学 vue 概念的时间，react 都写完了

[kidonng]

前端框架推荐 Alpine.js ，可以说是“设计给后端”的框架，几乎无学习负担
CSS 框架自然是 Bootstrap 默秒全🐶

[Terry05]

不要吵了，不要吵了，学 Solid.js

[10bkill1p]

看到上面这么多人推框架，就没有人推荐 Vanilla JS 吗（狗头）

[murmur]

@liuw666 vue 的概念就是模板引擎，这玩意是个后端程序员都应该接触过，

if->v-if
for->v-for

这就是编程语言

还需要学的

到底是 v-if 好学，还是 useEffect 好学