出海必备的 8 个开源 SaaS 项目!

科技   2024-10-21 17:33   福建  

Shadcn UI 是什么

Shadcn UI 是一个现代化的 React 组件库,为开发者提供了一套高度可定制、可访问性强的 UI 组件。它的主要特点和优势包括:

  1. 可定制性强:组件使用 Radix UI 和 Tailwind CSS,允许开发者轻松调整样式和行为。
  2. 开源免费:完全开源,可以自由使用和修改。
  3. 复制粘贴友好:采用独特的 "复制粘贴" 方法,让开发者能够轻松集成所需组件。
  4. 性能优秀:组件经过优化,确保高性能和流畅的用户体验。
  5. 主题支持:内置深色模式和主题切换功能,方便创建多样化的界面。

近期 Shadcn UI 作者还发布了一个功能强大的 Sidebar 组件,有了这个组件,我们就能方便地根据需求自定义 Sidebar 了。

Shadcn UI 和 Next.js 的结合为快速开发出海 SaaS 或 Landing Page 项目提供了强大的解决方案。

Awesome Shadcn UI

https://github.com/bytefer/awesome-shadcn-ui

Awesome Shadcn UI 目前包含与 Shadcn UI 有关的 200 多个资源,共 13 个分类。涉及 UI 组件库、Landing Page 模板、SaaS 模板(接入用户认证、支付、数据库等)、Shadcn 扩展、Shadcn 工具等。

来源:https://shadcn.batchtool.com/

接下来,我将分享 Awesome Shadcn UI 项目中的 8 个开源 SaaS 项目。

SaaS Starter

1.Next Saas Starter

【MIT/5K+ Star】

https://github.com/leerob/next-saas-starter

技术栈:

  • 框架:Next.js
  • 数据库:Postgres
  • ORM:Drizzle
  • 支付:Stripe
  • UI 库:Shadcn UI

2.SaaS-Boilerplate

【MIT/3.8K+ Star】

https://github.com/ixartz/SaaS-Boilerplate

技术栈:

  • 框架:Next.js
  • 数据库:Postgres
  • 用户认证:Clerk
  • ORM:Drizzle
  • 支付:Stripe
  • UI 库:Shadcn UI

3.Cloudflare SaaS Kit

【3K+ Star】

https://github.com/Dhravya/cloudflare-saas-stack

技术栈:

  • 框架:Next.js
  • 数据库:Cloudflare D1
  • 用户认证:NextAuth.js
  • ORM:Drizzle
  • 部署:Cloudflare Pages
  • UI 库:Shadcn UI

4.Saasfly

【MIT/1.9K+ Star】

https://github.com/saasfly/saasfly

技术栈:

  • 框架:Next.js
  • 数据库:PostgresSQL
  • 用户认证:NextAuth.js
  • ORM:Prisma
  • 支付:Stripe
  • UI 库:Shadcn UI

5.Next-Saas-Stripe-Starter

【MIT/1.8K+ Star】

https://github.com/mickasmt/next-saas-stripe-starter

技术栈:

  • 框架:Next.js
  • 数据库:Neon
  • 用户认证:Auth.js
  • ORM:Prisma
  • 支付:Stripe
  • 部署:Vercel
  • UI 库:Shadcn UI

6.Relivator-Nextjs-Template

【MIT/1K+ Star】

https://github.com/blefnk/relivator-nextjs-template

技术栈:

  • 框架:Next.js
  • 数据库:Postgres/MySQL
  • 用户认证:NextAuth.js
  • ORM:Drizzle
  • 支付:Stripe
  • UI 库:Shadcn UI

7.Nextjs-Starter-Kit

【MIT/966 Star】

https://github.com/michaelshimeles/nextjs-starter-kit

技术栈:

  • 框架:Next.js
  • 数据库:Supabase
  • 用户认证:Clerk
  • ORM:Prisma
  • 支付:Stripe
  • UI 库:Shadcn UI

8.Rapidlaunch

【MIT/434 Star】

https://github.com/alifarooq9/rapidlaunch

技术栈:

  • 框架:Next.js
  • 数据库:Postgres
  • 用户认证:Auth.js
  • ORM:Drizzle
  • 支付:Lemonsqueezy
  • UI 库:Shadcn UI

除了以上 8 个开源项目之外,Awesome Shadcn UI 还有介绍其他的项目,感兴趣的话,可以访问以下地址,阅读更多内容。

https://github.com/bytefer/awesome-shadcn-ui

全栈修仙之路
专注分享 TS、Vue3、前端架构和源码解析等技术干货。
 最新文章