六個掌握 Next.js 的項目
還在為如何構建一些酷炫且獨特的 Next.js 項目而苦惱嗎?

這篇文章為你帶來一些適合初學者的倉庫,幫助你獲取項目靈感。
1. 電子商務應用程序
Digital Hippo?—?Ecommerce Next.js App一個完整的電子商務應用程序。
https://github.com/joschan21/digitalhippo?
功能
- 基于 Next.js 14 從頭構建的完整市場
- 包含精美的登錄頁和產品頁面
- 自定義藝術作品
- 完整的管理面板
- 用戶可以購買和出售自己的產品
- 本地持久化的購物車
- 使用 Payload 進行身份驗證
- 學習如何自托管 Next.js
- 使用 shadcn-ui 構建的簡潔現代 UI
- 注冊和購買后發送漂亮的電子郵件
- 管理員可驗證產品以確保高質量
- ?? 100% 使用 TypeScript 編寫
2. Shadcn UI 的個人作品集
一個簡單的個人作品集應用。
https://github.com/taqui-786/Portfolio
功能
- 簡潔美觀
- 基于 Next.js 14 和 TypeScript
- 使用 Zod 驗證
- 最佳 Talwind CSS 實現
- 速度快且響應迅速
- 使用 Resend 發送電子郵件
3. 個人簡介鏈接生成器應用
一個使用 Next.js 13 和 Zod 構建的無數據庫應用。
https://github.com/taqui-786/itZmyLink
功能
- 學習最佳 Zod 驗證實踐
- 使用 Next.js 13 和 TypeScript
- 簡單且響應迅速
- 無需付費服務
- 一款工具類應用
- 極具創業潛力
4. SaaS 應用程序
一個包含文檔的 Next.js 組件集合。
https://github.com/taqui-786/mixcnui
功能
- 學習如何制作一個簡單的登錄頁面
- 使用 Next.js 14 和 TypeScript
- 使用 Shadcn-ui
- 實現 Nextra 文檔
- 使用 Framer Motion 實現動畫
- 使用 Zod 進行驗證
5. 簡報訂閱頁面
Devletter — 開發者簡報應用一個開發者簡報訂閱頁面。
https://github.com/taqui-786/Devletter
功能
- 簡潔且美觀
- 移動設備響應
- 使用 Next.js 13 和 TypeScript
- 使用 React Hook Form 和 Zod
- 冷酷的雪花動畫背景
- 使用 Prisma ORM 進行數據庫管理
6. 另一個 SaaS 應用程序
一個帶有編輯器的幻燈片制作工具。
https://github.com/taqui-786/crousal-maker
功能
- 速度快且響應迅速
- 簡潔且美觀
- 極具創業潛力
- 基于 Next.js 和 TypeScript 構建
- 學習如何處理圖像
- 學習將圖像轉換為 PDF
以上就是這些項目 ,希望這些項目能幫助你學習和掌握 Next.js,別忘了為這些項目加星 !






























