SSO 登入還沒搞定不過先來嘗試當初選擇 Rocket.chat 的另一個理由，將 Rocket.chat 嵌入我們的主應用的功能。 嵌入的方式是用 ifram...
當在應用內設置好 Tolgee 翻譯後，就能利用 Chrome 插件工具 進行即時編輯。 當有掛載 DevTools 時，並且環境是開發環境且有設定 apiKe...
要在 Nextjs 設定翻譯要分別處理 client component 跟 server component。 先安裝用到的套件。 pnpm add next...
前言 剛好前陣子有位讀者詢問「有在 Next.js 中將 bundler 成功替換成 Rspack，但不知道能不能在 Remix 上用上 Rspack？」 雖然...
前後端合一的 SSR (傳統 SSR) 由後端產生頁面，通常採用 MVC（Model-View-Controller）架構，由後端伺服器來產生完整的 HTML...
之前在 Nextjs 這邊能夠讀取到 Directus 中的資料是因為將資料權限設定成了 Public，如果資料非開放又要讓用戶需要登入之後才能取得資料的話，就...
Directus 有提供 javascript 工具方便整合，先在先前的 NextJS 專案中安裝 yarn add @directus/sdk 開一個新頁面...
目前在 Next App 中點擊登出後，在嘗試重新登入的時候會發現不會再次跳出先前的 Keycloak 登入畫面，這是因為當 Next 這邊登出時只是清理掉 N...
這三十天我們學到了以下的知識 基礎知識 Nextjs 渲染和數據獲取 useClient SSR與CSR SSR與CSR之間的溝通 ISR...
接者來快速做一個應用來串接 Keycloak 的登入試試，這邊用的是基於 Nextjs 的 T3 。 pnpm create t3-app@latest 在建...
Xata的Branch 對Xata來說 他有一個很方便的功能叫做branch 他可以讓你的服務做好資料分離 先下指令做一個新的branch xata branc...
我們來接手Nextjs的錯誤處理吧 錯誤處理的component 我們在src/components/layout/ErrorLogger.tsx中建立一個Er...
最近Edge的runtime已經越來越流行了 Edge的目的是在離用戶最近的位置處理請求，優化效能和回應時間它們特別適合處理需要快速回應的輕量級操作，如內容自訂...
CRON 如果你在特定時間或特定週期需要執行特定的腳本或任務Vercel有CRON可以使用 什麼是CRON CRON 是一個在 Unix-like 操作系統中廣...
今天這個討論版除了可以當討論版以外還可以當作個人部落格來使用只需要加上permission 讓特定用戶可以發文就好我們來實作看看吧 安裝套件 先安裝今天會用到的...
Suspense 你可能知道React的一個特性 import { Suspense } from 'react'; function Page() {...
既然服務都上線了 那我們來搞點SEO相關的設定吧 Metadata 到src/app/layout.tsx 修改以下的程式碼 export const meta...
今天我們要來部署我們的服務了部署的平台我們選擇Vercel Vercel 選擇Vercel有以下幾個原因 無縫整合: Vercel是Next.js的創建者,...
Nextjs的middleware 我們來學Nextjs的middleware 在你的src/middleware.ts建立檔案 import { NextRe...
i18n 先安裝今天會用到的套件 pnpm dlx shadcn@latest add select pnpm install @formatjs/intl...
我們將新增thread的API也改成使用server action 先新增src/app/actions/threads.ts "use server...
我們來試試Nextjs的Server Action 什麼是Server Action Server Action 的目的是將Server端的函數直接嵌入到客戶端...
我們想要在首頁顯示目前最新的幾個thread 在你的src/lib/database/thread.ts中 新增下的function 原因是因為我們在首頁不需要...
查看回報 為了方便我們快速引導至Dashboard畫面 我們可以在最上方的連結中 加入dashboard的連結 在src/components/layout/T...
優化一些機制 現在你的版面應該可以算是初步完成了 現在我們來優化一些機制 例如讓用戶可以回報版面上的一些鬧版 新增回報的table 修改你的schema.jso...
我們今天要來實作修改Service的api 先實作驗證使用者登入身份的middleware 建立src/lib/middleware/serviceOwnerC...
來建立Dashboard吧 我們現在需要管理後台 來管理我們自己的版面 因此我們需要做登入的功能 我們這邊使用Authjs來實作 Authjs 首先我們需要先安...
我們先來處理昨天的問題 點開你的F12 你就看到錯誤的原因 昨天的問題來自前後端的時間渲染不一致 因此我們需要統一時間的作法 新增一個時間格式化的functio...
Nextjs的api 建立Nextjs的api 在src/app/api/service/[serviceId]/thread/route.ts中 建立以下的檔...
先來定義服務要的Schema 在專案的src/lib/database/schema.json 建立以下檔案 { "tables": [...
Jasper
codefarmer
Jaren
skynocover
iThome鐵人賽
看影片追技術