De nombreuses personnes ont proclamé que ChatGPT peut écrire nos essais, peindre nos images et répondre à nos requêtes de recherche. Mais peut-il aussi coder ?
L'une des plus grandes revendications du battage médiatique autour de ChatGPT est qu'il peut être un outil de programmation efficace. L'idée est la suivante: vous décrivez ce que vous voulez en langage naturel; le chatbot génère du code qui fait exactement cela. Mais à quel point ChatGPT est-il vraiment bon pour faire cela ?
Quoi de mieux pour le savoir que de le tester? Nous avons demandé à ChatGPT de créer une application Web simple à partir de zéro. Voici le résultat de notre test et les étapes que vous pouvez utiliser pour créer un site Web à partir de zéro en utilisant ChatGPT.
Étape 1: Génération du Blueprint pour votre application Web
Tout comme vous le feriez lors de la création d'une application Web avec n'importe quel outil, vous devez établir le plan de ce que vous voulez que votre application ressemble et les étapes dont vous aurez besoin pour la construire avant de laisser ChatGPT exécuter le montrer.
Pour notre première tâche, nous avons demandé à ChatGPT de développer un plan pour une application de chat simple. Pour ce faire, nous avons décrit les exigences de notre application Web, puis avons demandé au chatbot de détailler un plan de développement de l'application.
Après avoir utilisé l'invite ci-dessus, voici le résultat obtenu :
Vous devez avoir le plugin "Show Me" activé sur votre compte ChatGPT pour générer un organigramme comme le nôtre ci-dessus. Tu peux installer et utiliser les plug-ins ChatGPT en quelques étapes seulement, même si vous aurez besoin d'un abonnement premium.
Sans le plugin, vous obtiendrez un plan basé sur du texte ou un organigramme ASCII-art. C'est toujours bien. Même sans le plugin, ChatGPT devrait toujours fournir un plan clair de l'application comme dans l'exemple ci-dessous.
Étape 2: Diviser le Blueprint en modules plus petits
Maintenant que nous avons une vue d'ensemble, nous avons demandé à ChatGPT de nous aider à diviser l'application en composants plus petits que nous pouvons développer séparément, puis intégrer pour former l'application Web complète. ChatGPT a suggéré de le diviser en trois composants :
- Module d'inscription
- Module de connexion
- Module de discussion
Nous avions d'autres idées, mais le but ici est de laisser ChatGPT décider.
1. Construire le composant d'enregistrement
Nous avons sauté directement dans la construction du composant d'enregistrement. Nous avons demandé à ChatGPT de dessiner un algorithme approprié. Ici, nous sommes intervenus en précisant que nous n'avions besoin que du nom d'utilisateur, de l'e-mail et de l'avatar de l'utilisateur pour l'enregistrement. Voici l'invite :
Et voici le résultat :
Ensuite, nous avons invité ChatGPT à créer le composant d'enregistrement.
Bien que nous n'ayons pas inclus le champ du mot de passe dans le cadre du processus d'inscription, ChatGPT a fait le bon choix en l'incluant dans le code HTML généré. Nous avons copié le code sans aucune modification, et voici à quoi il ressemble sur un navigateur.
Ensuite, nous avons invité ChatGPT à générer le script d'enregistrement PHP. Au début, nous avons demandé "Écrire un code PHP pour la logique côté serveur pour gérer la soumission du formulaire". Bien que le script généré ait bien fonctionné, il présentait de nombreuses vulnérabilités.
Il n'y avait pas de hachage de mot de passe, pas de gestion des erreurs et était sujet à l'injection SQL - ChatGPT ne faisait que le strict minimum. Réparer cela a été relativement facile. Nous avons simplement demandé à ChatGPT "d'identifier tout ce qui ne va pas avec le code que vous venez de générer, puis utiliser les points identifiés pour optimiser le code." Avec cela, notre script d'enregistrement PHP était prêt à aller.
Le libellé de votre invite est important. Vous devez être très clair et précis sur ce que vous voulez que ChatGPT fasse. Lorsque nous lui avons simplement demandé de "résoudre le problème avec ce code", cela n'a pas résolu la plupart de ce que nous espérions qu'il résoudrait. Pour plus de conseils sur l'écriture d'invites ChatGPT, voici quelques endroits pour apprendre à écrire des invites efficaces.
Ensuite, nous avons demandé à ChatGPT de "Écrivez un code SQL pour créer une base de données pour les données capturées dans le script PHP." Voici le code SQL résultant :
Et voici la table créée en exécutant le SQL :
Avec la base de données configurée, nous avons essayé notre premier enregistrement, et cela a fonctionné sans aucune erreur.
2. Construire le composant de connexion
Avec le composant d'enregistrement à l'écart, nous avons pris en charge le composant de connexion. Étonnamment, c'était le plus facile à construire malgré la logique supplémentaire de gestion des sessions.
Voici la page de connexion générée. Un point fort est qu'il utilise les mêmes options de couleur que la page d'inscription.
Après avoir créé un fichier "server.login.php" comme indiqué par ChatGPT et ajouté le script PHP généré, nous avons réussi notre première connexion sans aucune modification ni débogage.
3. Construire le composant de chat
La construction du composant de chat était la partie finale - et probablement la plus difficile - de notre petite expérience. Au début, nous avons simplement demandé à ChatGPT d'écrire le code du composant de chat. Inutile de dire que ce fut un échec colossal. Pour les composants plus complexes de tout ce que vous voulez créer, vous devrez le diviser en composants plus petits et les aborder les uns après les autres.
Nous avons demandé à ChatGPT des suggestions sur la division du composant de chat, et il nous a suggéré de créer trois pages :
- Chat.php
- Envoyer-messages.php
- Récupérer-messages.php
Lorsque ChatGPT suggère un nom de fichier, l'utilisation d'un nom différent dans votre projet peut entraîner par inadvertance problèmes car le chatbot référencera le même nom dans tout le code qu'il crée tout au long du projet. Nous avons découvert à la dure. Ne faites pas la même erreur.
Création de la page Chat.php
Pour commencer, nous avons donné à ChatGPT des instructions détaillées sur l'apparence de l'interface de chat.
Après avoir exécuté le code HTML généré, nous avions une interface de chat sans boîte de saisie de message. Pour résoudre ce problème, nous avons simplement invité ChatGPT à "réécrivez le code pour inclure une zone de saisie de message et un bouton d'envoi." Voici à quoi ressemble le code généré sur un navigateur lors du deuxième essai.
Chaque fois que le code généré ne donne pas les résultats souhaités ou omet un composant important, demandez simplement à ChatGPT de réécrire le dernier code. Dites-lui d'inclure le composant ou de faire ce qui n'a pas été fait dans le code initial. Voici quelques conseils sur l'utilisation de ChatGPT pour la programmation.
Création de la page "send-messages.php" et "Fetch-messages"
Satisfaits de l'interface, nous avons procédé à la construction du script pour gérer la logique de chat. Pour pouvoir envoyer et récupérer des messages de la base de données, ChatGPT a souligné à juste titre que nous aurons besoin d'une table "messages". Nous avons demandé au chatbot de créer un SQL pour la table des messages.
Après avoir généré un code SQL, nous avons demandé au chatbot de générer un script PHP pour gérer la logique de messagerie.
ChatGPT a généré le script pour les pages "send-messages.php" et "fetch-messages.php". En exécutant les deux scripts, nous avons finalement eu notre toute première erreur (ce qui était étrangement satisfaisant). Aller aussi loin dans le projet sans déboguer une seule ligne de code semblait un peu trop beau pour être vrai, malgré sa relative simplicité.
Il s'avère que l'erreur a été causée par ChatGPT introduisant une vérification d'une variable de session non déclarée ($_SESSION['identifiant_utilisateur']) dans notre script. Nous soupçonnons que cela est dû à une pause assez longue du projet, ce qui a fait que ChatGPT a oublié certains des contextes et des noms des variables utilisées dans le projet.
Lorsque vous utilisez ChatGPT pour créer une application, assurez-vous d'utiliser le même fil de discussion et essayez de terminer les composants associés dès que possible. L'utilisation d'un nouveau fil de discussion ou une longue pause peut introduire des incohérences. ChatGPT a tendance à oublier certains détails du projet en cours (par exemple, le jeu de couleurs) si vous faites de longues pauses entre les sessions de codage.
Cela dit, nous avons corrigé le bogue et déployé le code. Nous nous sommes inscrits, connectés et avons essayé la fonction de chat. Bien que nous ayons pu envoyer des messages d'un utilisateur enregistré à un autre, la couleur et la disposition des bulles de message étaient un peu décalées. Cependant, pour une application qui a pris une heure et 23 minutes, nous ne la jugerons pas trop sévèrement.
ChatGPT: un excellent assistant de codage
ChatGPT est clairement un puissant assistant de codage. Le fait que le chatbot puisse générer un code impressionnant à partir d'instructions simples et parfois pas si claires témoigne de ses prouesses en matière de codage.
Bien sûr, il a encore beaucoup de défauts. Le problème avec une fenêtre contextuelle limitée et sa capacité à lier la logique de plusieurs composants construits indépendamment est un problème majeur. Cependant, le chatbot peut vous aider à créer rapidement des applications Web assez complexes si vous vous y connaissez.
