專案連結

https://zuna.tw/

專案介紹

Zuna 是一個擁有上百則真實使用者評論的匿名租屋評論平台，它給學生們一個盡情分享租屋心得的空間，讓租過的人可以分享最真實的租屋情況，讓正在找租屋處的同學多一份參考，避免踩到前人踩過的地雷點。

Zuna 可以解決學生租屋族的以下問題：

① 不知道學區附近有哪些地方可以租

② 租金市場不透明，無從得知目前租金行情，有被房東與房仲坑的風險

③ 房東與房仲未告知真實的租屋處情況，導致入住後問題重重

社群迴響

Dcard - 給北大同學們的租屋評論網站

功能

① 看評論：顯示所有社區，點選社區卡片後顯示該社區所有評論

② 找社區：點選設施按鈕後，於 Google Map 顯示符合條件的篩選結果，hover 社區小房子顯示社區資訊卡片

③ 寫評論：點選欲評論的社區卡片後，可撰寫星級評分、設施清單、租屋心得、居住資訊四大項題目，表單附有錯誤驗證功能，送出填答後導回該社區評論頁面。

④ 關鍵字搜尋功能，透過輸入關鍵字來快速查找相符的社區

⑤ 後台管理，能隱藏不當評論、將租金極端值不納入平均避免失真

⑥ 其他增進使用者體驗的小功能：Infinite scroll、Go to top、lazy load、美化提示訊息與錯誤顯示，減少使用者瀏覽的緊張感

⑦ 支援 RWD (手機版更漂亮！)

技術與工具使用

後端

① 後端使用 ActionController::API 為主要基底，減少不必要前端工具及 middleware

② 資料庫使用 PostgresQL

③ 搭配各種 Rails Design Pattern 增加程式碼重用、可讀性（Service/Form Object等）

④ 使用監控服務 Rollbar + NewRelic

⑤ 使用 Capistrano 部署至 Linode Instance

⑥ 測試使用 RSpec + RSwag + Github Action

前端

① 使用 create-react-app 建置環境

② 使用 React-router 管理頁面與路由實現 SPA

③ 使用 React function component & hooks

④ 使用 styled-component 達成模組化切版

⑤ 串接第三方服務：Google Map API、Google Auth API

團隊成員與分工

🙋‍♂️ 袁浩 Harry Yuan

• 全後端開發
• 資料庫規劃與建置
• 設定部署建置 npm script 以啟用前端 release build

🙋‍♀️ 史璧華 Hazel Shih

• 全前端開發
• 產品規劃
• UI 設計稿繪製