Next.js 整合

tRPC ❤️ Next.js

Next.js 讓您可以在一個程式碼庫中輕鬆地同時建置前端和後端。tRPC 讓您可以在它們之間輕鬆地共用類型，確保應用程式資料擷取的類型安全。

我們的 Next.js 整合建構在我們的 React Query 整合 之上，並具有一些 Next.js 特定的 API，以處理前端和後端渲染。

使用 Next.js 整合時，您將獲得下列功能

• 伺服器端渲染 - 您可以在伺服器上告訴 tRPC 渲染您的網頁，然後在前端上進行資料補充。這樣一來，您就可以避免初始載入狀態，儘管首次位元組的時間會受到伺服器阻擋。閱讀更多關於 伺服器端渲染 的資訊。
• 靜態網站產生 - 在伺服器上預先擷取查詢並產生已準備好提供服務的靜態 HTML 檔案。閱讀更多關於 靜態網站產生 的資訊。
• 自動提供者封裝 - @trpc/next 提供一個高階元件 (HOC)，用必要的提供者封裝您的應用程式，讓您不必自己執行此操作。

提示

如果您在新的專案中使用 tRPC，請考慮使用範例專案作為參考：tRPC 範例專案