现在标准的前端项目都是怎么样的

42 条回复 • 2018-10-16 23:31:32 +08:00

1

cuzfinal

2018-10-15 11:35:24 +08:00

可以在慕课网上看看一些前端项目的视频，那上面有这些流程。

2

weixiangzhe

2018-10-15 11:37:17 +08:00

没有标准，太过灵活，

3

suzic

2018-10-15 11:38:12 +08:00 via Android

如果是一两个简单的展示型活动页，直接裸写代码。如果交互多或者单页应用，就上这一套工具

4

learnshare

2018-10-15 11:39:06 +08:00

没有标准，jQuery + gulp 一样可以用

5

o0

2018-10-15 11:40:43 +08:00

css
images
js
index.html
.....

完了，我是一只菜鸡

6

cexy

2018-10-15 11:41:35 +08:00

真正搞清楚啥是前端再说吧，前端到底该学啥，顺便提一点，现在大型电商的前端，基本都是 node 写的

7

ZxBing0066

2018-10-15 11:43:31 +08:00

这种事情哪来的标准之说，当然是看项目而定

8

Cbdy

2018-10-15 11:43:38 +08:00

符合 HTML 标准，代码比较清晰可维护就可以了

9

nekoneko

2018-10-15 12:54:19 +08:00

现在不都是框架+UI 吗。。。。

10

Lawlieti

2018-10-15 15:23:12 +08:00

没有绝对的标准

11

yiFire

2018-10-15 15:46:08 +08:00

@cexy 胸 dei 你这句话是认真的吗。

12

whypool

2018-10-15 15:52:09 +08:00

1

JQ 一把梭

13

vinsony

2018-10-15 15:55:29 +08:00

我偏要 npm start ：）

14

murmur

2018-10-15 15:56:03 +08:00

jQuery 一把梭要什么 webpack

15

mauve

2018-10-15 16:00:15 +08:00

Angular 一把梭

16

lingo

2018-10-15 17:34:07 +08:00

扩充一下 2#的回复。确实没啥标准
从 jquery 一把梭到 webpack，包括中间的几个阶段
每个阶段都有各自在当时情况下要解决的问题
这时候就要考虑自己的项目有怎样的问题
一味地上大而全的范式，徒增复杂性

似乎都是废话了。

17

TomatoYuyuko

2018-10-15 17:35:53 +08:00

Jquery 一把梭就行了，不是大项目玩啥工程化

18

rookiebulls

2018-10-15 17:36:57 +08:00 via iPhone

@cexy 你指的是通过 node 搭建的各种工具和流程吧？

19

zhennann

2018-10-15 17:59:17 +08:00

建议先拿一套 JS 全栈框架粗略看看，里面包含大量的技术点，有利于厘清学习的方向，如 CabloyJS、mk-js、MEAN 等等

20

zhennann

2018-10-15 18:02:30 +08:00

如果一开始不考虑工程化，到后面随着功能增多，代码就会越来越复杂

21

cexy

2018-10-15 18:22:25 +08:00

@rookiebulls 然而并不是，你说的只是一些辅助功能而已，很多做前端的人，都并不知道前端应该学什么，前端需要做什么，你们上面提这么多意见，也就只是省点力气搬砖而已

22

charexcalibur

2018-10-15 18:23:59 +08:00

vue-cli 一把梭

23

zhuangzhuang1988

2018-10-15 18:26:21 +08:00

angularjs 一把梭

24

zhuangzhuang1988

2018-10-15 18:58:42 +08:00

一个 angularjs 文件 = requestjs + jquery + vue + axios + promise + vue-router

25

webdisk

2018-10-15 19:37:43 +08:00

@murmur 看我做的东西 /t/497773 jQuery 都不用, 前后端加服务器一共 80KB

26

zjsxwc

2018-10-15 20:23:50 +08:00 via Android

聊一下 jQuery。

jQuery 的爽点是操纵 dom 非常直接方便，比浏览器提供的 api 爽多了。

jQuery 不爽的地方在于.click() .on()事件的滥用，导致维护起来就找不到到底是哪个用户行为事件出发了函数，于是很久以前我就学当时亚马逊的做法，要监听处理点击事件等绝不用 jQuery 的.on()，而是通过 html 原生的 onclick=<显式的回调函数名>来处理。

mvvm 框架的优势在于能够通过数据绑定，把对界面的操作抽象成为对一般数据结构的处理，从而应对逻辑复杂的页面，这个角度上来说，其实这个 jQuery 也能做，因为从数据结构映射到 dom 界面用 jQuery 很简单，这个无非就是写个渲染函数进行 html 拼接而已；但从 dom 变动映射回数据结构就要手动写很多回调函数更新数据，每次更新完数据后重新调用之前的渲染函数一下，这种做法 jQuery 可以处理逻辑复杂的页面。

