求教该怎么学前端

[AslanFong]

现在大四在做课程设计，前后端都是自己一个人完成。感觉写后端，逻辑比较清晰，但是写前端的话完全就是从文档 copy，拼一拼改一改，有的时候一些小的问题都要找很久。完全没有一个思路。 自己之前有过写前端的尝试，上半年写了小程序的 wxss 写了几个信息，js 就是简单的跳转，请求。暑假实习写的 react，也是跟着师兄的大项目下写的一个页面，功能不算复杂。都磕磕碰碰完成了。 现在感觉，写后端因为之前学过数据结构、算法、OS、面向对象，都有一点思维或者说思想引导着编程。但是前端我真的不知道该怎么写，框架的话用起来都有点不同。我也么有系统学习 js，然后写 react es6 就是 Google 或者抄文档抄博客。现在课设业务逻辑有的蛮复杂的，遇到一些 es6、npm 或者是框架上的一些问题,真的弄半天，也没有头绪。 不知道大家有没有什么建议，从哪里开始系统的学？

[johnniang]

买本书，好好啃

[ChefIsAwesome]

看《 JavaScript 高级程序设计》。不用框架，不用工具来写前端。
框架，工具都是为了解决问题存在的，你都不知道他们解决的是什么问题，你怎么可能玩得转呢？

[AslanFong]

@ChefIsAwesome 好的，谢谢。用框架主要是工作的时候就直接上了，现在自己玩的时候就想再深入一点，自己研究研究。但是发现有点难。
我还是好好重头好好学 JS 吧😐

[Justin13]

后端写的溜可以直接上 ts 啊。

[lirau]

列出你每一个阶段感觉困难的问题。定时 review，发现自己的成长。

[shengchao]

《 JavaScript 高级程序设计》 这本不错

[AslanFong]

感谢各位，准备重头好好学 JS。夹生饭真的不能吃。大家有什么推荐的课程嘛？

[bucky]

其实我觉得你的问题并不是 js 的问题，虽然 js 确实有些地方比较奇葩，但是编程语言大同小异，对于日常开发，js 里面也没什么需要深入了解的，你缺的是 UI 开发的思路流程，你应该去了解一下传统的 js UI 开发的流程是什么样的，现在组件化开发的流程是什么的，这两个就可以了，语法上的细枝末节其实没那么重要

[AslanFong]

@bucky 确实是没有一种思想来支撑着，就是没有头绪的做。要实现东西就是到网上找组件拼凑，出现问题了，就没有目的的去找。。

[murmur]

可以先考虑从 bootstrap 这种简单的框架学起
react 最多是帮你简化开发不能帮你简化思路
为什么要这么做 你要做什么 这些还是要你自己来想
你现在需要训练的是拆解问题的能力 css js 都可以后面补 不会 ts 不会 react 就纯 jquery 都能干活
磕磕绊绊不行 你要做到能拿到一个需求自己拆解成功能点 能理出哪里用什么实现才行

[bonfy]

@murmur 说的很中肯了

别求系统，先理思路吧，基础打好，这个系统不系统的每天都在变

[jswh]

不管是什么类型的前端，web 也好、客户端也好，学习的时候一定要搞明白的是三个问题：
1.如何布局、添加样式
2.逻辑层与 ui 层如何交互，或者说如何用代码操控 ui 组件
3.如何处理用户的交互动作

这三个是依次递进的，而且即使是同一环境下不同的框架的做法也不一样，比如裸的 js 对于 2 就是 dom api，而 vue 则是数据绑定。

知道了这三个东西之后，面对你想要的界面才能有基本的思路，知道怎么进行实现。单纯的学习语言，学习框架，而不从这三个方面去理解，学完了也不会用。现在的前端教程为什么通常都要用实例实现来教学，因为实现的过程就是做的这三个事情，如果学习的不单是模仿，在模仿的时候总结这三个方面的问题，会事半功倍。理解了这三方面的工作原理，剩下的就是熟悉 API、熟悉样式等等记忆性的工作。

个人浅见。

[AslanFong]

谢谢各位！看了大家给的建议确实找到自己一些地方的不足，确实做东西的时候比较糊里糊涂，对于需求也不能很好地拆解，总是想一不做一步，有的时候越写越复杂。
准备先看看视频，然后结合手上的项目慢慢实践吧

[jy02534655]

如果你的前端应用属于单页应用，在此基础上有几点建议。
1.搞明白视图切换是怎么实现的，这个是单页应用的基础。最好是通过路由来处理。
2.现在大部分前端框架都是数据驱动视图，在实际应用中尽量去操作数据而不是 dom。如果自己写扩展，实现功能也要遵循这个原则
3.针对自己的常用框架封装一些常用场景，比如数据的增删改查这种场景。
4.遵循 mvc 或者 mvvm 架构，把后端的思想用在前端上面。
5.了解 sass，less

[AslanFong]

@jy02534655 昨天看了很长时 route，网上的资源有 3 有 4。感觉自己的学习方法不对，总是看了这个又想看另一个，最后都学不会

[AslanFong]

目前 route 学会了，一点点学习吧

[chanjianluoyuan]

现在前端的主要难点在 ES6 和 webpack 上，ES6 的学习我是通过 vuex 的案例学习 vuex 的时候顺便学习了 ES6 ； webpack 的官网教程就很详细，跟着把代码都撸了。这些还都需要 node.js 的一些知识，node.js 虽然直接用不到但是前端间接都是基于 node.js 的，node.js 还是很重要。
至于 js 和前端框架（ vue，react 等），一个算是简单版的 java，一个就是复杂点的前台模版，难点并不在这里。
以上是我自己的一些理解，希望对 lz 有帮助

[AslanFong]

@chanjianluoyuan 谢谢！我会慢慢学的。因为在实际做项目的时候，发现有很多技术，一下子学不过来。总是零散的学一点，不系统，所以比较困惑