What is ShadcnKit? The Next.js Starter Kit You Need

ShadcnKit is a Next.js starter kit designed to make web dev easier. It gives you a solid foundation, so you don't waste time setting up the basics every time you start a new project. Built with Next.js App Router, it integrates tools like Cloudflare (for hosting and database), Stripe for payments, and Logto for authentication—all pre-configured so you can hit the ground running.

Think of it as a toolkit for building scalable, secure apps, without the usual hassle. Want to skip the boilerplate and get straight to building? ShadcnKit's got you covered.

Key Features of ShadcnKit

1. Next.js with App Router

At its core, ShadcnKit leverages the latest version of Next.js, including the new App Router. This ensures that your project benefits from the latest performance improvements and features offered by the Next.js framework.

2. Cloudflare Integration

ShadcnKit comes with built-in support for Cloudflare's services:

• Cloudflare D1 Database: Integrated with Drizzle ORM for efficient and type-safe database operations.
• Cloudflare Pages Hosting: Seamless deployment and hosting solution for your web applications.

3. Authentication with Logto

Security is a top priority in modern web applications. ShadcnKit integrates Logto for robust and customizable authentication, allowing you to implement secure user management with ease.

4. Payment Processing with Stripe

For applications that require payment functionality, ShadcnKit includes Stripe integration. This allows you to handle payments and manage subscriptions out of the box.

5. Email Functionality with Resend

Email communication is crucial for many web applications. ShadcnKit integrates Resend for efficient and reliable email functionality, making it easy to send transactional emails, notifications, and more.

6. Internationalization Support

In our globalized world, supporting multiple languages is often a requirement. ShadcnKit comes with built-in internationalization (i18n) support, allowing you to create multilingual applications with ease.

7. Blog System with Dynamic Routing

Content is king, and ShadcnKit recognizes this by including a blog system with dynamic routing. This feature allows you to easily create and manage blog posts within your application.

8. API Logging and Monitoring

To help you keep track of your application's performance and usage, ShadcnKit includes an API logging system. Logs are stored in the Cloudflare D1 database, providing valuable insights into your application's behavior.

9. User Feedback System

Gathering user feedback is crucial for improving your application. ShadcnKit includes a built-in user feedback system, allowing you to collect and manage user input efficiently.

10. Subscription Management

For applications that offer subscription-based services, ShadcnKit provides subscription management functionality integrated with Stripe and stored in the Cloudflare D1 database.

11. Customizable UI Components

ShadcnKit leverages the power of shadcn/ui and Magic ui, providing a set of customizable and accessible UI components. This allows you to create beautiful and consistent user interfaces without starting from scratch.

12. Facebook Pixel Integration

ShadcnKit includes built-in support for Facebook Pixel, allowing you to track user interactions on your website for better analytics, ad targeting, and conversion tracking.

13. Facebook Conversion API

To enhance sales tracking and user sign-ups, ShadcnKit integrates the Facebook Conversion API, ensuring you have accurate data to optimize your ad campaigns and get better attribution insights.

Getting Started with ShadcnKit

To begin using ShadcnKit, you'll need to set up accounts with the following services:

• Cloudflare
• Logto
• Stripe
• Resend

Once you have these accounts set up, you can clone the ShadcnKit repository and start configuring your project. The kit provides detailed instructions for setting up environment variables, configuring your Cloudflare D1 database, and integrating with the various services.

Database Management with Drizzle ORM

ShadcnKit uses Drizzle ORM for database operations, providing a type-safe and efficient way to interact with your Cloudflare D1 database. The kit includes pre-configured schema definitions and examples of how to use Drizzle ORM in your application code.

Deployment

Deploying your ShadcnKit project is straightforward, thanks to its integration with Cloudflare Pages. By connecting your GitHub repository to Cloudflare Pages and configuring the build settings, you can have your application up and running in no time.

Conclusion

ShadcnKit is more than just a starter kit; it's a comprehensive solution for modern web development. By combining Next.js with a carefully selected set of tools and services, ShadcnKit provides developers with a powerful foundation for building scalable, secure, and feature-rich web applications.

Whether you're building a simple blog or a complex SaaS application, ShadcnKit offers the features and flexibility you need to bring your ideas to life quickly and efficiently. With its focus on developer experience, performance, and scalability, ShadcnKit is an excellent choice for developers looking to streamline their web application development process.

So why start from scratch when you can leverage the power of ShadcnKit? Give it a try and experience the difference it can make in your next web development project!