『壹』 一個後端人員學前端技術的日記（一）開發環境
網上了解了好一陣，好傢伙，前端技術完全自成體系，跟後端一樣復雜了，什麼路由，什麼MVC，什麼編譯打包，什麼依賴下載，各種後端用詞在前端也都適用了，哎，太難了。
一、學習渠道
1. 中文官網： https://cn.vuejs.org/
開發工具使用火狐，因為谷歌用不了擴展，當然你可能會有辦法的。
用火狐瀏覽器打開： https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/
2. 官方文檔 ： https://v3.cn.vuejs.org/guide/introction.html
二、環境安裝
首先要注意的是，涉及使用cmd命令行執行的，如npm命令等，最好用管理員許可權打開cmd，否則說不準後面會出現莫名其妙的錯誤。
1. 安裝nodejs，這個是可以運行js代碼的服務端環境，方便本地運行或熱部署，這個nodejs包含了npm組件（依賴包管理工具，支持下載、運行、編譯、打包等等）
下載地址： https://nodejs.org/zh-cn/
我本地安裝的版本是 node-v10.16.3-win-x64，一般安裝在 D:Program Files。
2. 安裝cnpm組件，為了下載安裝包和依賴包更快一點，最好用先安裝國內鏡像支持，這個組件包含了包含npm大部分功能。
3. 安裝Vue/CLI組件，你可以直接使用npm安裝，或者安裝Vue的CLI，就是腳手架工具，裡麵包含了Vue本身，建議直接安裝這個，省的麻煩。
官網建議Vue3的使用Vue CLI v4.5+，如果版本有問題或升級版本，可以直接去這里刪除，全局的庫目錄在 D:Program Files ode-v10.16.3-win-x64 ode_moles。
4. 創建項目。先命令行轉到你要放置項目的目錄，執行以下命令。
然後窗口會讓你選擇是Vue2版本還是Vue3版本的，它還包含默認安裝(babel, eslint），我當然選擇最新的Vue3安裝。
windows下安裝注意別用powershell或者git-bash，直接用cmd命令行就好。
結尾出現以下提示，說明你安裝成功了。
知識記錄1：如果你出現以下問題：
原因是：執行npm命令時沒有管理員許可權， 用管理員許可權打開cmd， 然後再執行npm相關命令即可。
知識記錄2：如果你有Vue2，想升級Vue3的最新版本，可操作如下：
5. 額外介紹下，你不一定使用vue腳手架創建vue項目，你還可以使用vite組件創建項目。
官網： https://github.com/vitejs/vite
注意：vite當前只支持vue3.x
名詞注釋：
腳手架：就是標準的、常見的一種項目目錄安排規范。
babel: js的編譯器，用了它你就可以像後端開發語言一樣對源碼進行編譯打包了。
eslint：一種js的代碼檢測工具。
『貳』 WEB 前端開發環境怎麼樣
逐字逐句的解釋——WEB：web在不同的環境下有不同的解釋，其中web前端開發之中的web是指在 Intenet 上和 HTML 相關的部分。通俗來講，即用網頁瀏覽器瀏覽的網頁。WEB前端開發：這是從網頁製作演變而來的，劃分了兩個很明顯的時代特徵。早前的網頁製作主要都是靜態的以瀏覽為主，製作起來也相對於web前端開發簡單，後期發展中，但是靜態單一的文字圖片已經不滿足人們的胃口了，於是web前端開發應運而生。網頁上軟體化的交互，XHTML+CSS布局、DHTML和Ajax都是涵蓋在web前端開發中的，所需學習的也比原先的網頁UI製作要多得多了。主要有HTML、CSS和JavaScript，最好還要掌握Flash/Flex、Silverlight、XML和伺服器端語言。但是web前端開發所學的知識點並不固定，因為這是一門非常新的職業，對一些規范和最佳實踐的研究都處於探索階段。總有新的靈感和技術不時閃現出來，例如CSS sprite、負邊距布局、柵格布局等；各種JavaScript框架層出不窮，為整個前端開發領域注入了巨大的活力；瀏覽器大戰也越來越白熱化，跨瀏覽器兼容方案依然是五花八門。為了滿足「高可維護性」的需要，需要更深入、更系統地去掌握前端知識，這樣才可能創建一個好的前端架構，保證代碼的質量。WEB前端開發工程師web前端開發工程師既要與上游的交互設計師、視覺設計師和產品經理溝通，又要與下游的伺服器端工程師溝通，在這個過程中要掌握的技能非常多，因為既然能和中下游進行溝通，雖說不至於要精通他們所做的工作，但是也要了解他們手上的事物才能溝通得起來。前端開發工程師的入門門檻其實非常低，與伺服器端語言先慢後快的學習曲線相比，前端開發的學習曲線是先快後慢。所以，對於從事IT工作的人來說，前端開發工程師是個不錯的切入點。也正因為如此，前端開發領域有很多自學成「才」的同行，但大多數人都停留在會用的階段，因為後面的學習曲線越來越陡峭，每前進一步都很難。
『叄』 使用ANTD前端開發——開發環境搭建（Windows）
使用ANTD（ant design）開發需要安裝Node.JS，cnpm，tyarn，umi等包。yarn是npm的替代品，正如tyarn取代cnpm。在未來的項目中我們會使用tyarn進行JS的包管理。
Node.JS安裝成功後，在安裝路徑下有 npm 命令腳本。npm是Node.JS的包管理器，可以使用npm命令安裝各種所需的包。但由於npm包的默認安裝源在國外，速度慢，因此需將安裝源映射在國內。需要安裝cnpm和tyarn。
『肆』 解釋一下 .net 、VS、VC 和vb.net的開發環境...謝謝！
1. .net是微軟的語言架構，是面向對象的託管語言；VS是Visual Studio的縮寫，是微軟的集成開發環境，通過它可以設計，開發和調試微軟平台的程序，其中包括.net，也包括不是.net的程序；VC是Visual C的縮寫，是微軟版本的C語言，用來開發桌面應用，不能做網站；VB.NET是.net中的一種語言，和原來的VB完全不同，可以用來開發桌面和網站，VB.net的開發環境是VS.net（目前最高版本是vs2008）。
2. 做網站的話，需要安裝VS（建議VS2008，因為更加強大），如果用SQL Server的話需要安裝SQL Server（建議SQL2008，因為性能更好）。
3. VS2005和VS2008大小差不多，完全安裝4G左右，最小安裝1G左右
4. 如果使用資料庫建議用2008因為2000馬上就要停止技術支持了。
『伍』 如何打造一個令人愉悅的前端開發環境
以環境作為切入點，開始一系列的前端開發環境配置文章。
主要會涉及到打包、構建、編程工具、debug等等前端環境，以及前後端分離、Nodejs中間層使用伸展面。
工欲善其事必先利其器
以編程工具而言WebStorm、sublime、Atom、VS Code、Brackets等等一大推，這方面我個人是覺得無所謂，蘿卜青菜各有所愛，優缺點基本很明顯，就看個人的接受情況了，舉點例子說下吧：
WebStorm 很全面，無論是純前端還是Nodejs，包括git、svn、命令行、格式化工具都有，使用順手之後各種方便，而且還直接支持nodejs的debug，作為前端的全能重量級IDE非常不錯，唯一不好的就是太重，體現在內存佔有，啟動時間上。
sublime 輕量級文本編輯器，3比較2來說有很大提升，小巧靈活是最大的特點，麻煩的是各種插件的配置，需要自己來組合，不熟悉的人用起來遠遠不想WebStorm方便，快捷。而且每次新的電腦都要配置一次，比較繁瑣。(現在有可以導出配置文件來適用新電腦的方法)
Atom類似sublime，比較輕量級，內核主要是Nodejs寫出來的，前端各種愛，因為比較適合前端的技術棧，但是大文件的性能問題一直受人詬病，不是很流暢，還有就是插件比起sublime來說還是少了不少，整個生態不如sublime，但是因為是github出的，還是受人青睞不少。我貢獻的一個vue格式化插件
VS Code 和 Brackets這兩個比較小眾，使用的很少，我用過VS，感覺還挺不錯，就是生態更差，而且很多插件的說明寫的很糟糕，讓人看不懂。各方面的資料也比較少。Brackets 一個同事使用過，提示比較好，個人感覺入門很不錯。貌似還能及時瀏覽web效果。
個人建議使用入門的時候使用sublime或者Atom就可以，配置一下自己喜歡的插件，基本就可以開始幹活了，當然如果是用eclipse已經很習慣的人，我覺得WebStorm這種重型機槍，可能更適合你。不要對工具的提示產生依賴太過於嚴重，否則很多東西自己會慢慢遺忘的哦!!!
PS：如果要提升自己的逼格怎麼辦?請使用VIM或者Emacs這種高逼格的編輯方法。
木牛流馬
糧草生產的快，也要有好的運輸工具才能上到前線，對於前端而言，屬於我們的運輸工具是打包構建工具。
打包構建工具經歷了各種不同的時代，從服務端主宰的打包構建，到現在前端自己主宰的構建工具，不同的需求產生了各種不同的構建工具，這些工具其實也算前端的工作能力之一，因為每一種新的工具都有優缺點，熟悉的使用也並非特別簡單的事情。
先來說說都有哪些不同的種類吧：
後端為主要的整體打包工具，這個以FIS作為代表，大家或多或少都應該知道網路出的這個開源打包構建工具鏈，從整體上解決了前端工程的問題，包括優化、資源載入、模塊打包、自動化、部署一系列問題，從功能上看非常全面，FIS3的升級讓人也感覺很是不錯，不再依賴PHP和java之類的服務端語言，基於Nodejs來做，更加貼近前端社區。那麼缺點是什麼呢： 生態環境不夠豐富，主要插件應該還是網路自己人提供的，參與進來的社區人數不夠多。我覺得這方面的原因是fis2當時對PHP和JAVA的依賴，導致大家對fis的興趣不弄，錯過了最佳時機，這個其實跟網路自己的web的技術棧有很大關系。同時帶來的好處是，FIS可以結合PHP做整體網站的部署和構建。以上主要是看文檔的一些分析，本人並沒有用過FIS，有說錯請拍磚。這類的打包構建工具還有很多，大部分都是大公司的內部使用，例如京東、馬蜂窩之類，都是PHP為主，加上前端的整體構建工具。
Grunt派系，這個應該是比較早的Nodejs打包構建工具，一度很是流行，Grunt的好處是提供了一個核心的構建規范，基於文件，來使用各種Grunt的插件組合整個構建行為，當時我記得比較清楚的是我前面文章提到過的Yeoman這個構建工具，核心就是Grunt，自動生成了各種插件配置。但是這個有很大的缺點：一是構建的配置文件寫的很長很啰嗦，二是效率不是很高，原因是它構建的方式基於文件的，每次都會產生新的臨時文件，這樣無形中就會有磁碟的I/O讀寫，所以會降低整體的構建速度。
Gulp新體系，因為以上的Grunt的缺點，Gulp應運而生，借鑒了Unix的管道概念，用Nodejs的stream特性，來組織整個構建鏈條，在官方的核心只提供幾個方法，大家基於官方API來編寫自己需要的處理插件，再組合起來，完成構建功能。和Grunt的基本理念很像，但是很多又有區分，例如：配置和運行分離，插件單一職責，規定大於配置等等。關於這兩個的比較有很多，大家可以搜搜Grunt Gulp 就知道了。不多說
新的王者Webpack，個人感覺應該是15年上半年到16年初，Webpack橫空出世，大有一舉統一整個前端構建生態的趨勢，貌似現在FE們不會點Webpack相關的，都不好意思說自己是前端了。最初Webpack應該只是和requirejs、browserify之類模塊化工具比對，但是其靈活的API和豐富的loader，致使它可以連帶完成Gulp之類的構建事件，目前其生態環境巨好，各種插件層出不窮，比較火的React，vuejs等都有相關的針對性loader來優化構建方式，可以說是目前最流行的工具。不過缺點也特別的明顯，就是難懂，主要是過於靈活，各種方式都能接受，導致沒有一個統一的標准，配置起來特別難受，在群里，一般對於Webpack的配置問題的是最多的。很多新手對於Webpack的各種配置錯誤，感覺都欲哭無淚，想死的心都有了。相關的文章也很多，推薦題葉的入門指南。
逼格提升的NPM構建方式。這個阮一峰對於前端構建的變化吐槽過，說新的構建工具就是ES6的構建工具。推薦看賀師俊的答案如何評價阮一峰關於前端工具變化快的言論?
就我個人而言，目前主要還是使用的Webpack來構建，當然一些比較老的系統代碼，由於歷史原因，還是使用的Gulp來構建，也有正在切換之中的，Gulp+Webpack。比較豐富多彩
『陸』 web前端開發環境都有什麼
最簡單的txt文本編輯器就可以，專業點用dreamweaver,webstorm，vs也行，運行的瀏覽器也要全了，畢竟要做兼容處理測試，ie,chrome,opera,safari，火狐等都需要
另外可能需要圖片處理，用photoshop，Visio都行
『柒』 如何搭建前端開發環境
環境搭建
前端開發環境設置和編輯器選擇
『捌』 Web 前端 IDE 用的都是什麼啊
IDE是集成開發環境，一般來說，前端用的只是編輯器。
比較熱門的是sublime，webstorm，vs code，什麼的。
隨便哪個都一樣，哪個順手用哪個。
『玖』 前端開發需要配置什麼環境
web前端開發環境的搭配：
A、Sublime3安裝配置：
Sublime跨平台的前端開發神器,是一個共享軟體,免費使用；下載最新Sublime3安裝包；
-官網地址:http://www.sublimetext.com/
-安裝包管理器
打開Sublime3控制台,ctrl+~
輸入安裝包管理器命令代碼，注意需要聯網才能安裝,因為是在線下載包
包管理器的官網地址:https://packagecontrol.io
-安裝第三方插件(包)
打開命令面板:ctrl+shift+p；
輸入install,然後回車，然後可以搜索想要的插件,回車安裝；Atom工具使用
B、Atom工具使用：
由github發布的前端開發工具，集成了chrome的調試工具，是一款非常強大和開發的開發工具平台。在file裡面的setting裡面進行設置,包括字體的大小,快捷鍵,背景顏色主題等；
官網地址：https://atom.io/
C、WebStorm10的安裝與使用：
WebStrom是最專業的前端IDE開發工具，是一個非常重量級的開發工具,是專業為我們前端設計的IDE,用他來開發是效率非常高；
D、總結三款開發工具的優劣：
Sublime3:需要安裝第三方的包，一般。Atom：集成度非常好，也很輕，需要自己安裝第三方的包。Webstrom：大項目，建議使用webstrom，非常強大，但是也很重。