小酌圖鑑 🍶

SAKEHOLIC BOOK | 日本酒檢索網站
https://aki168.github.io/sakeholic/

專案製作緣由

💡 與同好分享的心

針對喜歡日本酒，但總感到中文資訊匱乏的人為對象
台灣少有日本酒為主的檢索資訊站（洋酒比較多）
想做出一個可提查詢日本酒資料的應用站

💡 解決自身的問題

我是個喜歡日本酒，小酌是我下班後的興趣之一
遇到沒喝過的日本酒，也時常有搜尋習慣😎
同為需求方的角度，PUSH 自己進行開發

Getting Started

npm start

以開發者模式開啟
將運行於本地端 http://localhost:3000
本專案 支援手機/電腦/平板等跨裝置瀏覽

Folder Structure

public
│
├── media // 靜態多媒體檔案 
│
├── SCSS  // 模組化 CSS
│     ├── _index.scss  // 自定義樣式 
│     ├── _japanMap.scss // RWD日本地圖
│     ├── _reset.scss  // CSS reset (meyerweb)  
│     ├── all.css // 生成編譯出口
│     ├── all.css.map 
│     └── all.scss  // 需編譯之檔案彙總
│
└── index.html  

/////

src  
│   
├── components // 各UI元件       
│   
├── hooks // 客製化 Hooks  
│     ├── useCheckMobileMode.js 確認用戶裝置(影片播放偵測用)  
│     └── useFetch.js // 遠端連線使用  
│    
├── pages // 個別頁面  
│     ├── About // 關於本站  
│     ├── AreaSearchPage // 依地區搜尋酒品  
│     ├── Main // 首頁  
│     ├── RankingPage // 酒品排名   
│     ├── SearchPage // 關鍵字檢索  
│     ├── UserPage // 會員專區  
│     └── NotFoundPage // 404頁面  
│ 
/////  

── package.json // 依賴套件等資訊 

Site Map

Wireframe

Skills & Tools

React

React-Router / react-hook-form

Axios

Webpack

SCSS

MUI Design / Bootstrap

---

※ This project was bootstrapped with Create React App.