作為「WEB前端」工程師，你的開發環境是什麼樣的？

01-02

也許可以從 硬體，操作系統，開發工具，開發語言，工作流，版本控制，協作工具等方面 作詳細描述。或者挑一項（方面）專門描繪。參閱：How I Set Up My Development Machine、How I Set Up My Development Machine on Windows、Mac OS X For Web Development......

大家都在曬硬體，那我來晒晒軟體好了~~

1、chrome 的神器hostadmin，非常方便的切換host（ps：mac下還是老老實實去改host吧，這個工具只對chrome生效，windows倒是不錯。還有這個插件會和SwitchySharp等工具衝突，要翻x的時候記得把hostadmin禁用）

2、反向代理 rpoxy，很方便的把host指向127.0.0.1

3、查看json的神器，chrome的插件 jsonView

4、開發工具webstorm

5、然後用了grunt的uglify、copy、ftp-deploy分別依次用作js壓縮、文件拷貝、上傳到測試伺服器（給測試的同學用）

6、還有js的單元測試工具 jasmine 和顯示覆蓋率的 Istanbul

以上~~我繼續去寫測試用例了...Orz---------------------update 2015.9.7--------------------

從grunt切換到gulp一段時間，覺得gulp任務管理起來比較方便，相關的task只需要require過來就好，而且這種編寫task的方式個人比較喜歡，grunt基本被我廢棄了。。

gulp的現在用到的插件如下～

下面有更新

忘了哪裡，我夢想中的環境是這樣的

Update: 在這裡看到的圖 http://www.zhihu.com/question/28204149

我的實際環境是這樣的。馬上會配一台Mac。

拉個仇恨，這些都是免費拿的

都是吃的

老闆有養魚的癖好

硬體的話

這是公司的狀態：

這是在家裡的狀態：

默默表示用兩屏時想有三屏，用三屏時想有四屏，對屏幕有無盡的慾望……

這幾天太忙，先來瀉藥。

硬體，操作系統，開發工具，開發語言，工作流，版本控制，協作工具等方面

我挨個說吧。

硬體：mac air + 雙屏 + 外接鍵盤和觸控板

操作系統：同上第一個系統 / centos [測試機]

開發工具：只有且只會用我自己電腦上的這套vim配置了。。 xiaojue/Vim · GitHub

工作流：代理，腳本工具，項目切換/本地環境/測試機/自動化 Introduction fd-sever

版本控制：svn，git

協作工具：qq，自帶得mail客戶端

最近做gbk編碼的東西有點多 vimrc有點改動不過也就是這個樣子，用好多年了。。

最後的圖：

有一陣子天天改PHP、線上機查日誌、寫腳本跑日誌、hadoop跑日誌、hive跑日誌，簡直沒臉跟人家說我是搞前端的，已經完全忘記作為一個前端的工作環境了因為整天都對著一個黑漆漆的終端。

當然大多數日子我還是在搞JS，或者切圖調那麼幾個像素啥的……

在Mac OSX下設置前端開發環境 - _haochuan的RandomNotes - 知乎專欄

僅供參考

大二—大三：

- - -

放一張大一在宿舍的照片（亂，當時在寫 iOS App，後來又入了一些設備）：

生產力，硬體：

MacBook Air 13"

Dell U2415

Apple k5 keyboard

HHKB Pro 2

調試，硬體：

iPad、iPhone

生產力，編輯器 / IDE：

JetBrains WebStorm

Sublime Text

Mac Vim

Coda

生產力，工具鏈：

MEAN（Mongodb、Express、AngularJS、NodeJS）

Yeoman（Bower、Grunt）

各種常用 npm 包

Adobe Photoshop

調試，工具：

Google Chrome 上的各類插件

網路小工具（Google 字型檔 / Adobe 調色板 / CSS 漸變取色器 / YUI compresser……）

Charles

Browser Stack

Xcode iOS simulator

其他：

VPS

git

偶爾也用 XAMPP 開個本地伺服器，用來調移動設備

做設計時也會用到數位板

目前在外地出差，配置如下

完

硬體：13" retina Macbook Pro，索尼Z2做移動版測試，iOS機器測試用Chrome的調試。

軟體：SublimeText3，Adobe Photoshop CC 2014，騰訊Font-Spider（嚴格意義上也不算軟體吧，不過確實棒，對於我這種根本看不過Windows自帶字體的人）。

乾貨：http://Iconfont.cn，http://Fontawesome.github.io，Google Web Font。

騰訊字蛛：http://font-spider.org

硬體公司台式機 i7 ssd 兩個23的dell顯示器 gtx760顯卡，海盜船8內存。

家用的 i5 ssd 兩個23 dell顯示器，顯卡gtx660顯卡，海盜船8g內存。

軟體就無所謂，什麼好用用什麼，沒有癖好和糾結的。

作為前端，我的開發環境是:

一桌的妹子給我寫代碼，還有一個給我做圖片，我來搭框架，解決bug，確定細節需求。

哇哈哈哈！

全套mac，台式筆記本。

git管理版本，jira管理bug，sublime text編輯器，以谷歌瀏覽器為代表的多種瀏覽器

硬體：公司的一台年老的MAC，原本是4G內存，後來去了兩天嫌太卡，又給加到12G了

