如何使用Caddy!

你相信嗎？有一個網頁伺服器可以全自動幫你申請、安裝、甚至到期自動續約 SSL 憑證！ 🔒🔐 你再也不用跟那些憑證檔案搏鬥了！

這個聽起來像魔法一樣的東西，它的名字叫做 Caddy！

特色超多! 像是...

現代化的網頁伺服器
全自動 HTTPS 🔒
設定檔 (Caddyfile) 非常簡單易懂
簡化網頁伺服器的設定 (讓你變懶惰！)

安裝教學!(Windows跟Linux幾乎是大同小異，所以我這邊用Windows示範)

1. 去官網下載Caddy~

這邊直接點擊大大的Download!

2. 下載對應版本~(這邊是Windows所以下載Windows即可)

確認Platform是Windows amd64喔!

3. 把下載下來的exe檔案放到一個資料夾中，並建立Caddyfile

Caddyfile基本配置（記得把它和Caddy的執行檔放在同一個資料夾！！）

:80 {
	root * ./ #網站根目錄
	file_server #啟用檔案伺服器
}

4. 啟動Caddy!(記得把你的Index.html放進同一個目錄!)

index.html範例

<!DOCTYPE html>
<html lang="zh-TW">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>✨ Caddy 學習之旅！我的第一個網站！✨</title>
    <style>
        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background-color: #e0f7fa; /* 淡藍色背景，看了心情好 */
            color: #004d40; /* 深綠色文字，清晰又護眼 */
            text-align: center; /* 文字通通置中 */
            padding: 50px;
            margin: 0;
        }
        .container {
            background-color: #ffffff; /* 白色區塊 */
            border-radius: 15px; /* 圓角更柔和 */
            box-shadow: 0 10px 20px rgba(0,0,0,0.1); /* 一點點陰影，讓它看起來立體 */
            padding: 30px;
            max-width: 600px; /* 內容寬度限制 */
            margin: 0 auto; /* 置中顯示 */
        }
        h1 {
            color: #00796b; /* 綠色主標題 */
            font-size: 2.5em; /* 大一點的字體 */
            margin-bottom: 20px;
        }
        p {
            font-size: 1.1em; /* 內文字體大小 */
            line-height: 1.6; /* 行距寬一點，好閱讀 */
        }
        .caddy-message {
            margin-top: 30px;
            font-weight: bold;
            color: #388e3c; /* 綠色強調文字 */
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>✨ 歡迎來到我的第一個 Caddy 網站！✨</h1>
        <p>
            嘿，大家好！👋 我是個電腦小白，但我正在努力學習架設自己的網站喔！
            多虧了 Caddy，這個過程比我想像中還要簡單太多了！簡直是魔法！🧙‍♂️
        </p>
        <p>
            這個頁面是我的測試頁，證明 Caddy 已經順利跑起來了！
            而且還是自動 HTTPS 的安全網站喔！🔒
            是不是很酷呢？(๑•̀ㅂ•́)و✧
        </p>
        <p class="caddy-message">
            感謝 Caddy 幫我輕鬆搞定網站OWO。
        </p>
    </div>
</body>
</html>

打開Cmd執行