第一個靜態網頁生產器

最近迷上的網頁生產器, 所以我決定為我自己造一個網頁生產器, 何不? 其中較大的原因是因為我可以運行我的 網站到免費的 GitHub 網頁運行服務. 不過我上一個2018的專案 API-Reference-Template. 的核心是服務器取向, 而不是生產器取向… 😨 製作一個靜態網頁生產器並不是很困難, 我認為一個靜態網頁的價值來自原前端和整體的使用體驗. 然而, 我已經有一個令我自己滿意的前端網頁. 所以我就沿用我之前寫的專案, 並直接提取其中的前端部分. 然後直接把服務器取向的核心改成生產器取向! 🎉🎉🎉 我直接把這個工具重新取名為 SiraDoc, 這樣一來我也能夠給其他的網頁當作模板使用! 🥳 🔗 Link https://github.com/SiraDoc/SiraDoc

September 26, 2021 · 1 分鐘 · 27 字 · Jen-Chieh Shen

視差網站

Link: MapleStory Survival Kit 這是我學校第一堂網頁設計課所做的網頁. 因為之前是做遊戲的, 所以想挑戰看看 網頁設計能夠做到什麼地步來做到近乎渲染遊戲的方式. 這個網站有以下幾個亮點, 視差 聲音 轉蛋機 👁️ 視差 我看大多範例的視差效果都是一張圖在後面, 身為一個遊戲工程師不經覺得這 樣的設計有些粗糙. 也想要設計看看CSS能夠做到什麼地步. 很幸運地在自己多 方琢磨之後,了解到CSS的動畫機制. 可以有機會的展示CSS的強大動畫效果. 視 差的動畫效果可以由左上方小小的控制板來操作. 🔊 聲音 這是我第一次使用JavaScript裡面的聲效引擎. 在完全不了解的情況下,我選擇 使用第一個出現在我面前的一個函式庫 ion.sound. 這個函式庫非常簡單且強大, 看一下範例就可以清楚知道要怎麼使用. 🎟️ 轉蛋機 如果你有拜訪我的這個作品網站,你會在最左邊的網站看到三台轉蛋機. 當你用鼠標指著他的時候, 他就會開始掉落物品! 這是一個簡單的展示 使用JavaScript, 以每秒30偵的速度去渲染掉落動畫.

August 14, 2018 · 1 分鐘 · 39 字 · Jen-Chieh Shen