開發工具：Webstorm, Sublime Text

版本控制：git

工作流：在本地開發時使用gulp-jshint, gulp-less, gulp-livereload還有公司自用的html模板預處理插件等一眾gulp插件。開發完成一個功能後，push到git伺服器上，然後會自動觸發ci系統上的的build腳本，包括npm包的安裝，背景圖sprite, less, css和js合併，jsuglify，以及靜態資源按文件hash值重命名以及重命名後的引用路徑替換，以及將靜態文件上傳到CDN。當build過程完成後，build腳本會將build完後的代碼自動發布到測試伺服器

協作工具：公司搭建的redmine，遠程溝通主要通過telegram以及微信。。。

請無視渣畫質。。。

神舟優雅，四g內存，顯卡低端，windows64，後來加了一把SSD，秒殺開機啟動，軟體啟動快。爽。喜歡用sublime，瀏覽就用ff。

傻多戴，Windows7X64，sublime text 3

大三狗自爆下…

硬體:聯想筆記本(型號不報了，已經停產了，外接個某寶30的鍵盤。)

操作系統:win8.1和Ubuntu雙系統。

開發工具:webstrom+sublime+eclipse+chrome（模擬手機太好用了。）。eclipse主要為了本地調試項目，搭個伺服器。

開發語言:html+css+JavaScript,偶爾用java Python解決小問題。

版本控制:git,偶爾svn到雲上方便別人看效果。

從業時間不長。

系統環境的話之前有寫 PHP，公司伺服器也都是 LAMP，所以本地 WebServer 一直跑在 Apache 上。偶爾測試時會用 Node 。系統一般就是Mac OS X。公司台式機就 Windows + Ubuntu 雙系統，但用的相對少一點。

Mac下編輯器就用 Vim，不過還很菜，經常到處去提問題。Windows 下 GVim 感覺沒有 MacVim 好用，基本上就是用 Sublime Text 2 。

自動化工具等等基本都靠命令行了。Mac 下 iTerm 2 終端很好用。

硬體方面的話，家裡 MacBook Pro 外接顯示器 DELL U2312HM。

公司 MacBook Pro + Acer i7 普通品牌主機，同樣接 DELL U2312HM。台式機 DVI 輸出，Mac DisplayPort 輸出。顯示器有快捷鍵切換方便。這款顯示器真的是高性價比。

Mac 本本就一台，二手的11年 Pro，上班時隨身帶去公司，很沉。想等手頭富裕了再好好入一台。

感覺這兩年來，設備上給我效率提升最大的莫過於外接顯示器了。

前面的都太壕，我等屌絲一個非mac筆記本滿大街背，同意的贊

大二學生黨一枚，不知道為什麼被邀了。。

設備什麼的，13年暑假買的筆記本，14R Turbo（Ins14TD-1728）。//剛才看了一眼，居然停產了

在實驗室里也有個自己的電腦，配置不算太高。

然後手賤給筆記本換了個SSD，於是實驗室電腦就被我拋棄了。。。。現在筆記本接了實驗室的兩個顯示器、寒假剛買的Cherry鍵盤、別人給的雷蛇滑鼠（求不噴）。

系統什麼的，不知道前端是否需要特別的系統，我一直在用win8.1，當然linux也用不過不是為了前端。

平時一般用Sublime Text 3，Emmet等各種插件基本上也裝全了。瀏覽器用Chrome，當然為了測試兼容性，電腦上也有FF、Opera，有個XP的虛擬機裡面是IE7。有時候做個響應式的頁面，自己沒有設備，於是就各種給同學說，我這裡有個網頁，你上去看看怎麼樣，謝謝啦。。

我這種低端程序猿也就用一下HTML+CSS+JS了，後端寫過PHP，其它方面Ruby、C++什麼的偶爾也寫一寫（C++主要是應付作業）。

實驗室里有個小夥伴，一般接到任務都是我們倆一起做，因為人少所以也不存在什麼通訊不方便的問題，有什麼事情一般靠吼。。。。

最近寫的幾個項目都是放到了Git上，當然自己的網站和某社團的微信是在SAE上的。

一般的前端效果都沒什麼大問題，只是有時候實現方法估計會讓專業的人感覺很奇怪。。感覺我就是屬於用低端技術嘗試實現高端效果的奇葩。。。。

做前端、後端和移動端，做好了，都是很好的方向。只是技術不同，場景不同，應用不同而已。互聯網已經形成了一個巨大的反應場，好的技術，在這個互聯網時代，都會有一席之地。

另外，常常有人抱怨前端的框架太多了，我想這樣的人掌握的編程語言不會超過兩門。由於瀏覽器引擎日益強大，平台趨勢凸現，前端只是在後端走過的路罷了。模塊化，組件化，狀態化，非同步，等等，不要抱怨框架太多，後端的每一門語言都有無數的框架。在一個技術突飛猛進的時候，更多的選擇，往往比更少的選擇要好。在大數據發展的初期，更大的數據量永遠勝於優秀的演算法。無論演算法好壞，更多的數據總是能帶來更好的效果，也是一個道理。所以，投身前端領域的同學，要有不怕困難，熱愛框架，勇於當炮灰的精神和狀態。看薦-黑板報