Automatisation de Flux de Travail avec Claude Code

Le Répertoire de Scripts Claude

Créez un répertoire .claude à la racine de votre projet pour stocker des scripts et configurations personnalisés :

Claude Code détecte et utilise automatiquement ce répertoire pour l'automatisation personnalisée.

Configuration de Base du Flux de Travail

Créez un fichier config.json dans le répertoire .claude :

{
  "projectName": "MyAwesomeProject",
  "description": "A React application for financial management",
  "workflows": {
    "component": {
      "templatePath": "./templates/component.tsx",
      "outputPath": "src/components/{name}/{name}.tsx"
    },
    "test": {
      "templatePath": "./templates/test.tsx",
      "outputPath": "src/components/{name}/__tests__/{name}.test.tsx"
    }
  }
}

Cette configuration définit des flux de travail basés sur des templates pour la création de composants et de tests.

Structure de Script

Créez un fichier JavaScript dans le répertoire .claude/scripts :

// .claude/scripts/create-feature.js

module.exports = async (claude, args) => {
  const { featureName } = args;

  // Create feature directory
  await claude.exec(`mkdir -p src/features/${featureName}`);

  // Create component files
  await claude.generateFile(
    `src/features/${featureName}/${featureName}Page.tsx`,
    `Create a React component for the ${featureName} feature page`
  );

  // Create service files
  await claude.generateFile(
    `src/features/${featureName}/${featureName}Service.ts`,
    `Create a service for the ${featureName} feature that handles data fetching and processing`
  );

  // Update route configuration
  await claude.modifyFile(
    'src/routes.tsx',
    `Add a route for the ${featureName} feature page`
  );

  return `${featureName} feature created successfully!`;
};

Exécution de Scripts Personnalisés

Exécutez vos scripts personnalisés en utilisant la commande claude run :

Cela exécutera votre script avec les arguments fournis, créant tous les fichiers nécessaires pour la fonctionnalité de profil utilisateur.

Création de Templates

Créez des fichiers de template dans le répertoire .claude/templates :

// .claude/templates/component.tsx

import React from 'react';

interface {{name}}Props {
  // Add props here
}

export const {{name}} = ({ ...props }: {{name}}Props) => {
  return (
    <div className="{{kebabCase name}}-component">
      {/* Component content */}
    </div>
  );
};

export default {{name}};

Les templates utilisent une syntaxe de type handlebars avec des variables comme $name qui sont remplacées lors de la génération.

Utilisation des Templates

Générez des fichiers à partir de templates avec la commande claude generate :

Cela créera un nouveau composant basé sur votre template à src/components/UserProfile/UserProfile.tsx.

Intégration CI/CD

Intégrez l'automatisation Claude Code dans votre pipeline CI/CD :

# .github/workflows/claude-checks.yml

name: Claude Code Checks

on:
  pull_request:
    branches: [ main ]

jobs:
  code-quality:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Install Claude CLI
        run: npm install -g @anthropic/claude-cli
      - name: Run Claude Code Review
        run: claude run code-review --reporter=github

Automatisation Basée sur les Événements

Configurez des automatisations qui se déclenchent en fonction des événements du projet :

// .claude/config.json

{
  // ... other config
  "events": {
    "onComponentCreate": "generate-tests",
    "onModelChange": "update-migrations",
    "onApiChange": "update-documentation"
  }
}

Cette configuration indique à Claude Code d'exécuter automatiquement certains scripts lorsque des événements spécifiques se produisent.