概述

  • 這份文件記錄了在 linux 環境下架站的流程

架站需要的資源

VPS

  • VPS 是一個 24 小時都可連線的伺服器,將專案在這台機器上部署好了以後即可隨時使用瀏覽器連接專案所顯示的網頁

docker & docker-compose

  • docker 用來在 VPS 中建立各式各樣的環境,像是 nginx 或是 php 或是 node 等等,都能不用實際安裝就能用 docker 建立起有該功能的環境
  • docker-compose 是一個方便統一管理 docker 建立多個項目的工具

要部屬的專案

  • 想要上線的專案
  • 可以是 laravel 或是純 php 或是 vue 等等都可以

架站流程

取得 VPS

  • 付費租用 VPS,主要看該 VPS 如何收費,大部分應該是需要信用卡
  • 會取得 IP,可用來 ssh 連線也可用來跟 domain 連結,讓其他使用者用你的 domain 即可連結至該 IP 所指的位置
  • 較有名的 VPS 商,也可自行尋找心儀的 VPS 商,以下列表只是找一些較有名的列出來而已
名稱 網址
vultr 連結
linode 連結
DigitalOcean 連結
godaddy 連結

取得 domain

  • 付費購買在全球網路通用的網址
  • 較有名的 domain 商,也可自行尋找心儀的 domain 商,以下列表只是找一些較有名的列出來而已
名稱 網址
godaddy 連結
squarespace 連結

跟 VPS 建立 ssh 認證

連線進 VPS

  • 推薦 SSH 連線方式

安裝 fail2ban

  • 用來防止惡意人士暴力破解帳密
  • 可設定同 IP 登入失敗幾次後將該 IP 封鎖

使用 git 將專案 clone 進 VPS

使用 docker-compose up 起需要的所有環境

  • 在這階段,網站已經在 VPS 上正常運作了

實用指令

  • docker 安裝 vite
# 安裝 vite
docker run --rm -it -v $(pwd):/app -w /app -u $(id -u):$(id -g) node:16 sh -c "yarn create vite"

# 移動到專案資料夾後 yarn
cd <PROJECTNAME> && \
    docker run --rm -it -v $(pwd):/app -w /app -u $(id -u):$(id -g) node:16 yarn

# 開啟 vite service
docker run --rm -it -v $(pwd):/app -w /app -p 5173:5173 -u $(id -u):$(id -g) node:16 yarn dev --host
  • 使用 nginx 建立線上可用的 vue 頁面
docker run
  -d
  --rm
  -p 80:80
  -v /mnt/c/code/document/Wednesday/vue.dev.conf:/etc/nginx/conf.d/vue.conf
  -v /home/kawa/personal/test/vite-project/dist:/var/www/dist
  nginx:alpine