本專案以 Ruby 版本 3.1.2；Rails 6.1.7 進行開發
RubyJoy 是一個結合活動頁面、個人募資、站內商城的平台
身為「送」禮者，是否常在好友生日、小孩周歲時不知道要送什麼？
身為「收」禮者，是否常收到自己不那麼喜歡的禮物？
每次都在猶豫「我送這個禮物、這個金額會不會不夠誠意？」
在 RubyJoy 這個平台，你只需要：
註冊帳號 → 建立活動 → 挑選禮物 → 分享活動連結給朋友，等待願望實現！
輕鬆幫你解決活動頁面建立以及禮物清單的煩惱！
專案介紹影片：https://www.youtube.com/watch?v=HYIGw6shoC0
We used Ruby version 3.1.2；Rails version 6.1.7 for the development
RubyJoy is a website that combines event pages, personal fundraising, and an online store.
Imagine this:
As gift givers, do we often wonder about what to give on birthdays and baby showers?
As recipients, do we often receive gifts that we don't really like?
Now you have RubyJoy to solve this problem, you just need to: Register an account → Create an event → Pick a gift → Share the link to the event page with your friends and family and let them pay for it!
Easily help you out with the troubles of creating an event page and gift listing!
Project Introduction Video：https://www.youtube.com/watch?v=HYIGw6shoC0
透過第三方金流，使用者的付款資訊不會留存在平台，同一透過安全的第三方處理快速的付款流程
The payment process is safely dealt with the third-party payment platform, so that user's payment information will not be stored in RubyJoy's database.
註冊店家角色的使用者，可以透過訂單管理頁面輕鬆查閱訂單狀態、訂單編號及收件人相關資訊，輕鬆出貨！
For vendor role in RubyJoy, You'll have a interface that you can easily manage the orders and check the status of the orders.
使用者可以輕鬆透過加禮物按鈕將喜歡的禮物加入自己活動的許願清單
Users can easily add the products they like to the wishlist of the event page
在送禮人結帳過後，會收到一封成功結帳的通知信，活動創辦人也會收到一封禮物被他人購買的通知信
After the purchase of the gift is done, gift givers will receive an e-mail informing them that the purchase and order are placed successfully. So do the recipients, they'll get e-mail information that tells them which gift on his/her wishlist is purchased.
（ 活動主辦人收到的信件 - The e-mail that recipients will receive）
（ 送禮人收到的信件 - The e-mail that gift givers will receive）
活動創辦人可以輕鬆點擊活動頁面上的一鍵複製活動連結按鈕，輕鬆複製活動頁面連結並透過社群媒體的群發功能分享活動頁面給他的朋友
Event holders can copy the link of their event page and share it through the social media apps.
隨著店家的逐漸增加，活動創辦人可以透過模糊搜尋功能，透過店名的關鍵字更快速的找到心儀的商店
Event holders can find the stores they prefer more easily via the search bar
步驟 1：安裝專案 - Clone the project
執行 $ bundle install ；Run $ bundle install
執行 $ yarn/npm install ；Run $ yarn/npm intall
步驟 2：建立資料庫 - Build the database
執行 $ rails db:create ；Run $ rails db:create
執行 $ rails db:migrate ；Run $ rails db:migrate
步驟 3：加入所需環境變數 - Fill up the ENV variables refer to the .env.example
Ps. 所需環境變數 - The env variables you'll need：
第三方金流(Third-party payment)、AWS S3、Google 第三方登入(Google third-party login)、Mailgun
步驟 4：啟動伺服器 - Start the server ( localhost:3000 )
執行 $ foreman s ；Run $ foreman s
前端 - Frontend：HTML5、 CSS3、 Tailwindcss、 JavaScript、 Stimulus.js
後端 - Backend：Ruby、 Ruby on Rails
資料庫 - Database：PosgreSQL
圖片上傳 - Image upload and storage：AWS S3
部署 - Deployment：Heroku、GoDaddy、CloudFlare
寄信功能- e-mail notification：Mailgun
版本控制 - Version control：Git、GitHub
協同工具 - Collaboration tool：Figma（ Flowchart）、DrawSQL ( Entity–relationship diagram)
第三方金流 - Third-party payment：藍新金流（ NewebPay）
- PosgreSQL 資料庫 - replace SQLite 3 to PosgreSQL
- 搜尋功能 - Searching function
- 串接 AWS S3 - Concatenates AWS S3
- 商店、商品 CRUD - Store, Product CRUD
- 藍新金流串接 - Concatenates NewebPay
- Race condition 處理 - Solved race condition
- Google 第三方登入 - Third-party login ( Google )
GitHub: Click me!
Email: [email protected]
- 商店、商品 CRUD - Store, Product CRUD
- 商店、商品前端 RWD - Store, Product RWD
- 路徑優化 - Routes optimization
- 商店訂單查詢功能 - Order management function & interface ( UI )
- ER圖、Flowchart - Entity–relationship diagram & Flowchart
- 寄信功能 - Mailing function
GitHub: Click me!
Email: [email protected]
- 前端視覺設計 - UI design
- 前端資料驗證 - Fronted validation
- 活動 CRUD - Event CRUD
- 前端 RWD - Frontend RWD
- 一鍵複製活動頁面功能 - Copy function
- SEO 優化、無障礙優化 - SEO optimization, Web accessibility optimization
GitHub: Click me!
Email: [email protected]
- 專案部署及自定義網址DNS轉向 - Project deployment, customized domain name ,DNS settings
- 會員系統 - Member function ( enum, Vendor & User)
- 前端 RWD 切版＆UX 設計 - Frontend RWD & UX design
- i18n 訊息中文化 - i18n ( from En to zh-tw)
- ER圖、Flowchart - Entity–relationship diagram & Flowchart
- 會員活動加禮物功能（ 前後端API串接 ） - Add gift function ( Frontend & Backend API fetching)
GitHub: Click me!
Email: [email protected]