各位公司的前端开发环境是什么样的？能给点建议吗？

[firhome]

先介绍下我们的：

使用Git，每次新项目 或 变更 拉分支修改和phper配合更改

因为网站架构的原因，我们前端做了一些结构脚本的变更，需要传到一个开发环境才能看到效果。

这样很痛苦。。可以使用一些代理工具 让本地目录和线上目录对应起来，这样也很麻烦。

本地也搭建不了环境，因为模板里有很多东西要调用后端代码输出

所以想问问大家的开发环境是怎样规划的？

[jinwyp]

本地把后端php 环境搭起来啊

[fanTasy]

为什么本地搭建不了环境。。。

[guchengf]

为什么本地搭建不了环境？

[learnshare]

首先，线上调试是错误的，本地必须要有完整的开发环境，甚至必须有类似线上环境的数据库数据。
第二，没有本地不能搭建的环境吧...

[jerray]

应该是本地搭建环境特别麻烦吧？

用过一种前后端分离的模式是后端只提供API接口。前端分两个部分：服务器部分（可以用php，也可以用node）调用后端的API然后把数据传给客户端，客户端部分负责界面显示和交互逻辑。

这样一来前段的服务器部分只要能调用API就可以，搭建环境就变得很简单了。

[angelsoul]

前后端分离还是不错滴，我们现在就是这样

[jsonline]

你不知道 Fiddler 么

[flynngao]

静态……

[jsonline]

如果你们的前后端语言是混在一起，就当我没说。

[allenm]

1， 把 js, css 想办法指向到本地 ( 改 hosts , 使用代理服务器 等方案都可以）
2， 后端环境不好在本地搭建的话，让后端把开发环境搭建在一个开发服务器上，然后本地 IDE 通过插件或者其他方式实现本地的代码和开发服务器同步（自动或者有快捷键），可通过 SCP, FTP 等方案来实现。
3， 如果开发的是移动应用，来试试我写的这个工具 xdns(https://github.com/allenm/xdns) 来实现第一步的目标。

[firhome]

@jinwyp
@fanTasy
@guchengf
@learnshare
@jerray
@angelsoul
@jsonline
@flynngao
@allenm

感谢各位的回复，我是新来公司，暂时还没搞清楚为什么不行。我再详细说一下吧。

我自己尝试着用fiddle指到本地，也尝试过修改hosts等等。。。但是终究还是不方便阿。。。

现在我看到的情况是这样。

我们和后端用同个git分支，新建项目他们会新建个html页面，里面有一些php的调用，如结构，css，js的引用（都是靠php得模块来引用）。

然后我们在这个html上面进行开发。基本上如果要看效果都要上传到开发环境来看。

等我们html结构写好以后，php就会在html代码里加php代码，比如循环输出列表阿，图片阿 内容等等。。。

所以导致我们要看效果必须在开发环境。

我也问过是否能搭建本地环境，他们回答貌似是挺难的。。。

[jsonline]

@firhome 你唯一的出路就是搭建本地环境了。 或者继续蛋疼地上传到服务器再看效果。
难在哪里？

[firhome]

@jsonline 这个等我确定下再跟大家讨论吧。。其实更想知道大家的流程是什么样的

[2688]

chrome /firefox 开发者工具，直接在页面上改js和css ，难道每次都大改？

[ganxiyun]

同意要搭建本地环境

个人一点想法，如果搭建本地环境特别麻烦，而在html中的php代码比较少，可以考虑：
1. 只搭建一个本地php环境
2. 所有有php代码的地方，都写一个mock的，只依赖于php库本身的。类似于写单元测试吧

[hustlzp]

可以尝试让后端使用vagrant+puppet搭建统一开发环境。

[jsonline]

@firhome 我这里的流程是后台只输出 JSON

[chemzqm]

建议就是前端负责路由，渲染，后端只给JSON数据，开发时前端mock数据，就是对前端代码组织要求高了点。

[bsbgong]

数据库操作全部rest，不管你用php还是Java还是其他
后端路由和一般的逻辑，express解决
前段你可以选择使用类似backbone的框架
调试非常方便
团队分为api team，design team，website team

[lenzhang]

看来真的很多人不用Fiddler的。你们一定过得很痛苦吧。

[tonghuashuai]

我们一套线上，一条开发环境，只有线上线下的分离，没有前端和后端的分离

[DeeCheung]

这种情况就应该上 docker

[NemoAlex]

@lenzhang 不在本地搭环境，只用 Fiddler 调静态文件，不能改后端代码，这样的开发者才痛苦吧

[lenzhang]

@NemoAlex 各司其职，分工明确，前端只干前端的事情，轻松许多。如果你可以改后端代码意味着你要多负责一块工作。同时干扰也更多。后端有问题了，要求后端把cgi或者其他接口调好就行了，干嘛自己改呢。

[learnshare]

虽然 REST API + 前端渲染模板的方式很好，但对于已有的项目，这种方式几乎是重写，就不建议了...

按道理说，应该两个人共用一套测试环境（比如独立的测试机/虚拟机），这样比较适合前后端混合的开发方式。

话说 PHP 的开发环境不是很难搞吧，如果后端不愿意帮你搞起来，就自己搞。

[lisposter]

还是辛苦搭一下吧，磨刀不误砍柴功劳，想当年我一个环境搭了一天。。。

[maga]

@lenzhang fiddle除了了看http请求，还能干嘛呢

[icloudnet]

半小时就能搭建个本地环境
譬如：
vmware装个centos or ubuntu 桌面版
修改/etc/hosts
加入
example.com localhost

restart apache2 or httpd

然后在机器里想怎么改就怎么改了

[yun77op]

我们使用的是freemarker模板

改bug或维护任务时，是直接跑起整个环境的，使用maven-tomcat-plugin，都不用打开eclipse了，还蛮方便的。

开发新功能的话，后台都没准备好，没法跑整个环境的，就必须用到模拟服务器工具了，直接写freemarker模板，然后模拟服务器工具可以把模板跟伪数据结合转成html

[yun77op]

@maga 可以重定向http吧

[hustlzp]

@maga

查了下，貌似重定向功能可以用于调试。

http://www.aliued.cn/2010/04/25/use-fiddler-to-improve-efficiency-of-front-development-example.html

[hkongm]

写个watch，文件保存后立即scp到测试环境。

[shiye515]

fis

[VienDave]

@fanTasy 发现射射一枚！

[Aben]

nginx 代理。

[fiture]

@lenzhang Nginx也可以代理。

[fanTasy]

@VienDave 0.0

[lenzhang]

@fiture 是的，不过fiddler功能更加齐全而已。自己根据需要写 fiddler script，可以有效地提高开发效率。