最近想學習前端以外的知識,並且拓展自己的領域,並從前端邁向全端。這次會使用到的套件包含為Nextjs、Nestjs、Graphql、prisma來創建一個簡易的購物車網站。
文章重點 建立自定義生成器 (Generator):為了增加效率和一致性,我們創建了自己的生成器。 Nx React 生成器的整合:我們將 Nx 的 Re...
文章重點 創建修改product頁面 創建修改user頁面 本文 今天我們要完成的部分,是我們的product相關頁面以及user相關頁面。 我們先來完成...
文章重點 建立不同的表單,如登入表單、結帳表單和購物車表單 使用 react-hook-form 和 zod 建立表單和進行表單驗證 本文 今天,我們著重...
文章重點 使用recoil管理購物車和商品的狀態 使用recoil組織資料的schemas與actions 本文 今天我們要對我們的網路商店加入狀態管理。...
文章重點 在Next.js 13專案中導入和設置Apollo Client 3進行GraphQL查詢 Apollo Client的基本架構及其運作方式 使用C...
文章重點 修改AppProvider以使用新的apollo-client.ts檔案 在graphql-mocks.ts中創建模擬數據和GraphQL型別 使用...
文章重點 設定Jest 加入元件和元件生成器測試 本文 今天我們來為我們的Nextjs App和component來添加測試。我們先使用已經建立好的Jes...
文章重點 利用 Playwright 進行網頁的端到端測試(E2E Testing) 為元件添加 aria-label 屬性以便於 Playwright 測試...
文章重點 安裝 Nest.js 相關依賴 配置 Prettier 以適應 Decorator 啟動並測試 Nest.js 伺服器 本文 Nest.js 是...
文章重點 安裝必要的依賴包以設置GraphQL環境。 創建配置文件以定義GraphQL和其他相關設置。 建立GraphQL模組和配置服務來初始化GraphQL...