Vibe Coding : Une nouvelle ère de développement logiciel ?!

Vibe Coding est une approche innovante du développement logiciel dans laquelle les développeurs n'écrivent plus de code directement, mais formulent leurs idées en langage naturel à l'aide d'outils de développement pris en charge par l'IA. L’IA génère ensuite le code approprié, rendant la programmation plus accessible et plus efficace2.

Comment ça marche

Avec Vibe Coding, les développeurs fournissent des instructions verbales telles que « Créer une barre de navigation avec un menu déroulant » ou « Optimiser la vitesse de chargement des pages ». L'IA analyse ces entrées et génère le code correspondant. Si des ajustements sont nécessaires, le développeur peut fournir des instructions supplémentaires, créant ainsi un processus itératif.

Conditions-cadres

Modèles d'IA : le codage Vibe est basé sur de puissants grands modèles de langage (LLM) qui peuvent générer et optimiser le code.
Outils : des plateformes telles que Cursor Composer ou Replit Agent utilisent des modèles d'IA d'OpenAI ou d'Anthropic.
Cas d'utilisation : particulièrement utile pour le prototypage rapide, le développement Web et l'automatisation.

Avantages et inconvénients du codage d'ambiance

Avantages	Inconvénients
Accessibilité – Même les personnes sans connaissances approfondies en programmation peuvent développer des logiciels.	Assurance qualité – Le code généré peut contenir des erreurs ou être inefficace.
Rapidité – Les projets peuvent être mis en œuvre beaucoup plus rapidement.	Risques de sécurité – Le code non testé peut contenir des vulnérabilités.
Créativité – Les développeurs peuvent se concentrer davantage sur les idées et les concepts.	Dépendance à l’IA – Un contrôle moindre sur le code peut être problématique à long terme.
Automatisation – Les tâches récurrentes peuvent être réalisées efficacement.	Débogage – Le dépannage peut être plus difficile si le code n’est pas entièrement compris.
Documentation – L’IA peut rédiger de la documentation plus rapidement et souvent mieux que les humains.	Documentation – En externalisant vers l’IA, vous vous privez de la possibilité de réfléchir au code et à son utilité.
	Espionnage – Pour le codage d’ambiance, l’IA doit être adressée. Si ce n’est pas au sein de votre propre entreprise, il y a un risque d’espionnage industriel. Il peut également y avoir des problèmes avec les brevets, car le brevet pourrait se voir refuser l’étape inventive nécessaire.
Tests – En utilisant des instructions en langage naturel, vous pouvez formuler l’essence des tests et laisser l’artisanat à l’IA. En particulier, l'IA écrit des tests unitaires rapidement et bien.

Le codage Vibe révolutionne le développement de logiciels en abaissant les barrières à la programmation et en facilitant les processus créatifs. Dans le même temps, il faut cependant faire preuve d’esprit critique pour garantir la qualité et la sécurité du code généré.

Post-scriptum
Le texte ci-dessus a été créé par une IA. Les parties en italique ont été ajoutées par moi plus tard. De grandes parties de l'extension TYPO3 webhelp ont également été créées avec l'IA, c'est-à-dire à l'aide du codage Vibe. Mon expérience montre qu’il faut garder le projet de programmation petit. Les composants Web sélectionnés avaient juste la bonne taille pour ne pas surcharger les services d'IA utilisés. Le codage Vibe oblige le développeur à réfléchir aux scénarios de test dès le début, de manière similaire au codage piloté par les tests. Avec les composants Web, c'est facile car vous pouvez demander à l'IA de développer des variantes spécifiques pour les composants Web eux-mêmes. L’avantage est que vous pouvez également utiliser l’IA pour créer de la documentation.

Tout a été traduit et publié en ligne à l'aide de google.translate.de sans autre vérification.

Composants Web de l'extension TYPO3 `webhelp`

porthd-tocgenerator : Intégrer la table des matières en tant que composant Web

Message d'erreur au lieu du répertoire

