最近對前端開發很感興趣，抽空研究了下前段的開發工具，發現比較流行的是sublime,atom,vscode等，
由於一直以來從事.net開發所以對vscode很感興趣，在vscode的安裝配置過程偶然發現巨頭微軟的vscode
是采用electron為基礎開發的，瞬間被震住了，以前不關注前端，雖然知道微軟的發布了一款輕量級的編輯器
卻沒覺得有多大用處，甚至覺得沒有visual studio好用，了解前端開發之后猛然覺得這是一款高大上的前端ID E，
加上對史稱最強大友好的visual studio的好感，覺得vscode一定會繼承visual studio的優良基因，於是一番折騰
安裝配置，期間對於electron很是好奇，百度一下，原來electron是基於大名鼎鼎的node.js而來的，electron讓我們
使用javascript,html5,css3開發富交互桌面應用變得輕松，重要的是通過electron我們可以使用javascript完成對
本地操作系統接口的調用，這對於以前搞前端應用開發動不動要搞一個activex插件來完成本地設備的調用這種扯淡而又
兼容性不好的解決方案來說，簡直是逆天了，由於electron基於node,Chromium,v8,使得前端開發中經常遇到的瀏覽器
兼容性問題徹底消失，可以說這是桌面應用程序的春天，基於electron的桌面程序，兼容性好，可以利用前端技能，又可以
跨平台，UI部分可以充分利用現有的web前端應用框架，可以說是一舉多得。
言歸正傳，扯了這么多，其實就是對electron是如何工作的很好奇，想自己動手試試。
一、由於electron是基於nodejs的，所以我們首先要安裝nodejs
nodejs安裝比較簡單，國內可以直接訪問官網 https://nodejs.org/en/
然后下載安裝最新的版本即可，在此不在贅述。
安裝完成之后打開命令行工具，輸入node -v,npm -v,可以看到如下顯示，說明node安裝成功。
（npm是node的模塊管理工具，由node附帶安裝）
由於nodejs,electron比較流行，所以可以在網上找到很多教程，在此列出一篇來自知乎的入門教程
https://zhuanlan.zhihu.com/p/20225295?columnSlug=FrontendMagazine
本人按照上面的教程一步一步操作，本以為可以順利啟動，誰知道中間遇到了個大坑，耗費了整整一天多的
時間才把問題解決。下面詳細說明一下問題的來龍去脈，以供大家參考。
由於現在代碼托管倉庫流行git,尤其是開源的項目，需要大家自行安裝配置一下git才能按照上面的教程
一步一步實踐，git安裝配置比較簡單，網上教程多，坑少，自己解決。
二、關鍵一步是從git克隆代碼到本地之后
git clone https://github.com/bojzi/sound-machine-electron-guide.git由於該演示程序是關於electron的，所以啟動的時候需要依賴electron，所以需要先安裝依賴，
基於electron的項目的根目錄下有一個package.json的文件，它描述了項目啟動的依賴模塊，所以在
啟動之前我們需要運行npm install命令來安裝依賴模塊，其實就是安裝electron,雖然可以從淘寶鏡像
獲取electron的最新zip包，但是解壓了不知道如何是好，沒法和基於electron的應用結合起來（主要是初次接觸不了解所致），
只能安裝教程一步一步操作，當在sound-machine-electron-guide目錄下執行npm install命令后，等待好久最后報
npm ERR! network connect ETIMEDOUT
npm ERR! network This is most likely not a problem with npm itself
npm ERR! network and is related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settin
gs.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly. See: 'npm help config'
npm ERR! Please include the following file with any support request:
npm ERR! C:\Program Files\nodejs\npm-debug.log
類似上面的異常，有時候報192.30.253.113：443異常，總之經過搜索N多次之后才發現到底還是網絡的原因。
中間設置過代理，
npm config set proxy http://server:port
npm config set https-proxy http://server:port
后來又改回去了，還修改過hosts文件
嘗試過好多其他的方法，都不行
真是踏破鐵血無覓處，得來全不費工夫，誤打誤撞發現了一篇博文
https://segmentfault.com/a/1190000007903823
根據里面的介紹明白了，直接訪問國外的服務器太慢，可以使用
npm install cnpm -g --registry=http://registry.npm.taobao.org
命令先安裝淘寶鏡像的包命令行管理工具cnpm,然后再安裝
cnpm install electron -g
即可快速完成安裝，注意上面的npm install cnpm -g --registry=http://registry.npm.taobao.org
在執行的時候有時候比較慢，需要耐心等待完成之后再進行下一步，我差點沒等住就把窗口關閉了。
也可以cnpm install直接安裝當前目錄下的應用的依賴包，待安裝完成之后
執行 cnpm start即可啟動基於electron的應用程序。如下圖所示：
至此，一個簡單的入門程序算是跑起來了，接下啦就可以自己學習研究如何基於此開發屬於自己的桌面web程序了。
上面是electron官網提供的demo程序，下面是知乎入門教程https://zhuanlan.zhihu.com/p/20225295?columnSlug=FrontendMagazine
的demo程序啟動之后的畫面
大家可以參考學習一下，看似一個簡單的程序，真正動起手來不是那么容易就搞定的，一定要多實踐才是。