Next.js

Step-by-Step configuration for Next.js

# Prerequisites

Before installing CodeKabir UI, ensure you have:

  • Node.js 18.17 or later
  • A Next.js 13+ project (tested with Next.js 15.2.1)
  • React 18+ and React DOM 18+

# Create New Project

If you don't have a Next.js project yet, you have two options:

1.Create a new Next.js project

Start fresh with a new Next.js application configured with TypeScript and Tailwind CSS:

Terminal
Loading syntax highlighting...

For detailed setup instructions, visit the official Next.js documentation

2.Clone our example project

RECOMMENDED

Get started quickly with our pre-configured Next.js template:

Terminal
Loading syntax highlighting...

This template includes TypeScript, Tailwind CSS, all required dependencies, and example components.

# Setup UI Config

Quick Setup (CLI)

Coming Soon: Our CLI tool will automate the entire setup process.

Future CLI Command:

Terminal
Loading syntax highlighting...
Info

For now, please use the Manual Installation tabto set up CodeKabir UI.

# Verification

Test your installation by creating a simple component. Add this to any page:

Test Component (Verification)
Loading syntax highlighting...

Success! If the button renders correctly with proper styling, your CodeKabir UI installation is complete.

# What's Next?

Now that CodeKabir UI is installed, you can:

  • Explore the Components documentation to see all available components
  • Check out Usage examples to learn best practices
  • Customize the design system by modifying your Tailwind configuration
  • Join our community for support and updates
Need Help?

If you encounter any issues during installation, check our troubleshooting guide or reach out to our community for assistance.