為前端而戰-搭建統一開發環境

　　除了nodejs之外，後端技術（php/java等）及環境搭建一直都是大多數web前端開發人員的弱項，而且每當公司里進來一個新的前端開發人員，第一件事情要做的就是搭建開發環境，需要在新的電腦上安裝IDE、nodejs、npm以及團隊裡面需要用到的技術所需要的依賴，一般需要花費一兩天時間；另外，如果團隊里的後端技術不是nodejs，以php為例，做需求時難免要跑php來驗證自己的功能，又或者有涉及php代碼改動的話，就要想辦法聯調；而這樣的話就需要在自己本地搭建一個php環境給自己用，而我剛纔說了，這是前端開發人員的弱項，更何況有時候有些需求是後端要做系統變更的，那也得在自己的電腦上重新配置；為了不這麼麻煩，我們用到了虛擬機、vargrant或者docker，專業的人做專業的事情，環境變更了，就由後端開發人員重新build個鏡像給到前端覆蓋舊版使用。

　　但是有沒有更加快速方便的辦法，因為我不僅想減少新員工的成本、還想在我更換一臺電腦的時候，也能快速進入開發（如果不能遠程桌面的話）；於是我搭了一個統一開發環境，讓所有web前端開發人員（甚至是後端開發人員也可以用）共同使用一套開發環境，但各自的代碼可以互相隔離，於是我使用了一臺雲主機（當然是要用公司的，這樣才安全哈〜），如果你（們）的團隊也適用這樣的場景，也許可以參考一下

　　OK，題外話就不再扯了，這裡介紹一個統一開發環境的設計思路，我們看圖說話，先看設計圖：

　　接下來對著設計圖從上往下一步步來講：

　　1、每個前端開發者（開發者A、B、C等）手上就是一臺電腦，在開發以及調試的時候都需要在瀏覽器輸入自己的地址來跑起自己的項目以及驗證；

　　2、在跑起來之前，先在瀏覽器設置好一個cookie作為識別碼，例如我使用的是developer=coffee.huang，因為在瀏覽器在打開頁面時實際上所有的網路請求（包括當前頁面）都會帶上本域的cookie到服務端，而服務端就是我上面說到的雲主機，作為一個搭建統一開發環境的平臺；

　　3、所有的請求去到了雲主機，於是其實我已經在雲主機上搭建好了所有伺服器環境，包括：php\nginx\mysql\git以及nodejs和npm(因為這樣的話，我其實可以直接在雲主機上進行前端代碼的打包了)等；

　　4、所有到雲主機的請求首先抵到nginx，這時候nginx已經配置好了轉發器，根據cookie：developer=coffee.huang來轉發，把需要運行的php代碼轉發為coffee.huang的開發目錄；

　　於是，根據以上的設計，如果有新員工來，只需要給在雲主機上給新員工創建一個登錄的帳號以及開發目錄，然後新員工在雲主機自己的目錄里，通過git命令把代碼拉下來，就可以進入開發了，當然也需要在自己的本地的電腦上裝一下sublime等IDE軟體、可以加個sftp插件，每次改代碼就可以自動上傳到雲主機對應自己的目錄中進行開發（重點說明：其實也可以不用sftp，我後來也在雲主機上安裝好了samba將雲主機上的開發者目錄共用給開發者，開發者就可以在自己電腦上新建一個目錄映射到雲主機，例如windows可以在“我的電腦”界面，直接使用“創建網路位置的功能”，就可以做到直接編緝雲主機上的代碼了）；

　　另外，這樣還有一個好處就是無論線上的php環境做了任何變更，只要把變更配置同步回這一臺雲主機，那麼所有人都相當於是自動使用了同一個跟線上環境一致的環境、節省大家的配置成本；而最重要的是，根據cookie來轉發，可以隔離各自的php的代碼，互不幹擾，因為雖然前端開發人員大多數時候不需要改動php代碼，但有大家同時進行不同的需求的時候，需要拉取來自不同git分支的php代碼。

　　最後總結一下：

　　1、統一開發環境是為了讓前端開發人員可以輕裝上陣，只專註前端開發；

　　2、因為共用環境、所以只需要一次變更便可以讓所有人都用到了最新的環境配置；

　　3、代碼隔離，開發人員使用各自的代碼共用同一套開發環境，並行開發而互不影響（事實上我在實際中把前端的自動化工具也裝到了雲主機上，所以無論前端代碼、後端代碼還有代碼提交等所有工作都可以直接在同一臺雲主機上進行而互不影響）

　　最最後，值得註意的是：

　　首先你（們）團隊需要有一臺雲主機（或者如果是一臺物理機就更好了）；另外，統一開發環境要夠穩定或者做環境的備份及替換，就是說不能雲主機一旦掛了，就所有開發都立刻傻眼了，都得等著環境修複好才能繼續工作。

　　最最最後，一句題外話：

　　個人覺得，web前端工程師想成長得更好，到了一定階段後，就該把“web前端”去掉，往後端還有其他方面去橫向發展，能為自己和團隊創造得更多（這隻是我作為6年的web前端開發人員的經驗之談而已哈〜）。