如何高效快速地在Linux系統上部署Node.js+Express+MySQL的開發環境（桌面可視化）

1、前言

可能一些初級前端和我同樣，在有些項目須要先後臺都一我的打通搞定的時候，對於後臺和開發環境的部署仍是比較頭疼的。特別是Linux系統，因爲沒有系統接觸過，也不太喜歡去記背那麼多命令，大部分命令只能靠不斷的google,baidu去完成。在最近的一個項目中，本身無數次重裝系統，安裝各類軟件等，也有一點心得。稍稍總結出了一個能比較簡潔快速地在Linux系統上搭建開發環境的流程，且能使用桌面可視化軟件就不用命令操做...微軟慣的病。若是嫌桌面太low或太慢會佔用資源等，能夠忽略安裝可視化的步驟。

2、安裝簡介

目標系統：
服務器：騰訊雲
系統：Ubuntu Server 16.04.1 LTS 64位
桌面可視化軟件：xfce
遠程鏈接軟件：VNC Server
語言配置：Chinese
輸入法：ibus
編輯器：gedit
瀏覽器：FireFox
數據庫：MySQL
數據庫可視化：workbench
後臺語言：node.js
框架：express
文件傳輸軟件:WinSCP

本機系統：Windows 10

3、安裝流程

1.登陸系統

首先在騰訊雲（阿里雲等）端直接在網頁中登陸你的服務器，登陸以後是一片黑色...對於剛接觸Linux系統的人來講可能會手足無措。可是不要着急，咱們一步一步來。

2.使Linux系統可視化

參考文章：https://blog.csdn.net/qq_3511...

這裏須要首先了解一個命令，sudo。在Ubuntu系統中不少操做有權限限制，因此在操做以前加上sudo會使你得到管理員權限，這樣不少操做就能進行了。
首先安裝桌面可視化軟件：xfce，執行如下代碼：

//先更新軟件包
sudo apt-get update

//安裝xfce
sudo apt-get install xfce4

在安裝過程當中會出現一個是否安裝的請求，這時輸入y，而後回車就好了。若是想避免此請求，直接在每次安裝命令後面加上 -y（注意有一個空格）。
安裝完成後，咱們的Linux系統就有了桌面。可是如今經過網頁端並不能直接看到桌面系統，須要經過遠程鏈接桌面。

3.遠程鏈接桌面服務器

這裏我使用的是VNC viwer遠程鏈接軟件，十分好用。
首先在Linux系統中安裝VNC server服務，一步一步執行如下代碼：

1.安裝VNC服務

sudo apt-get install vnc4server

2.打開服務，並設置密碼

vncserver :1 //這裏的1能夠是其餘數字，只是在後面的鏈接時端口必需要保持一致

3.這時要求輸入一個8位數的密碼，必定要記住，是後面遠程鏈接時須要的（輸入時看不見輸入的內容，直接輸完回車就行）

password://輸入密碼

4.先關閉VNC服務，來修改啓動文件

vncserver -kill :1

5.修改文件

vi ~/.vnc/xstartup

進入以後在最後一行回車新起一行，複製粘貼如下內容

sesion-manager & xfdesktop & xfce4-panel &   
xfce4-menu-plugin &   
xfsettingsd &   
xfconfd &   
xfwm4 &

而後按Esc退出鍵，輸入":wq"，回車便可保存當前修改的內容。

6.啓動VNC鏈接

vncserver :1

至此遠程鏈接服務就安裝完成了，咱們只須要在Windows本機安裝一個遠程鏈接軟件來來鏈接便可。

7.到VNC Viewer官網下載軟件
https://www.realvnc.com/en/co...
下載完成後打開是這個界面

而後左上角文件能夠新建一個鏈接，以下圖所示

填寫須要鏈接的遠程IP地址時要注意，後面要加上你剛剛在Linux系統上開的端口號，必須一致。

8.成功鏈接

鏈接成功後是這個界面，第一次進去會選擇配置，選擇默認便可。

4.配置中文和輸入法

參考文章：https://blog.csdn.net/betwate...

系統默認是英文，而且中文有可能會出現亂碼的狀況，因此先把系統配置好中文。
1.安裝中文包

sudo apt-get install language-pack-zh-hans

2.安裝字體管理器

sudo apt-get install font-manager

3.拷貝須要的中文字體到系統上
在/usr/share/fonts目錄中，新建一個windows文件夾，存放字體。

從windows傳輸文件到Linux可使用WinSCP軟件，自行百度下載使用。

4.配置語言
修改locale文件內容

sudo vim /etc/default/locale

將其修改成如下內容

LANG="zh_CN.UTF-8"
LANGUAGE="zh_CN:zh:en_US:en"

保存退出，而後能夠重啓一次系統，系統就成功顯示中文了。

5.安裝輸入法

//安裝ibus框架
sudo apt-get install ibus ibus-clutter ibus-gtk ibus-gtk3 ibus-qt4
//啓動框架
im-config -s ibus
//安裝拼音輸入法
sudo apt-get install ibus-pinyin

桌面右鍵，打開輸入法ibus首選項設置（若是系統每次重啓事後不能自動啓動輸入法，則需每次手動打開一次）

打開以後系統右上角便有了輸入法，可設置切換輸入法的方式，默認shif切換

5.安裝瀏覽器和編輯器

//安裝firefox
sudo apt-get install firefox
//安裝gedit
sudo apt-get install gedit

6.安裝Node.js和Express

參考文章:
https://blog.csdn.net/well204...
https://blog.csdn.net/frozens...

1.安裝node.js

//安裝Node.js
sudo apt-get install nodejs
sudo apt install nodejs-legacy
sudo apt install npm
//安裝淘寶鏡像（解決國內使用npm安裝太慢的問題）
sudo npm config set registry https://registry.npm.taobao.org
//安裝更新工具
sudo npm install n -g
//更新node到最新版本
sudo n stable

2.安裝Express

//全局安裝
sudo npm install -g express-generator
//建立項目
express -e myProject  
cd myProject
npm install

目錄結構
bin——存放命令行程序
node_modules——存放全部的項目依賴庫
public——存放靜態文件，包括css、js、img等
routes——存放路由文件
views——存放頁面文件（ejs模板）
app.js——程序啓動文件
package.json——項目依賴配置及開發者信息

在myProject文件夾裏打開終端，執行如下代碼,開啓服務

sudo npm start

而後就能夠在瀏覽器輸入localhost:3000查看了
注意：在node_modules裏執行"npm install mysql"來安裝mysql模塊，不然mysql用不了。

7.安裝MySQL

參考文章：https://www.linuxidc.com/Linu...

//安裝核心服務和功能
sudo apt-get install mysql-server
//開啓服務
service mysql start
//修改文件，解決中文亂碼問題
sudo vi /etc/mysql/mysql.conf.d/mysqld.cnf

在文件中的[mysqld]中添加character_set_server=utf8，而後保存退出

//重啓mysql服務
service mysql restart

安裝可視化工具workbench

sudo apt-get install mysql-workbench

桌面右鍵開發中，可直接打開。

以上就基本搭建好開發環境了。

4、注意事項

1.在以上代碼執行過程當中，若是權限不夠，前面加上sudo通常都能解決。
2.修改文件內容，若是想直接在桌面中的文件點開修改，需執行修改讀寫權限的命令
好比我要修改/usr/share/ 路徑下的某個文件,執行如下命令賦予修改權限

sudo chmod -R 777 /user/share/