iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
SideProject30

用 Rails 打造你的電商網站 系列

在 15 分鐘內打造出一個 CRUD 的部落格網站,讓 Rails 一戰成名,程式碼優雅簡潔也是 Rails Developer 喜愛的原因之一,作為全端框架,我們可以直接用 Rails 刻出一個網站,且無需前後端分離,展現充分的彈性及便利性,這次我們就用 30 天來刻出一個電商網站吧!

鐵人鍊成 | 共 30 篇文章 | 6 人訂閱 訂閱系列文 RSS系列文
DAY 11

Day 11 茫茫商品中一鍵認出你

商品越來越多,使用者不可能一頁頁慢慢找 我們在後台也是一樣,要快速找到一件商品並且修改刪除 就需要搜尋功能啦! 我們今天會先介紹比較簡單的搜尋功能 Ransac...

2023-09-26 ‧ 由 ning_chang 分享
DAY 12

Day 12 為會員做權限管理

我們在前幾天已經把前後台區分開來了 不過如果後台的路徑被使用者猜到,那也是很頭痛的事情 所以我們就需要做權限管理 Pundit 可以幫我們達到這個效果 Pund...

2023-09-27 ‧ 由 ning_chang 分享
DAY 13

Day 13 美化你的商品網址

前置作業:前台商品 show 頁面 接下來我們要美化網址, 要美化的主要是 show 的網址, 顯示出 id 其實會有點奇怪? 我們可以透過 Friendly_...

2023-09-28 ‧ 由 ning_chang 分享
DAY 14

Day 14 做出互動效果也可以很方便

今天想跟大家介紹 Turbo 點選按鈕,常常給你一大片空白,或者是一動也不動 這是所謂的 Turbolinks 在作祟 大家都避之唯恐不及的 Turbolink...

2023-09-29 ‧ 由 ning_chang 分享
DAY 15

Day 15 不換頁就能新增商品的魔法

先來複習一下什麼是 Turbo Frame 為什麼要用 Turbo Frame 一個頁面會區分成多個區塊,我們要做跨區的互動時, 往往要寫很多個 JS 監聽事件...

2023-09-30 ‧ 由 ning_chang 分享
DAY 16

Day 16 - 讓編輯也在同一頁吧!

今天一樣用 turbo frame 的方式來做 我們想針對每個單品做編輯,而且是在單品的項目中做 我們就得在 id 中加上每個單品的 id,讓 Turbo 知道...

2023-10-01 ‧ 由 ning_chang 分享
DAY 17

Day 17 賠錢貨就是要快點消失!

Turbo Frame 介紹的差不多了,接下來就要換 Turbo Stream 了 Turbo Stream 應用的地方蠻廣泛的, 我們來複習一下前天提到的 T...

2023-10-02 ‧ 由 ning_chang 分享
DAY 18

Day 18 商品建立要馬上看到

Turbo Stream 跟 Turbo Frame 之前我們有用 Turbo Frame, 讓新增商品的動作能在 index 頁面執行 加上 Turbo St...

2023-10-03 ‧ 由 ning_chang 分享
DAY 19

Day 19 JS 套件路徑表

從 Rails 7 之後,Rails 的打包方式從原本的 Webpacker 改為 Importmap Importmap 是什麼 Importmap 雖然跟...

2023-10-04 ‧ 由 ning_chang 分享
DAY 20

Day 20 互動效果一點通

前置作業:購物車及購物車品項的 model / 購物車的 CRUD 在寫 Rails 的時候,是不是很常遇到連結因為 turbo-link 的關係沒有作用呢?...

2023-10-05 ‧ 由 ning_chang 分享