next saas stripe starter

下一個SaaS Stripe入門

從SaaS起動器全速開始！

簡介·安裝·技術堆棧 +功能·作者·信用

介紹

通過Next.JS 14，Prisma，Neon，Auth.js V5，重新發送，React電子郵件，ShadCN/UI和Stripe賦予您的下一個項目。
所有這些都與SaaS入門者無縫集成，以加速您的發展和SaaS之旅。

安裝

克隆並使用以下命令在本地創建此倉庫：

npx create-next-app my-saas-project --example " https://github.com/mickasmt/next-saas-stripe-starter "

或者，與Vercel部署：

步驟

1. 使用PNPM安裝依賴項：

pnpm install

2. 將.env.example複製到.env.local並更新變量。

cp .env.example .env.local

3. 啟動開發服務器：

pnpm run dev

筆記

我使用NPM檢查程序軟件包來更新此項目。

使用此命令更新您的項目： ncu -i --format group

路線圖

• 將ESLINT升級到V9
• 添加成功訂閱的重新匯總

技術堆棧 +功能

SaaS-Starter-demo.mp4

框架

• Next.js - 構建具有最佳開發人員體驗的性能應用程序的React框架
• auth.js - 與Google，Twitter，GitHub等的提供商輕鬆處理用戶身份驗證。
• prisma - node.js的打字稿優點orm
• REACT電子郵件 - 多功能電子郵件框架，可高效且靈活的電子郵件開發

平台

• Vercel - 輕鬆預覽和通過GIT部署更改
• 重新發出 - 一個有力的精簡電子郵件開發的電子郵件框架
• 霓虹燈 - 無服務器郵政，具有自動化，分支，無底存儲和寬敞的免費層。

UI

• Tailwind CSS - 公用事業第一CSS快速UI開發框架
• SHADCN/UI - 使用Radix UI和尾風CSS構建的可重複使用的組件
• 制定者運動 - 輕鬆對動畫組件的運動庫
• Lucide - 精美，簡單，像素完美的圖標
• next/font - 優化自定義字體並刪除外部網絡請求以提高性能
• ImageResponse - 在邊緣生成動態開放圖像

鉤子和公用事業

• useIntersectionObserver - 反應掛鉤觀察元素進入或離開視口何時
• useLocalStorage - 在瀏覽器的本地存儲中持續存在數據
• useScroll - 鉤子觀察滾動位置（示例）
• nFormatter - 格式數字，後綴為1.2k或1.2M
• capitalize - 大寫字符串的首字母
• truncate - 將字符串截斷為指定的長度
• use-debounce - 訪問函數呼叫 /狀態更新

代碼質量

• 打字稿 - 端到端typesafety的靜態類型檢查器
• Prettier - 一致的代碼樣式的自以為是的代碼格式
• Eslint - Next.js和Typescript的可插入襯裡

各種各樣的

• Vercel Analytics - 以隱私友好的方式跟踪唯一訪問者，瀏覽量等

作者

由@miickasmt於2023年創建，並根據麻省理工學院許可發布。

學分

該項目的靈感來自ShadCN的分類法，Steven Tey的先例以及Antonio Erdeljac的下一個AI SaaS。

• shadcn（@shadcn）
• 史蒂文·蒂（@steventey）
• Antonio Erdeljac（@ytcodeantonio）