網站架設之於開發者的第一步－XAMPP-VM for Mac 簡易教學

  基本概念

XAMPP-VM顧名思義，就是在電腦上建立一個獨立的虛擬機器(Virtual Machine, VM)做為伺服器環境。

所以在資料夾的操作上，會是在該虛擬機器上做處理，而不會像過去一樣在本機的XAMPP資料夾底下。

 但本機還是有VM的資料存放在 userName/.bitnami 底下， userName/.bitnami/stackman/machines/xampp/volumes/ 就等同於VM上的 opt/ 

  安裝

XAMPP-VM的安裝方式非常快速，只需要：

1. 1.雙擊dmg檔
2. 2.加入APP資料夾即可點擊app icon運行
3.   超無感安裝XD  

  啟動

依序開啟下方各功能。

**一般而言，網頁瀏覽localhost用的port是80，而上圖意思是在本機瀏覽是用port 8080去讀取VM上的port 80**

**Mount是將VM掛載，掛載後點擊Explore，就可以瀏覽VM上的XAMPP資料夾，進一步建立自己的專案與修改設定等等**

  設定vhost

1. 1.編輯 /opt/lampp/etc/httpd.conf，將以下註解打開
   #Include etc/extra/httpd-vhosts.conf
   1.  
   2. 2.編輯 /opt/lampp/etc/extra/httpd-vhosts.conf
      #設定專案的vhost

      <VirtualHost *:80>

          DocumentRoot "/opt/lampp/htdocs/project"(專案資料夾)

          ServerName project.localhost(虛擬主機域名)

          <Directory "/opt/lampp/htdocs/project">

              Options Indexes FollowSymLinks Includes ExecCGI

              AllowOverride All

              Order Allow,Deny

              Allow From All

          </Directory>

          ErrorLog "logs/project-error_log"

      </VirtualHost>  

       

      #為了讓localhost正常運作，以下也是必須的

      <VirtualHost *:80>

          DocumentRoot "/opt/lampp/htdocs"

          ServerName localhost

          <Directory "/opt/lampp/htdocs">

              Options Indexes FollowSymLinks Includes ExecCGI

              AllowOverride All

              Order Allow,Deny

              Allow From All

          </Directory>

      </VirtualHost> 
   3.  
   4. 3.在terminal輸入 sudo vi /etc/hosts，新增域名
      127.0.0.1 project.localhost
   5.  
   6. 4.然後就可以從project.localhost:8080瀏覽你的網站囉！（記得要加:8080）

  權限設定

為了讓專案中的程式運行順暢，可把htdocs底下的資料夾與檔案權限開啟。

1. 1.右鍵/opt/lampp/htdocs資料夾，點擊「取得資訊」
2. 2.點擊最下方的共享與權限的左下方+號，選取當前使用者（記得要先把鎖頭打開喔！）
3. 3.點擊+號旁邊的按鈕，選擇「套用至內含的項目」

  解除安裝

1. 1.把XAMPP-VM從APP資料夾移到垃圾桶
2. 2.刪除 userName/.bitnami 底下的XAMPP資料夾

  以上來自身為MAC白痴(作者本人)的初學心得XD，希望能夠幫助到第一次用MAC建置環境的新手們！ 

>> XAMPP-VM官方入門介紹傳送門

>> XAMPP-VM常見問題傳送門