Next.js Starter with TailwindCSS & shadcn/ui

Kaminari is a production-ready Next.js starter template that provides a pre-configured development environment.

It bundles Next.js with Tailwind CSS for styling and shadcn/ui for a set of reusable components. It also includes TypeScript for type safety, along with ESLint and Prettier to maintain code quality and consistency.

GitHub Repo

Live Demo

Features

⚡ Next.js with latest React features and performance optimizations.

🎨 TailwindCSS utility-first framework for rapid UI development.

🧩 shadcn/ui component library with accessible, customizable components.

📝 TypeScript integration for type safety and better developer experience.

🔍 ESLint configuration for code quality enforcement.

✨ Prettier formatting for consistent code style.

📁 Absolute imports using @ prefix for cleaner import statements.

🚀 One-click Vercel deployment configuration.

Use Cases

Building a personal portfolio or blog to showcase work and articles.
Developing marketing websites and landing pages with custom designs.
Rapidly prototyping new web application ideas and concepts.
Creating a full-stack application with a modern and scalable frontend.

How to Use It

You can start a new project with kaminari using one of two methods.

The recommended approach uses create-next-app, the standard tool for bootstrapping Next.js applications.

The create-next-app fetches the kaminari template directly from its GitHub repository and sets up a new project folder for you.

npx create-next-app my-app -e https://github.com/lucky-chap/kaminari

Navigate into your new project directory and start the development server.

cd my-app
npm run dev

Alternatively, you can clone the repository manually using Git. This is useful if you want to inspect the code before starting a project.

git clone https://github.com/lucky-chap/kaminari.git
cd kaminari
npm install
npm run dev

Once the development server is running, you can view your new application by opening http://localhost:3000 in your web browser.

Deployment

Kaminari includes Vercel deployment configuration. You can deploy directly from GitHub by connecting your repository to Vercel or using the Vercel CLI:

npx vercel

Related Resources

Next.js Documentation – Complete guide to Next.js features and API reference.
Tailwind CSS Documentation – Utility-first CSS framework documentation and examples.
shadcn/ui Components – Component library with installation guides and customization options.
TypeScript Handbook – TypeScript language reference and best practices guide.

FAQs

Q: Can I customize the included shadcn-ui components?
A: Yes, shadcn-ui components are designed for customization. You can modify the component files directly or extend them with additional Tailwind CSS classes.

Q: Can I add additional UI component libraries to Kaminari?
A: Yes, you can install additional component libraries alongside shadcn-ui. The template structure supports multiple UI libraries without conflicts.

Q: Is Kaminari compatible with Next.js middleware and API routes?
A: Yes, the template supports all Next.js features including middleware, API routes, and server actions in the App Router.