mariio46/nexus

NextJS 14 App Router - Starterkit (TailwindCSS, ShadcnUI, Tabler Icon)

NextJs 14 Starterkit

Simple Starterkit for NextJS (App Router / Dir) Application using Shadcn/UI, TailwindCSS

Features

• Refactoring Shadcn into plugin and preset
• Easy to change or add more theme
• Setting up the dark mode
• Login and Register Page
• Using the best Icon from Tabler (Components from Shadcn/UI are modified using Tabler Icons too)
• Setting up prettier from Prettier Plugin Tailwindcss
• Setting up Tailwind Merge and CLSX
• Using Geist Font from NextJS
• Provide some custom hooks for Loading
• Provide some custom hooks for handle Dialog from Shadcn/UI
• Add TanStack Query for fetching data on client

Installation

git clone

cd project

npm install && npm run dev

Techs

This starterkit uses a number of open source projects to work properly:

• NextJs - The React Framework for the Web
• Shadcn/UI - Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
• TailwindCSS - A utility-first CSS framework packed with classes
• Tabler Icons - Free and open source icons designed to make your website or app attractive, visually consistent and simply beautiful.
• Tailwind Prettier
• Geist Font - Geist truly represents the coding and design spirit within Vercel's creative community.
• TanStack - Headless, type-safe, & powerful utilities for State Management, Routing, Data Visualization, Charts, Tables, and more.

Customize Theme

• Go to Shadcn Themes and chose theme
• Open file ./lib/shadcn/plugin.ts add or customize the thme
• Restart the server