Bootstrap 5 + RWD + CKEditor 5 桌遊導覽網

DEMO　|　GitHub Repo

作品說明

初次接觸桌遊的玩家常面臨尋找合適遊戲的困擾，可能透過關鍵字搜尋、朋友或店員推薦等方式，資料較為分散。譬如網路上篇幅較長且詳細的文章，大多偏向單一遊戲的介紹與心得文、或是主要介紹當前幾款熱門桌遊等。對於想在單一網站上尋找有關桌遊的全面性資訊較為困難。

為了解決這個問題，本作品為一個桌遊導覽頁面，提供各種桌遊商品資訊、玩家心得分享以及遊戲技巧等全面性介紹。透過這個整合的桌遊資訊網站，可以幫助玩家更輕鬆地找到符合其需求的遊戲，同時分享桌遊愛好者的專業見解。作品著重於切版，具響應式網頁特性，可供電腦與手機裝置的使用者瀏覽。

作品開發時間：2022/9

開發工具介紹

- 作業系統：Windows 11（64 bit）

- 開發工具：Visual Studio

- 切版框架：Bootstrap 5

 - CSS 預處理器：SCSS

- 網頁互動效果套件

 - Animate On Scroll Library（AOS）

 - CKEditor 5

- jQuery

- 版型管理

 - EJS 樣板管理

使用技術

-切版框架 Bootstrap 5 開發

-SCSS 規劃響應式版型

-第三方 JavaScript 套件 AOS、Swiper 進行互動效果

-會員區塊運用 CKEditor 5 文字編輯器

-EJS 樣板管理進行多頁開發

-Gulp 任務自動化管理與打包

資料來源

- 自行定義

網站規劃資訊

- 網站地圖 (自行設計)

- 線稿圖 (自行設計)

設計稿資訊

- UI 設計師 Kosugi Lai

其他說明

專案資料夾架構、相關網站連結等請詳見 GitHub Repo 該專案的 README.md 檔案。