Répertoire fonctionnant correctement

porthd-breadcrumb : Créer un menu de navigation à partir d'un lien vocal

Pour la page actuelle

Créer une erreur dans le menu du fil d'Ariane

porthd-ajax : Afficher `Sitemap.xml` chargé via Ajax à l'aide d'un rappel avec un bouton

Importation Ajax défectueuse sans bouton

Importation Ajax avec bouton (rechargement pour Google Maps ou réseaux sociaux)

Sans bouton

Avec bouton et texte de démarrage et un maximum de 3 événements de clic

Pour des raisons de protection des données, la requête Ajax n'est exécutée que lorsque vous cliquez sur le bouton.

porthd-barchart-from-table : Exemple de tableau pour graphique - lecture « transposée »

Alice Bob Clara

Personne
Valeur A	10	20	30
Valeur B	5	15	25

porthd-codeview : Code PHP inclus dans un <script> balise

porthd-infomodal : Fenêtre modale avec emplacements dans le modèle

Exemple : Modal avec modèle défini en dehors du composant Web

Exemple : Modal avec modèle inclus par le composant Web

porthd-listselect : Méga menu extensible/réductible et consultable inclus dans le composant Web

Il y a aussi un <div> au lieu d'un <li>.

Royaume : Animaux
- Embranchement : Chordés
  - Classe : Mammifères
    - Ordre : Carnivores (prédateurs)
      - Famille : Felidae (Chats)
        
        Genre : Panthera
        
        Espèce : Panthera leo (lion)
        
        Espèce : Panthera tigris (Tigre)
    - Ordre : Proboscidea
      - Famille : Elephantidae
        
        Genre : Loxodonta
        
        Espèce : Loxodonta africana (éléphant d'Afrique)
        
        Espèce : Loxodonta cyclotis (éléphant de forêt)
        
        Genre : Elephas
        
        Espèce : Elephas maximus (éléphant d'Asie)
        
        Genre : Mammuthus (éteint)
        
        Espèce : Mammuthus primigenius (mammouth laineux)
        
        Espèce : Mammuthus columbi (mammouth colombien)
        
        Espèce : Mammuthus meridionalis (éléphant du sud)
    - Ordre : Cétacés
      - Famille : Delphinidae (Dauphins)
        
        Genre : Delphinus
        
        Espèce : Delphinus delphis (dauphin commun)
        
        Espèce : Delphinus capensis (dauphin à long bec)
        
        Genre : Tursiops
        
        Espèce : Tursiops truncatus (grand dauphin)
        
        Espèce : Tursiops aduncus (grand dauphin de l'Indo-Pacifique)
        
        Genre : Stenella
        
        Espèce : Stenella attenuata (dauphin tacheté)
        
        Espèce : Stenella longirostris (Dauphin à long bec)
        
        Espèce : Stenella coeruleoalba (dauphin bleu et white)
        
        Genre : Orcinus
        
        Espèce : Orcinus orca (épaulard / orque)
        
        Genre : Lagenodelphis
        
        Espèce : Lagenodelphis hosei (dauphin fin)
      - Famille : Phocoenidae (marsouins)
        
        Genre : Phocoena
        
        Espèce : Phocoena phocoena (Marsouin commun)
        
        Espèce : Phocoena sinus (Vaquita / Californien marsouin)
        
        Espèce : Phocoena dioptrica (marsouin à lunettes)
        
        Genre : Neophocaena
        
        Espèce : Neophocaena phocaenoides (marsouin aptère)
        
        Genre : Australophocaena
        
        Espèce : Australophocaena dioptrica (Marsouin commun du Sud)
  - Classe : Oiseaux
    - Espèce : Aigle (*Aquila chrysaetos*)
    - Espèce : Manchot (*Aptenodytes forsteri*)
    - Espèce : perroquet (*Ara ararauna*)
  - Classe : Reptiles
    - Espèce : Crocodile (*Crocodylus niloticus*)
    - Espèce : Iguane (*Iguana iguana*)
    - Espèce : Serpent (*Tiens, tiens, tiens*)
- Embranchement : Arthropodes
  - Classe : Insectes
    - Espèce : Fourmi (*Formica rufa*)
    - Espèce : Papillon (*Papilio machaon*)
    - Ordre : Coléoptères (scarabées)
      - Famille : Coccinellidae (coccinelles)
        
        Genre : Coccinella
        
        Espèce : Coccinella septempunctata (Coccinelle à sept points)
  - Classe : Arachnides
    - Espèce : Tarentule (*Theraphosa blondi*)
    - Espèce : Scorpion (*Androctonus australis*)
    - Type : Tique (*Ixodes ricinus*)
  - Classe : Crustacés
    - Espèce : Homard (*Homarus gammarus*)
    - Espèce : Crabe (*Carcinus maenas*)
    - Espèce : Crevette (*Palaemon serratus*)
Royaume : Plantes
- Embranchement : Angiospermes
  - Classe : Monocotylédones
    - Type : Riz (*Oryza sativa*)
    - Espèce : bananier (*Musa acuminata*)
    - Espèce : tulipe (*Tulipa gesneriana*)
  - Classe : Dicots
    - Type : Rose (*Rosa canina*)
    - Type : Chêne (*Quercus robur*)
    - Espèce : Tournesol (*Helianthus annuus*)
  - Classe : Magnoliopsida
    - Type : Magnolia (*Magnolia grandiflora*)
    - Espèce : Érable (*Acer pseudoplatanus*)
    - Type : Trèfle (*Trifolium pratense*)
Tribu : Fougères
- Classe : Fougère vraie
  - Espèce : Fougère fougère (*Pteridium aquilinum*)
  - Type : Fougère royale (*Osmunda regalis*)
  - Espèce : Fougère rayée (*Asplenium trichomanes*)
- Classe : Fougères mousseuses
  - Espèce : Selaginella (*Selaginella lepidophylla*)
  - Type : Mousse de printemps (*Fontinalis antipyretica*)
  - Type : Hornmoss (*Anthoceros agrestis*)

Royaume : Champignons
- Tribu : Basidiomycètes
  - Classe : Champignons
    - Type : Champignon (*Agaricus bisporus*)
    - Espèce : amanite mouche (*Amanita muscaria*)
    - Espèce : Champignon porcini (*Boletus edulis*)
  - Classe : Champignons de la rouille
    - Espèce : rouille du blé (*Puccinia graminis*)
    - Espèce : Poire à grille (*Gymnosporangium sabinae*)
    - Type : rouille des bulles du pin (*Cronartium ribicola*)
- Embranchement : Ascomycètes
  - Classe : Levure
    - Type : Levure de boulanger (*Saccharomyces cerevisiae*)
    - Espèce : Levure de bière (*Saccharomyces pastorianus*)
    - Espèce : Candida (*Candida albicans*)
  - Classe : Champignons truffiers
    - Espèce : truffe noire (*Tuber melanosporum*)
    - Espèce : Truffe whitehe (*Tuber magnatum*)
    - Type : truffe du désert (*Terfezia claveryi*)

porthd-timezone : Conversion des fuseaux horaires à l'aide de JavaScript

2025-06-01T12:00:00Z

porthd-vcard : Créez une VCard pour les informations de contact, par exemple dans les mentions légales.

Dr. Dieter Porth

Dr. Porth;Dieter;;;

info@mobger.de

+49 161 99180688

+49 421 51483548

Fichier avec rendez-vous pour le planificateur extrait des données HTML

Aucun message d'erreur

87654321@exemple.com

20240329T120000Z

20240401T090000Z

Ma réunion privée

VEVENT

87654323@exemple.com

20240329T120000Z

20240401T090000Z

La réunion de suivi

Avec message d'erreur

87654321@exemple.com

20240329T120000Z

20240401T090000Z

Ma réunion

VEVENT

20240329T120000Z

20240401T090000Z

Mon deuxième rendez-vous