主題
練習用 Astro + React 開發網站
CSS 使用 Tailwind，後端使用 Node + Express，資料庫使用 Azure Cosmos DB
某天偶然路過看到一位大佬工程師 Liu Hok Yiu 的部落格網站
其中他提及這個網站使用 Astro 開發，並對這個新興前端框架讚譽有加
於是就有想要用 Astro 做一個網站來豐富作品集的想法，只是環境建完後就不動專案了（欸
後來我在 104 上找實習，投了一間 幾天後才發現黑料很多的公司
總之一開始為了這個讓我自訂題目的技術測驗，就決定順便把手頭上既有的專案給寫完
當時是覺得用沒碰過的框架在4天內完成全端專案，能證明自己更有能力XD
也做好了就算結果不盡人意，還是多一個作品塞履歷的心理建設（最後竟是別種層面的不盡人意w）
當初主題思考了一段時間
因為我既想要表現出我有一定的網頁設計能力，又要做一個4天內能完成的主題
看著 Astro 這個單字...... 嗯？好像很多跟宇宙或天體有關的單字都是 "Astro" 開頭哦？
於是就決定做一個跟太空、小行星、隕石有關的主題
而網站標題 "AstroJuStDown" 也苦思甚久
後來決定先找出一個單字中含 "JS" 的詞放在後面，馬上就想到 "Just"
然後故意把其中的 "J" 和 "S" 設計成大寫，強調 "Astro.JS"
最後把 "Astro" 這個詞代指為「天體」（算是超譯w），再加上 "Down"
就有一種隕石向下墜落的意象啦！ 
為了加強聯想，且最近又看到 Three.js 在網頁上的應用
所以我就去抓了 Nasa 提供的隕石模型，然後做了一些處理後加進 Logo 中當主視覺
▲ 登入頁不想放3D模型，但依然保留了「向下」的意象
Astro + React
Astro 是一個號稱 0 Javascript 的框架，以星爆快為主打的特色
它會在一開始把網頁生成為完全靜態的 HTML，並清除掉所有的 JavaScript
Astro 把所有元件都當做一個獨立的應用程式
比方說頁面上有一個 JS 控制的幻燈片，那就被當作一個小小應用程式
一般的 React 是整個都是由多個 JS 元件組合起來的大應用程式
Astro 由於頁面被劃分為很多個迷你應用程式，JS 可以只在需要的時候獨立載入
Astro 有用一些技術，把 React 等框架的元件在第一時間先轉成靜態 HTML
用戶可以自行設定當元件只有在某些條件下才具有互動性
比方說：可以設定某元件直到使用者在頁面上滑鼠滾到看得見它的時候，才會觸發 Astro 的機制（水合，英文 hydration）載入 JS
看起來 Astro 主要是在控管 JS 被加進元件的時機，來提高載入速度
React-Icon 函式庫導致 Build 失敗的問題
error Named export 'FaCircleUser' not found. The requested module 'react-icons/fa6/index.esm.js' is a CommonJS module, which may not support all module.exports as named exports.
原本的 Error 訊息跟真實狀況根本八桿子打不著
同一組 icon，可以有些不支援 module export ？？ 我是真的有看沒有懂
後來才查到需要在引入的路徑後面多加一個 /index
這大概是 Astro 的問題
跨域 session & cookie 問題
原本想當免費仔，本地端測完後全部架上 Vercel 就了事（Vercel 也可以部屬無伺服器服務）
我在本地 localhost 測試帳號登入時，能夠正常儲存 session 和 cookie
但是當我分別放到 Vercel 上之後，不管怎麼設定，都沒辦法在前端設定 session 和 cookie 了
因為其他資源的請求都是可以正常跟後端拿東西回來的
只有牽涉到 session 和 cookie 的運作不正常（登入後要發文，又要用戶登入一次...無限 loop）
原本一直以為是生產環境下的同源政策沒設好，爬很久 StackOverFlow，上面提過的方法都試過了
當然也有看到幾個人的答案是：無解，請買網域吧！
但是我不到黃河心不死，在掙扎了2天、只睡一小、飢寒交迫之下，我終於發文問人
結果卻出乎我的意料
跟同源政策沒有關係，而是 Vercel 因為安全性的考量沒辦法寫入！
知名工程師 Huli 大大親自回覆：假設寫得進去，那代表其他人架在 Vercel 上的網站也會被影響到
ㄨㄚˊ，這下是非得花錢不可了
我到 Cloudflare 買了一個每年130塊錢新台幣的網域（它保證續費價格不變）
然後在 Vercel 將前/後端專案的 domain 都設置為該網域的子網域
問題......一下子就解決了，真．花錢消災
我有弄 RWD 哦 
雖然我揚了那份實習的後續面試，不過有一個全端的作品能加進履歷中仍然是好事
（沒人要用！）
達人
