「 今天先不急著串後端 API，我們的目標是打造一個簡單的前端畫面。先有輸入框、查詢按鈕、還有結果顯示區，這樣就有了『小工具的雛形』。雖然資料還是假的，但你可以先體驗點擊按鈕後，畫面會有回饋的感覺，對初學者來說，這就是最直覺的成就感！」

內容重點：

• 建立輸入框、查詢按鈕、結果區域
• 結果區先放假資料，例如：「台北，25°C，晴天」
• JavaScript 先寫按鈕事件，抓取輸入框值並在 #result 顯示假資料

程式說明：

• getWeather() 先不用 fetch 後端 API

function getWeather() {
  const city = document.getElementById("cityInput").value;
  if (!city.trim()) {
    document.getElementById("result").innerText = "⚠️ 請輸入城市名稱";
    return;
  }
  // 顯示假資料
  document.getElementById("result").innerHTML = `
    <strong>${city}</strong><br>
    🌡️ 溫度: 25°C <br>
    ☁️ 天氣: 晴天
  `;
}

解析：抓取輸入框值，點擊按鈕就顯示假資料，先完成互動流程。