在過去的十年裡，我一直是一名全端開發人員，建置了像gitup 這樣的較小專案和像crosspublic 這樣的更大專案跨公共）。
多年來，我測試了不同的工具：
提高工作效率
bug 更少
少寫程式碼
我整理了一系列庫來幫助您開發我每天使用的優秀 NextJS 東西，並解釋了您可以用它們做什麼。 讓我們深入了解一下。
1. Trigger.dev
使用 NextJS，我總是需要幫助來處理與後台作業相關的所有事情。
它可以是在背景執行的 cron 作業，用於傳送電子郵件或處理系統中的新使用者管道。
這導致我執行另一台伺服器來處理這些作業，無論是外部 EC2 伺服器還是帶有事件橋的無伺服器功能。
這會導致我支付額外的服務費用（管理更多服務）並自行管理水平擴展（在某些時候）。
Trigger.dev 改變了這一點，在 NextJS（以及許多其他）之上提供後台作業。
他們也知道如何解決 NextJS 無伺服器逾時限制來處理長時間執行的作業。
2. Prisma
Prisma 不是 NextJS 特有的。它是一個與資料庫一起使用的 ORM。
ORM 是資料庫查詢的統一包裝器。
它保持良好的結構，並允許您在不同的資料庫提供者之間快速更改。
雖然您可以使用很多 ORM，但 Prisma 的獨特之處在於為您的查詢提供 Typescript 支持，使一切速度提高 100 倍。 NextJS 在預設配置中使用了 typescript，使其成為完美的匹配。
3. NextAuth.js
假設您要實現任何服務提供者身份驗證，例如 Facebook / Google / GitHub (oAuth)。
在這種情況下，您必須為每個提供者建立實作或使用外部服務，例如 Auth0 或 Clerk。
如果您打算自行執行此操作，NextAuth 提供了豐富的實現，以便您只需提供正確的金鑰即可輕鬆新增它們。
一旦您登錄，他們也會處理授權。
Next.JS auth 可以與 Prisma 開箱即用。
4. 下一個網站地圖
在伺服器上部署 NextJS 後，您需要協助 google 索引所有頁面。
如果您可以告訴 Google 您網站上的所有頁面，那就更好了。
為此，您可以建立一個列出所有頁面的 sitemap.xml 檔案。
您可以輕鬆地使用 Next-Sitemap 來實現這一點。
5. 下一步 SEO
SEO 是透過向您的網站預覽提供關鍵字、描述和圖像，使您的網站出現在 Google Feed 上以進行不同查詢的過程。
如果您使用新的 NextJS 應用程式路由器，則可能不需要使用它。
您可以使用他們的“導出元資料”方法或“生成元資料”，
但如果您使用舊的應用程式路由器，這是為您的網站加入 SEO 的最佳方式。
6. Zod
Zod 是一個物件驗證器（伺服器和客戶端）。
您可以在物件上放置不同的規則並稍後對其進行驗證，例如使用者名稱和密碼，或更複雜的內容（例如陣列長度或其他鍵上的條件）。 Zod 不是 NextJS 特定的。
多年來，我看過很多物件驗證器，例如 Yup 和 class-validator。
是的，它看起來不像 Zod 那樣維護，並且在使用 NestJS 之類的東西時，類驗證器非常強大 - 所以你最好使用 Zod。
7. React-hook-form
雖然 Zod 可以驗證物件，但如果沒有自訂邏輯，它不會影響您的用戶端和後端。
React-hook-form 是優秀的用戶端驗證專案（顯示輸入錯誤、管理輸入狀態和提交）。
當然，您可以使用 Zod 作為 React-hook-form 的驗證器。
8. tRPC
我承認我以前從未使用過 tRPC，但今天它似乎吸引了許多人的目光。
它與 Prisma 有類似的概念；它們為您的請求和回應產生一個接口，因此當您使用前端呼叫時，您會獲得自動完成功能。
這很好，因為它減少了錯誤的機會 - 假設您修改了後端路由，您將無法編譯專案 - 客戶端將返回不存在的參數或回應鍵的錯誤。
9. SWR 和 React-Query
多年來我一直使用 Axios 和 fetch 作為發送請求的基礎庫。
SWR 和 React-Query 增強了這些函式庫並提供鉤子、快取、轉換等。
強烈推薦用於每個專案。請注意，這些庫適用於客戶端元件（“使用客戶端”），而不是伺服器元件。
10. lodash
這不是 NextJS 特定的函式庫。
它是一個用於改變資料的函式庫，雖然這些年來 JavaScript 憑藉像 flatMap 這樣優秀的原生函數取得了很大的進步，但仍然缺少一些東西，例如按鍵或分塊和陣列的唯一陣列。
我發現自己幾乎在所有專案中都使用 lodash。
11. dayjs
day.js 是一個包含與日期、格式、時區等相關的所有內容的函式庫。
我可能會因為那件事而被烤。我多年來一直在使用“moment.js”。
現在它不再維護了，dayjs 是一個不錯的選擇。
有些人喜歡新的 JS 函數來處理日期，但我仍然覺得 dayjs 選項和原生 JS 日期函數之間存在很大的差距。
12. jsdom
這不是必須的，但我最近在許多專案中都使用它作為 cheerio 的替代品。
您可以取得整個頁面內容(<html><body>....</html>) 並將其轉換為稍後可以使用「本機」javascript dom 函數querySelector、innerHTML 等來操作的物件…
非常適合需要一些刮擦的專案。
我們在 X 上連接嗎？ :)
您是否為 NextJS 使用其他一些很酷的程式庫？
請在評論中讓我了解它們:)
原文出處：https://dev.to/nevodavid/top-12-libraries-for-your-nextjs-project-1oob
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
