NextJS CLI

![npm version](https://badge.fury.io/js/@fazycks%2Fnextjs-template-cli) ![downloads](https://www.npmjs.com/package/@fazycks/nextjs-template-cli) ![license](https://github.com/fazycks/NextJs-CLI/blob/main/LICENSE)

Un CLI TypeScript inspiré de ShadCN UI pour cloner des dépôts GitHub NextJS avec système d'authentification et ajout de composants.

🚀 Fonctionnalités

- 🚀 Création de projets - Clonage de dépôts NextJS publics et privés
- � Système de composants - Ajout de composants comme ShadCN UI avec nextjs-cli add
- 🔐 Authentification - Système d'auth avec base de données fictive
- 👥 Gestion des utilisateurs - Permissions et tokens GitHub
- 🎨 Interface colorée - CLI avec indicateurs de progression
- ✅ Validation robuste - Noms de projets, URLs et configurations
- 🛠️ Installation automatique - Dépendances npm automatiques

📋 Prérequis

- Node.js (version 16 ou supérieure)
- Git installé sur le système
- npm, yarn ou pnpm

🛠️ Installation

$3

bash

Via npm

npm install -g nextjs-cli



Via pnpm

pnpm add -g nextjs-cli



Via yarn

yarn global add nextjs-cli

$3

bash

git clone 

cd NextJs-CLI

npm install

npm run build

npm link





🎯 Utilisation



$3

bash

Méthode 1: Avec le nom du projet

nextjs-cli create mon-projet



Méthode 2: Sélection interactive

nextjs-cli create



Forcer un gestionnaire de paquets spécifique

nextjs-cli create mon-projet --pm pnpm

nextjs-cli create mon-projet --package-manager yarn



Via pnpm dlx (sans installation)

pnpm dlx nextjs-cli@latest create mon-projet

$3

bash

Dans un projet NextJS existant

cd mon-projet-nextjs



Ajout avec sélection interactive

nextjs-cli add



Ajout direct par nom

nextjs-cli add ui-components

nextjs-cli add nextjs-clean

nextjs-cli add auth-system



Forcer un gestionnaire de paquets spécifique

nextjs-cli add ui-components --pm pnpm

nextjs-cli add auth-system --package-manager yarn



Ne pas installer les dépendances automatiquement

nextjs-cli add ui-components --no-install



Via pnpm dlx (comme ShadCN)

pnpm dlx nextjs-cli@latest add ui-components

pnpm dlx nextjs-cli@latest add

$3

bash

Tous les composants

nextjs-cli list-components



Par catégorie

nextjs-cli list-components --category ui

nextjs-cli list-components -c auth



Alias court

nextjs-cli list-comp

$3

bash

Lister les utilisateurs de test

nextjs-cli list-users



Lister les templates de projets

nextjs-cli list-repos



Lister les gestionnaires de paquets disponibles

nextjs-cli list-package-managers

nextjs-cli list-pm



Valider la configuration

nextjs-cli validate



Aide

nextjs-cli --help

nextjs-cli add --help

nextjs-cli create --help





📦 Composants disponibles



$3



-

nextjs-clean

 - Configuration NextJS propre avec TypeScript et Tailwind CSS

-

database-setup

 🔒 - Configuration Prisma + PostgreSQL



$3



-

ui-components

 - Pack de composants UI réutilisables (Button, Card, etc.)



$3



-

auth-system

 🔒 - Système d'authentification NextAuth.js complet



_🔒 = Nécessite une authentification_



👥 Utilisateurs de test



| Nom d'utilisateur | Email | Accès privé | Description |

| --- | --- | --- | --- |

|

admin

 | admin@example.com | ✅ | Administrateur avec accès complet |

|

user1

 | user1@example.com | ❌ | Utilisateur standard (composants publics uniquement) |

|

developer

 | dev@example.com | ✅ | Développeur avec accès aux composants privés |



🏗️ Architecture du projet



src/

├── types/

│   └── index.ts              # Types TypeScript

├── services/

│   ├── auth.service.ts       # Service d'authentification

│   ├── repository.service.ts # Gestion des templates de projets

│   ├── component.service.ts  # Gestion des composants (nouveau)

│   ├── git.service.ts        # Service de clonage Git

│   ├── config.service.ts     # Service de configuration

│   ├── data.service.ts       # Service de données

│   └── validation.service.ts # Service de validation

└── index.ts                  # Point d'entrée du CLI





� Développement

bash

Installation des dépendances

npm install



Mode développement

npm run dev



Construction

npm run build



Mode watch

npm run watch



Test du CLI en développement

npx ts-node src/index.ts --help

npx ts-node src/index.ts add ui-components





🧪 Tests

bash

Sur Windows

test-cli.bat

test-components.bat



Sur Linux/Mac

./test-cli.sh

./test-components.sh





⚙️ Configuration



$3

bash

cp .env.example .env





$3



Le CLI utilise

config.json

 pour la configuration des utilisateurs, dépôts et composants.



🎨 Ajout de nouveaux composants



$3

json

{

    "name": "mon-composant",

    "displayName": "Mon Composant Génial",

    "description": "Description du composant",

    "category": "ui",

    "isPrivate": false,

    "requiresAuth": false,

    "dependencies": ["package1", "package2"],

    "devDependencies": ["@types/package1"],

    "files": [

        {

            "path": "components/MonComposant.tsx",

            "type": "file",

            "content": "// Code du composant..."

        }

    ]

}





$3



Ajoutez votre composant dans la section

components du fichier config.json

.



🚀 Publication sur NPM



$3

bash

Build

npm run build



Vérification

npm pack --dry-run



Publication

npm publish

$3

bash

Installation globale

npm install -g nextjs-cli



Utilisation directe (comme ShadCN)

npx nextjs-cli@latest add ui-components

pnpm dlx nextjs-cli@latest add auth-system





🔒 Sécurité



⚠️ Important : Ce projet utilise une base de données fictive à des fins de démonstration.



En production :



-   Utilisez une vraie base de données

-   Chiffrez les tokens GitHub

-   Implémentez une authentification OAuth

-   Utilisez des variables d'environnement

-   Validez toutes les entrées utilisateur



📖 Comparaison avec ShadCN UI



| Fonctionnalité | ShadCN UI | NextJS CLI |

| --- | --- | --- |

| Ajout de composants |

npx shadcn@latest add button | npx nextjs-cli@latest add ui-components

 |

| Sélection interactive |

npx shadcn@latest add | npx nextjs-cli@latest add

 |

| Liste des composants |

npx shadcn@latest add --help | nextjs-cli list-components

 |

| Type de composants | UI uniquement | UI + Auth + Setup + Database |

| Authentification | Non | Oui (pour composants privés) |



�️ Fonctionnalités avancées



$3



-   Clone shallow (--depth 1)

-   Nettoyage automatique de l'historique Git

-   Validation des URLs avant clonage



$3



-   Installation automatique des packages npm

-   Séparation dependencies/devDependencies

-   Confirmation utilisateur avant installation



$3



-   Noms de projets (2-50 caractères, format valide)

-   URLs GitHub avec tokens d'authentification

-   Structure de projet NextJS



📄 Licence



MIT - Voir le fichier LICENSE pour plus de détails.



🤝 Contribution



1. Fork le projet

2. Créer une branche feature (

git checkout -b feature/AmazingFeature

)

3. Commit les changements (

git commit -m 'Add AmazingFeature'

)

4. Push vers la branche (

git push origin feature/AmazingFeature

)

5. Ouvrir une Pull Request



📞 Support



-   🐛 Issues: GitHub Issues

-   💬 Discussions: GitHub Discussions

-   📧 Email: votre-email@example.com



---



Inspiré par ShadCN UI - Créé avec ❤️ pour la communauté NextJS



📦 Gestionnaires de paquets supportés



Le CLI détecte et supporte automatiquement plusieurs gestionnaires de paquets :



| Gestionnaire | Installation | Commande d'installation | Détection |

| --- | --- | --- | --- |

| pnpm |

npm install -g pnpm | pnpm add | pnpm-lock.yaml

 |

| yarn |

npm install -g yarn | yarn add | yarn.lock

 |

| bun | Voir bun.sh |

bun add | bun.lockb

 |

| npm | Inclus avec Node.js |

npm install | package-lock.json

 |



$3



-   🔍 Détection automatique - Le CLI détecte le gestionnaire utilisé dans votre projet

-   📋 Sélection interactive - Choix du gestionnaire si plusieurs sont disponibles

-   ⚙️ Configuration automatique - Mise à jour du

package.json avec le champ packageManager`
- 🚀 Installation optimisée - Utilise les commandes spécifiques à chaque gestionnaire