当然实际情况是不专业的前端工程师，根本没有数据结构概念，在处理 dom 变动映射回数据结构时，直接操作 dom 就完事了，这种应对小需求可以，稍微需求复杂点就凉了。

27

theohateonion

2018-10-15 20:32:46 +08:00

工程化的前端一般都绕不过 webpack / babel / sass(less)+postcss 预处理器了，即使是写 jQuery 代码，也强烈建议用上 es6，开发体验会好很多。另外 TypeScript 大法好，引入成本也不高。

28

zjsxwc

2018-10-15 20:38:43 +08:00 via Android

还有 jQuery 自带的 ajax、deferred promise 等足够应对大部分需求，当然要工程化代码复用那么在当时只能用类似 requirejs 的东西，当然在当时为了工程化代码复用出现了些思路清奇的人，他们用 c 语言的 makefile 来合并需要的 js 给相应的页面，每个 url 地址配个 makefile 文件也是贼 6 的，23333

29

realkenshinji

2018-10-15 20:41:17 +08:00 via iPhone

@cexy node 和前端框架的区别搞清楚了么？

30

realkenshinji

2018-10-15 20:42:46 +08:00 via iPhone

@zjsxwc 现在主流浏览器的新的 API 把 jq 的那些 dom 操作功能都包进去了

31

zjsxwc

2018-10-15 20:45:40 +08:00 via Android

@realkenshinji 应该加上关键词是最新的主流，很多人肯定不是最新的主流浏览器，要兼容性考虑

32

jsthon

2018-10-15 20:54:54 +08:00

右键->新建文本文档->重命名->开工！

（开个玩笑！）

33

zjsxwc

2018-10-15 21:11:47 +08:00 via Android

最后作为一个写后端的，站在我的角度，

前端求你别用 jQuery 了，给我老实去用 3 大前端框架，前后端分离！别把锅甩给后端来背！以前老是碰到加班排查半天发现是傻逼前端的锅，现在前后端分离了，同样的接口安卓和苹果手机 app 接口没问题，那么肯定是前端的锅！

也别用你们写的垃圾前端来污染后端项目！ git 分支合并冲突你们自己去解决好了，别扯上我！

34

KuroNekoFan

2018-10-15 21:13:52 +08:00 via iPhone

没什么大项目小项目的，github 找个 boilerplate 写起来就行，甚至现在优化好配置好的配置子集也挺多的比如 umijs 这种，只需要遵循一些约定就可以以优化的配置和最新的语法开始开发了

35

valentin508

2018-10-15 21:44:31 +08:00 via Android

CREATE-REACT-APP ！ EJECT ！然后自己看去

36

x86

2018-10-15 21:46:36 +08:00

别问，问就是 Jquery 一把梭.png

37

linshuang

2018-10-16 09:37:42 +08:00

不存在什么标准，说一下我脑中的基于 vue 全家桶的一条路子：
1. 脚手架: vue-cli
2. 框架: vue+vuex+vue-router
3. 构建: webpack
4. 本地服务器: webpack 自带的
5. es 兼容: babel
6. css 预编译: scss
7. 模块化: vue 组件

38

aptx4689

2018-10-16 12:12:21 +08:00

收藏的一个很好的解释文章： https://zhuanlan.zhihu.com/p/38209210

39

cexy

2018-10-16 14:14:08 +08:00

@realkenshinji 我是主做后台的，所以或许比你更清楚一点 node 是做什么的，了解下 express,koa 再说，当然了你们说这么多页没人聊过 MDN，你们做前端的就仅仅只是为了写个静态页面而已？

40

realkenshinji

2018-10-16 17:28:10 +08:00 via iPhone

@cexy express 难道不是 http server ？如果你说现在前端框架都用 npm/yarn 之类的做包管理那没问题，但是你说 node 开发前端那是从根本上会产生歧义的，ok ？ vue/react/angular 跟 node 完全是两码事，ok ？

41

cexy

2018-10-16 20:27:00 +08:00

@realkenshinji 说了那么多，你还是在给我扯那些简单的，框架，包管理，需要学几天？你看我有提过这些东西？等你做过几年到了那个深度能理解了在谈吧

42

realkenshinji

2018-10-16 23:31:32 +08:00 via iPhone

@cexy 言而无物，这个 13 装得我给 5 分