NextDevKit: A Comprehensive CLI Toolkit for Next.js Development
NextDevKit is a powerful and intuitive command-line
interface (CLI) tool designed to streamline and enhance your Next.js
development workflow. It provides a suite of features that help you quickly
set up projects, generate components and pages, manage utilities and hooks,
and enforce code quality standardsβall from the comfort of your terminal.
π Key Features
π Project Initialization
Create New Projects: Quickly scaffold new Next.js
projects with customizable configurations.
Customization Options: Choose TypeScript support, styling
solutions (CSS, Sass, Tailwind CSS, Styled Components), and more during
setup.
π§ Project Configuration
Initialize in Existing Projects: Seamlessly integrate
NextDevKit into your current Next.js projects to leverage its powerful
features.
π File Management
Add Utilities and Hooks: Easily add pre-built utility
functions or custom React hooks to your project. Includes commonly used
utilities like isEmpty, isString, and hooks like
useAxios.
Remove Files: Effortlessly remove previously added
utilities or hooks from your project.
List Available Files: View all available utility and hook
files that can be added to your project.
π Component and Page Generation
Generate Components and Pages: Quickly generate new
Next.js components or pages using predefined templates.
Support for JS and TS: Works with both JavaScript and
TypeScript projects.
Customizable Templates: Modify templates to fit your
project's specific needs.
π Code Quality Tools Setup
ESLint and Prettier Integration: Set up ESLint and
Prettier configurations to maintain consistent code style and quality.
Husky and lint-staged: Initialize Husky to manage Git
hooks and set up pre-commit hooks with lint-staged. Automatically lint and
format code before each commit.
π» Interactive Command Line Interface
User-Friendly Prompts: Guides you through project setup
and configuration with interactive questions.
Attractive Output: Clear and stylized console output with
colorized text and banners for an enhanced terminal experience.
βοΈ Extensible and Customizable
Project Customization: Tailor project creation with
options for TypeScript, styling choices, and more.
Extend Functionality: Add your own templates and
utilities to expand the toolkit's capabilities.
π Commands Overview
create [projectName] >: Create a new Next.js project with NextDevKit initialized.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
init >: Initialize NextDevKit in an existing Next.js project.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
add [fileName] >: Add a utility or custom hook file to your project.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
remove [fileName] >: Remove a utility or custom hook file from your project.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
list >: List all available utility and hook files.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
generate <type> <name> >: Generate a new component or page.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
setup-linters >: Set up ESLint, Prettier, Husky, and lint-staged in your project.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
help [command] >: Display detailed help information for commands.
class="!overflow-visible"
>
or
class="!overflow-visible"
>
π Why Use NextDevKit?
Boost Productivity: Reduce boilerplate code and setup
time by automating common tasks.
Maintain Code Quality: Enforce consistent coding
standards with integrated linting and formatting tools.
Simplify Workflow: Manage project files, components, and
configurations with simple commands.
Adaptable: Suitable for both new and existing Next.js
projects, supporting JavaScript and TypeScript.
Developer-Friendly: Designed with developers in mind,
providing helpful prompts and clear documentation.
π₯ Getting Started
Install and Run with NPX
class="!overflow-visible"
>
Initialize in an Existing Project
class="!overflow-visible"
>
π¨βπ» About the Creator
NextDevKit is created and maintained by
Harshal Katakiya.
GitHub:
rel="noopener"
target="_new"
style="
--streaming-animation-state: var(--batch-play-state-1);
--animation-rate: var(--batch-play-rate-1);
"
href="https://github.com/Harshalkatakiya"
> style="
--animation-count: 4;
--streaming-animation-state: var(--batch-play-state-2);
"
>https > style="
--animation-count: 5;
--streaming-animation-state: var(--batch-play-state-2);
"
>://github > style="
--animation-count: 6;
--streaming-animation-state: var(--batch-play-state-2);
"
>.com > style="
--animation-count: 7;
--streaming-animation-state: var(--batch-play-state-2);
"
>/Harshalkatakiya > >
Website:
rel="noopener"
target="_new"
style="
--streaming-animation-state: var(--batch-play-state-1);
--animation-rate: var(--batch-play-rate-1);
"
href="https://nextdevkit.vercel.app"
> style="
--animation-count: 6;
--streaming-animation-state: var(--batch-play-state-2);
"
>https > style="
--animation-count: 7;
--streaming-animation-state: var(--batch-play-state-2);
"
>://nextdevkit > style="
--animation-count: 8;
--streaming-animation-state: var(--batch-play-state-2);
"
>.vercel > style="
--animation-count: 9;
--streaming-animation-state: var(--batch-play-state-2);
"
>.app > >
π License
This project is licensed under the MIT License.
π£ Contribute and Support
Contributions, issues, and feature requests are welcome!
Repository:
rel="noopener"
target="_new"
style="
--streaming-animation-state: var(--batch-play-state-1);
--animation-rate: var(--batch-play-rate-1);
"
href="https://github.com/Harshalkatakiya/nextdevkit"
> style="
--animation-count: 8;
--streaming-animation-state: var(--batch-play-state-2);
"
>https > style="
--animation-count: 9;
--streaming-animation-state: var(--batch-play-state-2);
"
>://github > style="
--animation-count: 10;
--streaming-animation-state: var(--batch-play-state-2);
"
>.com > style="
--animation-count: 11;
--streaming-animation-state: var(--batch-play-state-2);
"
>/Harshalkatakiya > style="
--animation-count: 12;
--streaming-animation-state: var(--batch-play-state-2);
"
>/nextdevkit > >
Issues:
rel="noopener"
target="_new"
style="
--streaming-animation-state: var(--batch-play-state-1);
--animation-rate: var(--batch-play-rate-1);
"
href="https://github.com/Harshalkatakiya/nextdevkit/issues"
> style="
--animation-count: 10;
--streaming-animation-state: var(--batch-play-state-2);
"
>https > style="
--animation-count: 11;
--streaming-animation-state: var(--batch-play-state-2);
"
>://github > style="
--animation-count: 12;
--streaming-animation-state: var(--batch-play-state-2);
"
>.com > style="
--animation-count: 13;
--streaming-animation-state: var(--batch-play-state-2);
"
>/Harshalkatakiya > style="
--animation-count: 14;
--streaming-animation-state: var(--batch-play-state-2);
"
>/nextdevkit > style="
--animation-count: 15;
--streaming-animation-state: var(--batch-play-state-2);
"
>/issues > >
NextDevKit is your all-in-one toolkit to supercharge your
Next.js development experience. Get started today and take your projects to
the next level!