Nextera

A modern and elegant NextJS template with advanced theme management, pre-configured UI components, and optimized for rapid professional web application development.

🚀 Features

• Next.js 15.3 - The latest version with optimized performance and TurboPack
• React 19 - Enjoy the latest React features
• TypeScript - Static typing for more robust code
• TailwindCSS - With advanced configuration and animations
• Theme Management - Full support for light, dark, and dim themes
• UI Components - Based on shadcn/ui for an elegant and consistent interface
• Sonner - Stylish and accessible toast notifications
• ESLint & Prettier - For clean and consistent code

🛠️ Project Structure

.
├── public/
├── src/
│   ├── app/
│   │   ├── globals.css           # Global styles with CSS variables for themes
│   │   ├── layout.tsx            # Main application layout
│   │   └── page.tsx              # Home page
│   ├── components/
│   │   ├── theme-provider.tsx    # Provider for theme management
│   │   ├── theme-switcher.tsx    # Theme switching component
│   │   └── ui/                   # Reusable UI components
│   └── lib/
│       └── utils.ts              # Utility functions
├── .eslintrc.json
├── .gitignore
├── next.config.ts
├── package.json
├── README.md
├── tailwind.config.ts
└── tsconfig.json

🌗 Themes

This template includes advanced theme management with:

• Light - Default light theme
• Dark - Dark theme
• Dim - Softened dark theme
• System - Adapts to system preferences

Themes are fully customizable via CSS variables in globals.css.

🚀 Quick Start

1. Clone this repo

git clone https://github.com/slkzgm/nextera.git my-project
cd my-project

2. Install dependencies

npm install
# or
yarn
# or
pnpm install

3. Start the development server

npm run dev
# or
yarn dev
# or
pnpm dev

4. Open http://localhost:3000 with your browser

📦 Available Scripts

• dev - Starts the development server with TurboPack
• build - Builds the application for production
• start - Runs the application in production mode
• lint - Checks the code with ESLint
• format - Formats the code with Prettier

🧩 UI Components

This template uses shadcn/ui components for an elegant and consistent user interface. You can easily add more components using the shadcn CLI:

npx shadcn-ui@latest add [component]

📱 Responsive Design

All components are optimized for responsive design thanks to TailwindCSS.

🛡️ TypeScript

The project is fully configured with TypeScript for static typing and a better development experience.

📄 License

This project is licensed under the MIT License.

🙏 Acknowledgements

• Next.js
• TailwindCSS
• shadcn/ui
• Lucide Icons
• next-themes
• Sonner