Cursor AI : conception de sites web avec codage IA pour les débutants absolus | Créer des sites web sans coder

1. Introduction: C'est l'une des meilleures choses que vous puissiez apprendre pour votre avenir. C'est votre chance de passer au niveau supérieur pour apprendre quelque chose qui améliorera considérablement votre vie. Et c'est le Vibe Coding. Le codage Vibe signifie simplement créer des sites Web et des applications en utilisant l'IA, l'intelligence artificielle Vous l'imaginez, vous le décrivez en termes simples, puis vous l'obtenez. La plateforme crée automatiquement tout le code, vous n'avez donc pas à apprendre Python, Javascript ou quoi que ce soit d'autre. Nous allons utiliser Cursor, qui est l'une des meilleures plateformes de codage Vibe du marché. Cursor, c'est comme avoir une équipe de développeurs seniors disposant de toutes les connaissances du monde à portée de main 24 heures sur 24, 7 jours sur 7. Pas de temps libre, prêt à construire avec ce que vous voulez. Et tout cela avec un abonnement assez abordable. Vous n'avez pas besoin d' expérience préalable ni de savoir coder. Ce cours est adapté aux débutants, et nous allons le suivre étape par étape. Dans le passé, la création de tout type de site Web ou d'application impliquait des milliers, voire des dizaines de milliers de dollars, semaines et des mois de développement et toute une équipe de personnes. Désormais, tout se trouve sur une seule plateforme. codage VBE est le meilleur moyen pour la plupart des gens de créer un revenu solide et fiable. Vous pouvez utiliser le codage Vibe pour obtenir un meilleur emploi en tant que freelance ou pour démarrer une entreprise Et je le répète, sans être technique, sans savoir comment écrire du code, c'est le futur dès maintenant. Dans ce cours, nous allons créer un site Web à partir de zéro, et nous allons le lancer sur notre propre domaine étape par étape à l'aide de l'IA. Cela ne va cependant pas être facile. Je ne vais pas te promettre tout le monde. Ça va être frustrant parfois, et c'est parce qu' il est trop tôt. Mais votre principal avantage est d'arriver tôt. Imaginez que vous investissiez dans Apple il y a 20 ans ou que vous achetiez du Bitcoin à ses débuts. Bien sûr, il y aura de l'incertitude, des problèmes, des bugs, mais n' attendez pas que cela se généralise. C'est ta chance en ce moment. Dans ce cours, je vais vous expliquer ce que vous devez savoir venez de démarrer et de lancer premier site Web en un rien de temps. Je vais vous apprendre en anglais simple ce que tout signifie : IA, LLM, modèles, MCP, tout Je suis designer, et si vous avez déjà suivi mes cours de design, vous savez que je me concentre sur l'obtention de résultats rapides, sans aucune théorie ennuyeuse. Je ne vais pas vous remplir la tête avec des tonnes de termes et de concepts compliqués. Non, je me concentre plutôt sur des exemples et des exercices amusants. Investissez dans votre avenir. Commencez dès aujourd'hui. N'attendez pas maintenant, c'est là que vous avez le plus grand avantage. 2. Qu'est-ce que le codage curseur et vibrant ?: Bon retour. Dans ce cours, nous allons utiliser le curseur pour viber le code Mais qu'est-ce que le codage par curseur et qu'est-ce que le codage par vibration, n'est-ce pas ? Donc, tout d'abord, le curseur est une plateforme. C'est un programme qui vous aide à créer des logiciels grâce à la puissance de l'IA, et ce, sans savoir comment coder. La société à l'origine de Cursor, AI Sphere, vient de lever 900 millions de dollars une valorisation de 9 000 000 000 milliards de dollars Ce sont des chiffres insensés. C'est l'une des choses les plus sexy du moment. C'est 20 dollars par mois au moment de cet enregistrement, de toute façon Et ce que vous obtenez en retour change complètement la donne. Avec Cursor, vous travaillez côte à côte avec une intelligence artificielle qui comprend votre projet, suit vos instructions et construit votre projet presque comme par magie. Tu écris ce que tu veux. C'est ce qu'on appelle le prompt. Peut-être décrivez-vous ce que le projet devrait faire. Ensuite, l'IA prend le relais et fait le gros du travail. Mais simplifions-le. Que pouvez-vous réellement intégrer dans le curseur ? Eh bien, tout d'abord, les applications mobiles, à la fois pour IOS et Android, tout comme les applications que vous voyez dans l'App Store ou sur Google Play. Vous pouvez créer n'importe quoi, qu'il s' agisse d'un bilan de condition physique , d'une application de chat ou d'un outil de finances personnelles, mais pour être honnête, à ce stade, vous devriez viser des applications plus petites Ensuite, vous pouvez créer des sites Web, tout type de présentation, des sites Web, des pages de destination, des portfolios, des blogs personnels, des pages de destination, par exemple, est absolument fantastique pour les produits, les startups, les événements, tout réactif et propre. C'est donc une bonne façon de procéder. La prochaine étape consiste à créer des produits SAS. CAS signifie logiciel en tant que service. Cursor peut vous aider à tout construire à ce sujet. Le front-end, le back-end, la base de données, tout le reste, et les plateformes CAS sont omniprésentes. Nous avons quelques exemples à l' écran. Les plateformes CAS sont fantastiques car elles l' un des meilleurs moyens de gagner de l'argent. Ensuite, vous pouvez créer des plugins, des outils tels que des extensions Chrome, robots Discord ou peut-être des outils spécifiques pour votre équipe ou votre entreprise, ou d'un autre côté, vous pourriez opter pour des plugins WordPress, n'est-ce pas ? S'il se trouve dans un navigateur ou s'il fonctionne en ligne, il y a de fortes chances que vous puissiez le créer avec un curseur. Et voici la grande idée. Le curseur se connecte donc directement aux modèles d' IA les plus intelligents au monde. Cela signifie donc qu'il sait comment écrire Python, JavaScript, react, next JS, tailwind, tapescript, note, C'est comme avoir une équipe de développeurs seniors disponible 24 heures sur 24 et 7 jours sur 7 avec un nombre infini de patients prêts à coder ce que vous voulez sur place. Vous lui dites ce que vous voulez, et il commence à coder. Vous passez en revue les résultats, vous les vérifiez, puis vous leur donnez du feedback, et cela s'améliore constamment. C'est sans que vous sachiez coder, parlez en anglais simple. C'est l' essentiel. Alors imaginez ça. Vous avez une idée de produit, est-ce pas, un plugin, une application, une plateforme, un site Web, n'est-ce pas, quelque chose qui résout un problème que vous rencontrez peut-être depuis quelques années. Normalement, vous aurez besoin de plusieurs mois de développement. Vous auriez besoin d'une équipe, d'un budget, de réunions interminables, non ? Mais avec le curseur, il suffit de décrire l'idée. Et en quelques minutes, vous avez quelque chose de réel, quelque chose de fonctionnel, quelque chose que vous pouvez tester, améliorer, puis peut-être même lancer après un certain travail. C'est du Vibe Coding Le codage Vibe consiste donc à dire Cursor ce que vous voulez faire dans un langage clair et simple, en anglais clair, puis la plateforme l'exécute Et c'est ce qui rend le curseur si puissant. Cela ne vous aide pas à écrire du code. Il vous aide à créer des produits, résoudre des problèmes et à passer de l'idée à l'exécution plus rapidement que jamais. OK, veuillez télécharger la pièce jointe et utiliser le lien pour vous inscrire à Cursor. Alors inscrivez-vous, téléchargez, et je vous verrai dans une seconde. Nous allons l' installer ensemble. Mais maintenant, faisons une petite pause. 3. Vous installez Cursor et définissez vos attentes: Bon retour. L'installation du curseur est assez facile car il ne s'agit que d'un simple programme. Il ne se passe rien de spécial. Veuillez donc suivre les mêmes étapes et cocher les mêmes cases. Pendant que je travaille en arrière-plan, laissez-moi définir vos attentes. Nous sommes en avance. Les choses évoluent rapidement. Chaque semaine environ, il y a de grandes nouvelles, des améliorations, et c'est un peu inconfortable. De nouvelles fonctionnalités sont en train de sortir, et je suis sûr que ce cours sera dépassé, même si je vais faire de mon mieux pour le maintenir à jour. Maintenant, mon objectif est de vous apprendre à apprendre et à utiliser ces outils. Je vais vous enseigner des principes, et c'est là la véritable valeur de ce cours. Mais revenons aux changements et améliorations constants. C'est le prix à payer pour être en avance. Il faut beaucoup de patience. Vous devez laisser la frustration vous envahir. Et c'est parce que tu vas rester coincé. Je te le promets. Et il ne s'agit pas de mon cours, mon style d'enseignement ou de mes connaissances. Vous savez, j'ai personnellement eu d'innombrables cas où le guide officiel disait de cliquer sur le bouton bleu, mais il ne s'agissait que de boutons rouges. Ou le guide disait de cliquer sur le bouton Enregistrer, mais il n'y avait aucun bouton de sauvegarde. C'est tellement frustrant. J'ai eu des problèmes où je ne pouvais plus travailler à cause de problèmes avec mon VPN. Mais je n'utilise pas de VPN. J'ai suivi toutes les étapes officielles et je me suis toujours retrouvée confrontée à un problème que personne d'autre n'avait. J'ai utilisé trois ordinateurs différents, j'ai eu trois problèmes différents, et je pouvais continuer pendant des lustres. Cela vous arrivera forcément aussi. Maintenant, mon conseil, utilisez le guide de la pièce jointe pour obtenir de l'aide. La plupart du temps, la réponse courte est vous devrez faire beaucoup de recherches et de réparations vous-même. Je suis là pour t'aider. Vous pouvez compter sur moi, mais certains problèmes seront spécifiques à votre situation, à votre ordinateur et à votre projet, et vous aurez besoin de patience. Mais quel est l'avantage ? Quel est l'avantage d'être si tôt ? Nous comprenons les inconvénients. Quel est l'avantage ? Eh bien, vous avez une longueur d' avance dans la course, que ce soit pour le travail, le travail indépendant ou la création d'une entreprise C'est énorme. Tu apprends de tes erreurs. Vous voyez des problèmes courants et vous prenez de l'avance. Comme je l'ai dit, c'est comme investir dans Apple il y a 20 ans. Personne ne savait que ce serait un tel succès. Mais ici, je vous le promets, il n'y a rien de plus important que le Vibe Coding Et tout est entre tes mains. Vous pouvez créer des choses incroyables, ou vous pouvez les remettre à plus tard. Vous pouvez attendre que les choses soient super claires, super faciles pour tout le monde. n'y a plus de problèmes, plus de bugs, plus de frustration. Mais vous aurez alors 100 fois plus de concurrents parce que tout le monde va le faire. C'est donc aussi simple que cela. Si vous investissez maintenant dans Apple ou Bitcoin, sûr, vous pourriez bien vous en sortir. Mais si vous aviez été là au début, les récompenses auraient été infiniment plus élevées Alors, s'il vous plaît, comprenez pourquoi vous allez souffrir et vous aurez des maux de tête et beaucoup de frustration. C'est pour ton futur. Et si vous pouvez y faire face, si vous pouvez continuer à persévérer, si vous pouvez continuer à persévérer, la récompense sera énorme. Si vous pouvez continuer à travailler à fond, les récompenses seront énormes. C'est pourquoi j'aime tant le vibe coding. C'est exactement le bon niveau de difficulté. Si c'était trop difficile, ce serait du codage classique, n'est-ce pas, quatre à six ans d'études, de travail, d'apprentissage, junior, de montée de niveau, lentement très difficile, Mais si c'était trop facile, tout le monde le ferait. La récompense serait donc quasiment nulle. C'est donc juste au milieu. C'est une offre fantastique. C'est le bon niveau de difficulté. Revenons-en à l'esprit. Encore une fois, vous n'allez pas vraiment coder. Vous n'avez pas besoin de connaître la programmation d'aucune sorte. Vous devrez penser de manière logique et expliquer clairement ce que vous pensez, ce que vous voulez faire Et c'est une compétence que vous allez devoir développer tout au long de ce cours et en vous entraînant. Mais vous ne coderez pas, vous ne lirez pas vraiment le code. Vous n'êtes pas censé comprendre tout ce qui se passe dans Cursor. Non L'un des principes clés que je veux vous enseigner est le suivant : vous pouvez passer toute la journée, par exemple, créer des mèmes, à créer des images amusantes à partager avec vos amis, ou d'un autre côté, vous pouvez créer une plateforme qui permet aux gens de créer des mèmes Et ensuite, sur cette base, vous pouvez créer une source de revenus. Tout dépend de votre concentration, endroit où vous vous concentrez et de la manière dont vous trouvez des idées. Je vais faire une conférence à ce sujet, alors restez connectés. Mais oui, ce sur quoi vous vous concentrez est l'une des choses les plus importantes. Tu dois te fixer les bons objectifs et les bonnes ambitions. Oui, pour l'instant, le curseur est installé. Nous avons une interface sombre et nous sommes sur le point de créer notre premier projet. Maintenant, une dernière chose. Je vais simplifier beaucoup de choses que ce soit facile à comprendre. Si par hasard vous êtes un codeur avec beaucoup de connaissances d'expérience, sachez que lorsque vous dites que le curseur est un fork du code VS, cela n' aide pas vraiment beaucoup de monde ou que vous dites quelque chose comme ouvrir votre terminal et exécuter ce script Python rapide. Encore une fois, c'est un peu accablant pour la plupart des gens. Je ne vais pas faire ça. Il se peut que je simplifie à l'excès certaines choses, mais ce cours s'adresse aux personnes qui ne sont pas techniques, et je pense que c'est la meilleure façon de procéder OK, je vais te voir dans une seconde. 4. Notre premier site web piloté sur Cursor: Bon retour. Créons notre premier site Web dans Cursor. Avant de commencer, regardez cette conférence deux fois. La première fois, il suffit regarder et de voir ce qui se passe. Puis revenez en arrière depuis le début et faites une pause pour continuer. Vous devrez faire une pause assez souvent. S'il vous plaît, n'essayez pas de vous embrouiller lors de votre première visite. Tu ne pourras pas suivre le rythme. Encore une fois, regardez deux fois, et la deuxième fois, faites une pause aussi souvent que nécessaire. OK, lançons le curseur et attendons quelques secondes jusqu'à ce qu'il se charge. L'étape suivante est ce que vous allez faire chaque fois que vous souhaitez démarrer un nouveau projet, savoir créer un nouveau dossier. Tous nos projets doivent être organisés dans des dossiers, un site Web, un dossier. Ouvrons donc notre ordinateur et créons-en un nouveau. Si vous n'utilisez pas Windows, essayez d' éviter la partition C, le lecteur C, car cela peut créer des problèmes. OK, appelle-le comme tu veux. Je vais utiliser portfolio, mais le nom n'a pas vraiment d'importance. Bien sûr, le dossier sera totalement vide, non ? Ensuite, revenez au curseur, agrandissez-le pour qu'il occupe tout l'écran, et maintenant nous allons ouvrir ce dossier. Rien de spécial pour l'instant, mais c'est ainsi que l'on démarre un nouveau projet dans le curseur. Et puis, joint au cours, vous allez avoir un fichier texte avec une invite, avec une tâche. C'est ce que nous voulons construire, et c'est quelque chose de très basique. C'est donc ce que nous allons coller ici à droite dans ce champ. Maintenant, après avoir collé Control V, n'appuyez pas sur Entrée. Tout d'abord, nous sommes en mode agent. Cela signifie que l'IA va créer tout le code pour nous. Nous n'allons rien utiliser d'autre, donc tout est automatique. Ensuite, à partir de ce travail, je vais utiliser Gemini 2.5 P. Veuillez utiliser le même ou, s'il n'est pas disponible pour une raison quelconque, l'une des autres options répertoriées à l'écran Je vais tout expliquer en détail plus tard. Donc, s'il te plaît, continue pour l'instant. OK, voici la tâche. C'est ce qui suit. Créez une page d' accueil de portfolio de modèles pour moi, Chris Barron 36 ans de Bucarest en Roumanie Avoir 14 ans d'expérience dans le design. Je suis un formateur certifié Adobe et je suis spécialisé dans la conception de sites Web et d'applications. Je préfère un schéma de couleurs rouge et noir, belles animations et une section portfolio composée de cinq catégories. Utilisez des images de substitution pour le moment. Il s'agira d'une page unique avec un menu principal en haut qui vous mènera à la section sur laquelle vous cliquez. L'adresse de mon bureau est la suivante. Et s'il vous plaît, ajoutez-moi vos critiques. Ajoutez un formulaire de contact pour que les gens puissent m'envoyer un message et afficher mon numéro de téléphone, ainsi que mes profils de réseaux sociaux. Utilisez les meilleures pratiques pour créer cette page de destination. OK, de bonnes choses. Veuillez effectuer la même tâche, mais sachez qu'il est tout à fait normal que votre design soit différent. Ce n'est pas un problème. C'est ainsi que fonctionne l'IA. Maintenant, au cas où cela ne fonctionnerait pas du tout, passez à la prochaine conférence où nous allons tout configurer, puis vous pourrez revenir et réessayer. OK, maintenant, une fois que nous avons appuyé sur Enter, nous partons pour les courses. Remarquez cette zone ici. Cela indique qu'il génère. Cela signifie que cela fonctionne. Ici, au cas où vous voudriez l'arrêter, vous pouvez utiliser ce bouton, mais vous ne le ferez pas vraiment. Dans ce panneau, vous pouvez voir comment pense le modèle, et certains modèles sont très descriptifs. Ils expliquent tout en détail. D'ailleurs, modéliser avec l' IA, c'est pareil. Ici, ce gris très délavé nous indique ce que pense le mannequin. Et au bout d'un moment, une nuance de texte différente apparaît. Celui-ci est plus facile à lire. Faisons donc une pause. Donc, en gros, nous avons un texte délavé qui est difficile à lire. Telles sont les pensées du mannequin. Et puis ce texte, c'est la vraie réponse. C'est comme être capable de lire dans pensées de quelqu'un, et c'est fascinant. OK, maintenant, l'IA dit que cela va commencer par un fichier d'index. Et à partir de là, nous pouvons nous assurer que l'IA a bien compris la tâche. OK, des trucs géniaux. Maintenant, après quelques secondes de plus, le fichier d'index apparaît à deux endroits. Sur le côté gauche, nous pouvons voir où sont répertoriés tous les fichiers du dossier que nous avons créé précédemment. Il était vide. Il contient maintenant un nouveau fichier, un fichier d'index. OK. Et dans la partie centrale de l'écran, nous pouvons voir le contenu de ce fichier. Mais voilà le truc. 99 % du temps, vous allez vous concentrer sur le bon côté. OK. Maintenant, la tâche suivante est le CSS. Cela permettra de styliser le code. Cela lui donnera une meilleure apparence, pour ainsi dire. Maintenant, cela va prendre quelques secondes, mais veuillez noter que je vais accélérer l'enregistrement car cela prend parfois un certain temps. Pas mal de minutes. OK, voyons maintenant ce qui va suivre. fichier JavaScript. OK, il y a des trucs. Nous n'avons pas à suivre. Nous pourrions simplement prendre une tasse de thé, mais c'est une bonne idée de voir comment les AA pensent et fonctionnent. OK, c'est vrai. Nous pouvons voir que nous avons quelques instructions. Elles sont pour nous. Ce sont des choses que nous devons faire pour terminer le projet. C'est comme ajouter des images. Comme nous n'en avons pas fourni, le site Web sera complètement vide, n'est-ce pas ? Et le formulaire de contact ne fonctionnera pas réellement car il n'est connecté à rien. Mais c'est très bien, pour le premier exercice. Allons de l'avant. Et nous y voilà. L'IA s'est finalement arrêtée. Vous pouvez voir qu'il n'est plus question de générer, et nous avons un nouveau bouton qui dit « Tout accepter ». Alors, cliquons dessus. C'est ainsi que nous nous engageons. C'est ainsi que nous pouvons sauvegarder nos progrès. Bien sûr, nous pourrions éventuellement lire ce résumé, mais en bref, il indique qu'une version de base du site Web est terminée et que nous pouvons le lancer en utilisant le fichier d'index. OK, retournons au dossier et ouvrons ce fichier. Je vais utiliser Firefox pour l'ouvrir, mais vous pouvez utiliser n'importe quel navigateur. Et jetons-y un coup d'œil. Voici notre charmant site web. Maintenant, est-ce absolument magnifique, magnifique ? Non, bien sûr, mais cela nous a pris quelques minutes et nous avons de quoi travailler. Comme nous n'avons fourni aucune image, l'IA ne téléchargera rien depuis le Web. Donc évidemment, le site Web semble un peu vide. Mais elle a suivi toutes les instructions du fichier texte, et l'IA a indiqué qu'elle avait optimisé le design pour une utilisation mobile. Faisons donc un clic droit et choisissons Inspec. Dans Firefox, le bouton que je recherche est celui-ci. Au cas où vous ne le trouveriez tout simplement pas, redimensionnez simplement votre navigateur à la taille d'un téléphone portable Mais oui, ça marche aussi bien sur un téléphone . Aucune surprise ici. C'est le pouvoir du Vibe Coding. Vous pensez à quelque chose, vous le tapez, puis après avoir appuyé sur Entrée, en quelques minutes, vous l'obtenez. Ce n'est peut-être pas parfait, mais nous pouvons en tirer parti. Alors, passons réellement à une autre étape. Changeons le schéma de couleurs. Disons qu'il fait trop sombre à mon goût, non ? Alors changeons-le en bleu et blanc. Je vais demander à l' IA de faire exactement cela. Vous devez être naturel dans votre langage. Vous n'avez pas besoin d'utiliser de termes techniques. L'IA le comprend et commence à modifier le fichier CSS. Maintenant, faites une courte pause. Lorsque vous voyez des lignes rouges, cela signifie que ces pièces vont être supprimées. Et dans ce cas, ce sont les anciennes couleurs. Et ces lignes verdâtres ne sont pas vraiment vertes, elles sont verdâtres, ce sont les nouvelles Tout a donc du sens. Quand ce sera fait, je vais appuyer à nouveau sur Accepter. Vous allez devoir le faire constamment, d'ailleurs. Maintenant, nous pourrions potentiellement lire le résumé, mais revenons simplement au navigateur et actualisons-le. Et oui, il est maintenant blanc et bleu. Nous sommes toujours en mode mobile, mais c'est très bien. Nous pouvons aller sur le site Web et cliquer avec le bouton droit de la souris. Choisissez à nouveau inspecter, puis nous devrons cliquer sur le même bouton qu' auparavant pour revenir en mode bureau. Ou nous pourrions simplement le fermer et l'ouvrir à nouveau. Mais oui, on va bien. L'IA nous a donné un nouveau schéma de couleurs claires. Tout est beau et propre, rien de spécial. Mais oui, c'est plutôt cool. Faisons une dernière étape. Ajoutons une carte au lieu d'une adresse. Voyons donc comment l' IA gère cela. Comme vous allez le voir dans ces leçons, il existe un certain nombre de limites. L'IA ne peut absolument pas implémenter tout ce à quoi vous pouvez penser. Mais une carte, ça devrait pouvoir faire l'affaire. Alors, jetons-y un coup d'œil. N'oubliez pas de toujours appuyer sur Accepter. Ensuite, lorsque vous êtes dans le navigateur, vous pouvez utiliser l'icône d'actualisation. Vous pouvez utiliser le raccourci F cinq ou le raccourci clavier, ou c'est à vous de choisir. Et oui, il s'agit d'une carte entièrement fonctionnelle que vous pouvez utiliser. Vous pouvez zoomer ou dézoomer. Et c'est génial. C'est du Vibe Coding. Vous l'imaginez, vous le décrivez, vous comprenez. Ensuite, il s' agit de l'affiner. Donc c'est plutôt comme si tu l'avais imaginé. Ce que je veux que tu fasses maintenant c'est créer ta propre version, commençant par mon fichier texte. Créez donc un nouveau dossier sur votre ordinateur. Cliquez ensuite sur le curseur pour accéder au menu supérieur et utilisez Ouvrir le dossier. C'est aussi simple que cela de démarrer un tout nouveau projet. Remplacez mon nom dans le fichier texte, modifiez quelques détails, puis créez-le. Lorsque vous avez terminé, prenez une capture d'écran de l'ensemble du design et publiez-la pour que je puisse le voir. Maintenant, avant de terminer, pour certaines personnes, cela peut ne pas fonctionner. Le curseur peut vous donner diverses erreurs, problèmes. Il se peut qu'il cesse de fonctionner. Il peut vous demander d'installer des éléments, et c'est très bien. Nous ferons toute cette configuration très bientôt, puis vous pourrez revenir à cette conférence. Donc, si vous n'avez pas de site Web, laissez un commentaire pour que je sache à quel problème vous êtes confronté, puis passez à la prochaine conférence. Ne soyez pas déçus. N'oubliez pas, amusez-vous bien avec. 5. Que pouvez-vous construire avec le codage vibe dans Cursor: Chris, que dois-je construire ? J'ai compris. Je sais que vous n'êtes peut-être pas un entrepreneur doué, mais laissez-moi vous aider avec quelques idées rapides. Maintenant, avant cela, je dois vous dire une chose importante. L'exécution est essentielle. Les idées ne valent rien. Je vais le répéter. Tout tourne autour de l'exécution. Ce n'est pas la qualité de l'idée. Je vais développer le sujet, alors commençons par ce site Web. Je suis lovemg.com, non ? Ce site Web réduit vos images. Si vous avez déjà travaillé avec Photoshop, par exemple, vous savez que cela peut parfois vous donner des fichiers de grande taille, comme deux, trois ou 5 mégaoctets, Maintenant, avec cette plateforme, vous glissez et déposez les images, et c'est tout. Vous réduisez leur taille de 80 % sans perdre en qualité. Et cela peut également vous aider à redimensionner rapidement les images. Encore une fois, glissez, déposez, et c'est tout, non ? Et vous avez quelques autres fonctionnalités ici. Mais le prix est de quatre à sept dollars par mois. Ce n'est rien Même moi je me suis inscrit. C'est donc une idée. Et voici une plateforme qui transforme votre PDF en fichier Excel, afin que votre comptable puisse l'utiliser plus facilement. C'est une super niche, non ? C'est uniquement pour un groupe restreint de personnes, mais cela rapporte 38 000 dollars par mois, 38 000 dollars Des trucs dingues. Et c' une autre qui fonctionne très bien. Cela renomme toutes vos photos, et c'est tout. Le tout. C'est l'ensemble de la plateforme. Donc, au lieu de les appeler IMG 010203, cela leur donne un nom propre, ce qui est génial pour les cas où vous partez vacances et que vous avez des milliers de photos qui traînent, n'est-ce pas ? Encore une fois, il s'agit d'un service très spécifique. Ensuite, utilisons ce poly.com, qui vous permet de publier et de planifier votre contenu sur tous vos réseaux sociaux Cette plateforme compte une seule personne, un seul homme gagne plus d'un million de dollars australiens par an, mais maintenant qu'il s'appelle Channel se , faisons une pause. Ce ne sont pas des idées incroyables. Ils ne viennent pas de génies du monde des affaires, n'est-ce pas ? Ce sont des gens ordinaires qui ont eu une idée. Ils avaient un problème, et ils l'ont résolu. Ils ont mis en œuvre cette idée, et ils l'ont bien fait. Il existe peut-être 50 autres plateformes comme Poly, par exemple. Donc plus cher, d'autres moins cher. C'est pourquoi j'ai dit que tout tournait autour de l'exécution. Et mon conseil, concentrez-vous sur le côté design. Prenez quelque chose qui a déjà été fait 100 fois auparavant, ajoutez-y un beau design, une petite touche d'originalité, et vous vous lancez dans une entreprise. Bien sûr, vous devez toujours en faire la promotion. Vous devez faire de la publicité, mais c'est une autre histoire. Maintenant, permettez-moi de continuer avec quelques autres exemples , un peu plus haut. Voici donc la caméra de base, une plateforme apparemment compliquée qui se concentre sur une seule chose : les messages. Cela vous permet essentiellement de créer une liste de tâches d'une manière très similaire à Notion. Bien entendu, ces plateformes offrent bien plus que cela, beaucoup plus de fonctionnalités. Mais ensuite, vous partez d'une idée simple, puis vous la développez, vous la faites grandir. Par exemple, créez une application qui vous rappelle de vous lever de votre fauteuil toutes les heures, n'est-ce pas ? C'est un business. C'est un service. C'est une application, c'est une plateforme. Et cette petite idée peut vous donner une autre source de revenus, comment vous la monétisez, comment vous vous constituez une audience Encore une fois, c'est différent. C'est en plus des scores. Mais je vous promets qu'il existe des tonnes de plateformes construites autour d'une idée très simple. Voici une extension WordPress qui vous permet simplement d' insérer des publications sur les réseaux sociaux sur votre site Web. C'est super facile, et ils gagnent beaucoup d'argent, principalement de manière passive, non ? Maintenant, j'ai vu des extensions WordPress payantes qui vous permettent d'ajouter une barre avec un message personnalisé en haut ou en bas de votre site Web. C'est ça. C' est tout. C'est la clé de voûte de toute l'entreprise. Le fait est que le ciel est la seule limite. Il s'agit de résoudre des problèmes, des problèmes auxquels vous savez que vous tenez à cœur, que vous voulez résoudre vous-même. Toujours sur WordPress, il existe une application qui vous permet d'insérer le code Google Analytics ou le suivi des publicités Facebook. Et c'est aussi simple que cela. Rien de trop compliqué. Maintenant, a guy vibe a codé une plateforme d'horoscope en direct sur TikTok, et elle fonctionne très, très bien Hodoscope, peu importe. Cela n'a aucun sens. Ce n'est pas pour moi, mais c'est peut-être pour toi. Maintenant, un autre gars a créé une application de fond d'écran, mais uniquement pour le type spécifique d'anime. Vous n'êtes pas obligé de prendre le prochain Uber ou la prochaine porte. Vous atteignez un, cinq, dix mille dollars par mois. Vous devez en fait résoudre un problème pour un petit groupe de personnes. Mais disons que vous n'avez aucune de ces idées, n'est-ce pas ? Eh bien, nous avons créé le site Web du portfolio, n'est-ce pas ? Pourquoi ne pas proposer ce service à certaines entreprises locales ? Trouvez-en 100 dans votre région, dans votre ville, dans votre pays, et demandez-leur 1 000 ou 80 dollars par mois Et vous venez d'apporter une bonne partie du changement. Il existe d'autres plateformes qui vous proposent des listes de tous les dentistes de votre ville ou de votre pays de York. Maintenant, ce qui compte, c'est trouver la bonne approche. Leur envoyez-vous un e-mail ? Tu les appelles ? Est-ce que vous vous présentez à l'entreprise ? Est-ce que vous facturez 1 000$ ou 800$ ? Et bien sûr, vous n'êtes pas obligé de le faire uniquement avec les dentistes. Pensez à toutes les autres entreprises de votre région qui gagnent beaucoup d'argent, mais qui ont des sites Web horribles. Dans ma région du monde, ce sont les restaurants, les avocats, les magasins de services, les vétérinaires. La liste s'allonge encore et encore. J'ai d'innombrables agences de conception Web, bien sûr. Mais le vôtre peut être différent car vous pouvez vous spécialiser dans un domaine que vous connaissez peut-être très bien. Ou que tu es sur le point d'apprendre très bien. Vous offrez un bon site web déjà codé avec peu ou pas de maintenance. C'est pourquoi c'est une course, car plus en plus de personnes vont commencer à proposer la même chose, n'est-ce pas ? Parce que si vous pouvez créer un site Web en cinq, dix, 15, 20 minutes, bien sûr, qu'en vaut-il la peine, n'est-ce pas ? Allez-vous facturer peut-être 600 dollars ? Le prochain gars va facturer 400$ et tout d'un coup, à partir de 1 000$, vous commencez à les offrir pour quelques centimes Le temps presse donc. C'est pourquoi j'ai dit que c'était payant d'être en avance. Mais bien sûr, il n'y a pas lieu de paniquer. Il y en a plus qu'assez pour que tout le monde puisse s'y déplacer. Donc, avant de créer quoi que ce soit que vous voulez vendre, je vous conseille créer quoi que ce soit que vous voulez vendre, commencer par quelques petits projets amusants. Maintenant, faisons une pause. J'espère que vous pouvez maintenant voir qu'il existe un monde d'opportunités, mais vous n'avez pas à viser le chiffre d'affaires de 100 000 000$ Résolvez simplement de petits problèmes tels que transformation des coins carrés d' une image en coins arrondis, n'est-ce pas ? Et que vous financez peut-être 100 dollars par mois. Cela semble stupide, je sais, mais les réseaux sociaux regorgent d'histoires comme celle-ci C'est ce qu'on appelle construire en public, et c'est un excellent moyen de faire de la publicité. Vous publiez constamment des articles sur votre voyage. Cette intégration du mouvement public est fantastique , car vous pouvez réellement vous inspirer de leurs projets et vous pouvez également tirer des leçons de leurs erreurs afin de les éviter. Vous voyez les profils, vous pouvez voir que ce ne sont que des gens ordinaires. C'est ainsi que vous pouvez trouver de l'inspiration. Le gars qui a codé ply.com a documenté chaque étape de son parcours et comment il l'a développé au fil des années Il était totalement seul. Il a tout codé, à l'ancienne. Il était le seul développeur. Mais maintenant, vous êtes peut-être seul, mais vous avez les connaissances et le pouvoir de 100 à 1 000 développeurs qualifiés, pour 15, 20 ou 25 dollars par mois, n'est-ce pas ? Il ne vous faudra donc pas des années pour construire votre projet. Vous pouvez échouer en marketing, mais vous pouvez le faire une autre fois une autre fois et une autre fois. Tu peux réessayer. Tu peux échouer vite, tu peux apprendre. Et puis, à un moment donné, vous allez réussir. Que ce soit grand ou petit, c'est à vous de décider. C'est entre tes mains. Mais oui, maintenant la question est que voulez-vous construire ? C'est peut-être stupide. Il est peut-être petit. Mais si tu continues d'essayer et d'apprendre, je te promets que tu auras des résultats. 6. Se déplacer avec le curseur: Bon retour. Lancez le curseur pour explorer l'interface. Cela peut changer de votre côté, mais les bases seront toujours là. Comme aucun projet n'est en cours, l'interface est assez basique. Nous pouvons ouvrir un projet existant ou lancer un nouveau en ouvrant un tout nouveau dossier, un dossier vide, ou nous pouvons utiliser Github pour en démarrer un Mais nous allons rester simples, et nous allons créer un nouveau dossier n'importe où sur notre ordinateur, puis nous allons l' ouvrir avec le curseur. Maintenant, même avec un projet vide, l'interface ne change pas tant que ça, mais nous voyons quelques domaines clés. Sur le côté gauche, nous pouvons voir tous les fichiers de ce dossier spécifique. Pour le moment, il est totalement vide. Nous venons de le faire. Mais allons-y. Ajoutons un fichier texte aléatoire dans ce dossier. Maintenant, nous pourrions le faire directement à partir du curseur, mais faisons-le à l'ancienne. Ainsi, tout fichier texte aléatoire devrait apparaître ici. Si vous ne le voyez pas, vous avez une icône de rafraîchissement si vous déplacez votre souris dans cette zone. Et une fois que vous avez cliqué dessus, vous pouvez utiliser la partie parfumée de l'écran pour modifier ce fichier Mais la clé du codage des vibrations se trouve dans ce panneau. C'est ici que vous parlez à l'IA. Si vous ne pouvez pas le voir, utilisez le raccourci clavier Control L, mais par défaut, vous devriez le voir. Mais oui, Control L. Nous allons revenir à ce panel dans un instant. Pour l'instant, passons au menu supérieur du terminal. Dans cette liste, choisissez un nouveau terminal, et cela ouvrira un panneau en bas. Ici, nous allons voir plusieurs onglets, mais uniquement intéressés par le terminal. Maintenant, de temps en temps, cette zone peut nous montrer divers problèmes, erreurs. Cela va nous montrer certains progrès, et nous devrons peut-être payer certaines commandes ou simplement appuyer sur Entrée. Mais oui, pour faire court, pour récapituler, 90 % du temps, vous allez regarder ici dans le panneau de droite, et peut-être 10 % du temps, vous allez regarder le terminal en bas Cependant, dans la plupart des cas, même le terminal apparaîtra ici sur le côté droit. Maintenant, le reste n'a pas vraiment d' importance. Si l'interface est trop petite, vous pouvez utiliser le Hockey Control Plus pour l'agrandir. Cela devrait vous aider à tout voir sans effort. C'est donc Control plus. Si vous souhaitez le réduire, utilisez l'inverse, Control minus. OK, des trucs géniaux. Malgré tout, cette interface sombre peut vous déranger. Voici donc comment vous pouvez le modifier. Accédez au menu supérieur pour archiver. À partir de là, allez dans les préférences. Recherchez ensuite Team. Enfin, ici, cliquez sur Color team. heure actuelle, après avoir cliqué sur l'un de ces choix, la fenêtre va se fermer, ce qui n'est pas idéal, mais ouvrez-la à nouveau, faites équipe avec les références de fichiers, coloriez-les, puis choisissez l'un d'entre eux. C'est à vous de décider, mais j' aime beaucoup les plus sombres. Bien, concentrons-nous maintenant l'interface de discussion. La première chose que vous devez savoir c'est que pour le codage Vibe, nous voulons toujours que ce paramètre soit défini sur agent Les autres modes sont destinés aux développeurs expérimentés qui souhaitent utiliser l'IA pour améliorer l'écriture du code, pour les aider à écrire du code. Mais nous ne voulons pas le faire. C'est pourquoi nous allons le définir sur agent, ce qui signifie simplement que l'IA fera majeure partie du travail. Ensuite, en haut Vous pouvez référencer un fichier depuis le projet, gros pointer l'IA vers celui-ci. Maintenant, juste pour être clair, l'IA va modifier tous les fichiers qui se trouvent dans le dossier du projet. Cela peut fonctionner sur n'importe lequel d'entre eux. C'est ainsi que vous séparez les choses. Si vous souhaitez démarrer un nouveau projet, vous créez un autre dossier vide à un autre endroit de votre ordinateur, puis vous allez dans le menu supérieur pour ouvrir un dossier. C'est ainsi que vous pouvez séparer les choses . C'est comme tout. Lorsque vous installez des jeux, des programmes, lorsque vous copiez des images de vacances, tout doit être bien organisé dans des dossiers appropriés. C'est ainsi que vous passez d'un projet à l'autre. Vous allez essentiellement dans le dossier File Open, non ? Ou une autre approche qui revient essentiellement à la même chose. Vous pouvez accéder au menu supérieur pour archiver, et à partir de là, vous pouvez choisir une nouvelle fenêtre. Et en gros, vous pouvez ouvrir un dossier, et c'est essentiellement la même chose. Vous pouvez maintenant faire glisser des images dans le chat. C'est pourquoi vous avez cette icône ici. Vous pouvez cliquer dessus ou vous pouvez glisser-déposer. Mais nous le ferons plus tard. Comme je l'ai déjà dit, vous pouvez également référencer certains fichiers si vous souhaitez que l'IA se concentre sur eux. heure actuelle, vous pouvez voir que le document texte est affiché ici, et cela indique à l'IA que vous vouliez y porter une plus grande attention. Vous pouvez passer dessus et cliquer sur le symbole X pour le supprimer. Nous en reparlerons plus tard. Le dernier paramètre important ici est cette partie où vous choisissez votre modèle. Cela va changer radicalement vos résultats. Parlons des modèles dans la prochaine conférence. Pour l'instant, veuillez changer l' interface pour une nouvelle équipe, augmenter la taille en utilisant Control plus, créer une nouvelle photo sur votre ordinateur et l'ouvrir dans le curseur juste pour vous habituer à ce flux. OK, je vais te voir dans une seconde. 7. Obtenez de meilleurs résultats avec ces outils: Reviens. Développez quelques outils que vous pouvez installer sur votre ordinateur afin que le curseur puisse faire un meilleur travail, surtout si vous voulez faire le moins de travail possible, et c'est ce que nous voulons faire. Maintenant, nous n'allons pas donner le contrôle total à l'IA. Au lieu de cela, nous allons installer un logiciel très connu qui aidera le curseur à mieux fonctionner. Donc, tout d'abord, nous devons installer Python. Au fait, vous avez un fichier joint au cours, alors ne vous en faites pas. Vous avez tous les liens, vous n'avez pas besoin de les noter. Veuillez travailler sur votre deuxième visionnage. OK, c'est le site officiel, et nous allons cliquer sur la dernière version de Python pour Windows dans mon cas. Dans cette nouvelle page, nous allons devoir faire défiler la page vers le bas, et sous la section des fichiers, nous allons trouver le lien de téléchargement. Bien sûr. Faites quelques choix, mais voici le truc. Recherchez l'étiquette recommandée. Cela facilite les choses. Nous allons donc le télécharger et l'installer. Maintenant, il y a une chose importante ici, cette deuxième case à cocher Maintenant, je ne vais pas entrer dans détails, car cela nous détournerait vraiment de l'attention Cochez donc ces deux cases, et c'est parti. Cela prend un moment, mais il n'y a rien de spécial. Parfois, Python ne s' installe pas correctement, et j'ai une conférence à ce sujet. Maintenant, pour vérifier si votre installation est bonne, cliquez sur le menu Démarrer, puis tapez CND. CMD est l'abréviation de Command. Encore une fois, vous avez tout cela en pièce jointe, et vous avez également quelque chose pour les utilisateurs de Mac. Maintenant, c'est ce que je veux que vous saisissiez ici dans l'invite de commande. Et si tu vois quelque chose comme ça, tu es prêt à y aller. Très probablement, vous aurez une version plus récente, mais c'est très bien. Tant qu'il n' y a aucun avertissement, vous allez être bon. Maintenant, au cas où vous ne pourriez pas vous en sortir, vous pouvez faire ce qui suit. Vous pouvez accéder au menu supérieur du terminal avec le curseur. Voilà, arrête le nouveau, et tu pourras le voir ici même. Tapez la même chose, P et Y, et vous verrez si cela fonctionne. De mon côté, tout va bien. Maintenant, avant de poursuivre, je dois dire que je ne vais pas expliquer chaque logiciel parce que c'est contre-productif Je vais plutôt joindre un fichier contenant quelques détails sur chaque programme, mais ceux-ci sont très connus et il n'y a pas de quoi s' inquiéter . Ils vont être bons. Encore une fois, je vais me concentrer sur les choses pratiques. Pour moi, l'objectif est assez simple. Créez des sites Web le plus rapidement possible. Apprendre Python dès maintenant ne va pas vraiment aider. Ça va te faire tourner la tête. Donc, restons courts. Python est donc retiré de la liste. Idéalement, vous devriez redémarrer votre ordinateur, mais je vais continuer, même si cela peut poser des problèmes. Prochaine sur ma liste, la version Node JS LTS. C'est un must, et cela va vraiment nous aider. Maintenant, pendant le processus d'installation, il peut vous demander si vous souhaitez installer quelques autres outils. Nous voulons nous assurer de cocher cette option. C'est ce que nous voulons. Cela va donc vous montrer une autre fenêtre avec beaucoup de texte, et je veux dire beaucoup. Il ne nous demande rien, mais vous devrez peut-être attendre quelques minutes pour qu' il fasse son travail. Je vais accélérer l'enregistrement, mais s'il vous plaît , soyez patient. est amusant, c'est que de mon côté, cela dit qu'il ne trouve pas réellement Python, même s'il est installé à 100 %. Maintenant, un redémarrage aurait pu résoudre ce problème. Mais oui, je sais que c'est installé, donc ce n'est pas grave. Le fait est qu'au bout d'un moment, ce processus d'installation s'arrête tout simplement. Mais voilà le truc. Ouvrez une autre invite de commande, CMD, et tapez le nœud suivant, puis la version N'oubliez pas que vous n'êtes pas obligé de mémoriser ces commandes. Ils sont tous attachés. OK, oui, vous pouvez voir ma version ici, c'est parti. Le prochain sur ma liste, Power Shell Seven. Nous sommes sur le Microsoft Store officiel, ce qui nous indique qu'il existe de nombreuses façons de l'installer. Cela peut sembler un peu accablant, mais en réalité c'est assez simple. Nous allons utiliser cette méthode lorsque c'est la méthode recommandée, c'est pourquoi nous allons l'utiliser. Ici, il n'y a que deux étapes. C'est le premier. Vous ouvrez l'invite de commande, vous cliquez ici pour copier ce texte, puis vous le collez. Vous allez avoir une question ici, tapez Y comme oui, puis appuyez sur Entrée, et vous verrez qu'il y a deux versions disponibles. Maintenant, l'aperçu signifie simplement que c'est comme une version bêta, quelque chose qui est généralement moins stable et expérimental. Nous n'allons donc pas le faire. Nous allons choisir le premier, le premier. OK. Maintenant, pour l' installer, copiez cette commande. Encore une fois, ce n'est pas la version d'aperçu qui est un peu plus basse, celle-ci ici, puis collez-la dans l' invite de commande et tapez Enter. Et bien sûr, après quelques secondes, cela va s'installer. OK, testez-le rapidement, FDWardt, ouvrez votre menu Démarrer et tapez ce qui suit C'est push mais avec un W, et vous devriez voir Power Shell Seven disponible. OK, nous nous en sortons très bien. Continuons avec GitHub. Nous devons créer un compte. Mais comme pour tout le reste, c'est totalement gratuit. Vous devez donc saisir votre adresse e-mail, puis vous devez la vérifier. Mais oui, après ça, tu es plutôt prêt à partir. Github est très utile, même s'il peut être assez intimidant Comme vous allez le voir, nous allons nous concentrer sur l'essentiel, et bientôt, vous serez à l'aise avec cela. OK, des trucs géniaux. Ensuite, installons Docker. Cela peut être facultatif. Cela peut être considéré comme facultatif, mais j'ai eu pas mal de problèmes parce que nous ne l'avions pas installé Je préférerais donc installer et m'en remettre à lui. C'est l'un des programmes les plus lents du marché. C'est totalement gratuit. Il n' y a pas grand-chose à faire, mais c'est assez lent. Il faut donc être patient. Une fois que c'est prêt, et encore une fois, soyez patient. Il vous faudra créer un compte. Mais le fait est que nous avons déjà un compte GitHub, non ? Donc, plutôt que de saisir un e-mail et de vous inscrire à l'ancienne, pourquoi ne pas utiliser le compte GitHub, n'est-ce C'est beaucoup plus rapide. Cliquez donc sur l'icône. C'est l'icône GitHub, et alors tu seras dorée OK. Il y a quelques autres choses ici. Mais pendant que je travaille en arrière-plan, laissez-moi vous expliquer ce qui se passe. Nous sommes donc sur le point de préparer de nombreux plats dans la cuisine. Nous allons préparer le petit-déjeuner, le déjeuner et le dîner. Nous allons faire des desserts. Nous allons préparer des snacks. Nous allons préparer des repas complets, beaucoup de variations, non ? Cela signifie donc que nous devons avoir un réfrigérateur et des ustensiles bien approvisionnés Nous avons besoin d'ingrédients. Nous avons besoin de couteaux, de fourchettes, cuillères, d'ustensiles, non ? C'est ce que nous sommes en train de faire en ce moment. Maintenant, allons-nous utiliser absolument tout dans chaque plat ? Non, certains outils ne sont spécifiques qu'à certains projets, mais il est beaucoup plus facile de tout préparer dès maintenant que d'essayer de les trouver pendant que vous cuisinez. Ça va être horrible. C'est une mauvaise expérience. voyez, lorsque vous rencontrez un problème après un problème dans le curseur, parce que vous manquez ceci ou cela , vous allez perdre du temps. Vous allez gaspiller de l'énergie et, bien sûr, des crédits, ce qui signifie essentiellement de l'argent. C'est pourquoi je vous suggère fortement de tout installer dès maintenant. Vous faites souvent des pauses, vous atteignez la largeur, puis vous volez. OK, de bonnes choses. Ensuite, nous allons installer quelque chose appelé Git pour Windows. Maintenant, ce programme va avoir beaucoup de paramètres, beaucoup de cases à cocher Mais ce que nous allons faire, c'est utiliser les valeurs par défaut à chaque étape. Maintenant, vous pouvez éventuellement faire une pause, mais simplement accepter tout tel qu'il est configuré , car le curseur va tout gérer. Il suffit donc de cliquer sur Suivant et tout ira bien. Maintenant, je me rends compte que ce n'est pas très confortable, mais cela permettra à l'IA de fonctionner beaucoup mieux, beaucoup plus rapidement, et cela ne nous dérangera pas à chaque étape. Il ne va pas nous demander de confirmer des choses. Cela ne va pas nous demander de faire des choses. Maintenant, lorsque nous créerons divers projets dans Cursor, tous ces programmes et comptes seront utiles. C'est pourquoi nous les installons dès maintenant. Restez avec moi, nous avons presque terminé. OK, Fast Food Web et nous n'avons que quelques comptes à créer. Mais ce n'est qu'un instant. Il suffit d'un clic environ. VerSL est le premier. Nous allons l'utiliser pour héberger nos sites Web afin que tout le monde puisse les voir. Encore une fois, c'est totalement gratuit pour le moment, alors ne vous inquiétez pas. Inscrivez-vous en utilisant Github pour simplifier le processus. Bien entendu, faites une pause aussi souvent que nécessaire et passez en revue le fichier joint. C'est donc VerSL. Ensuite, nous allons utiliser une plateforme appelée resend.com pour envoyer des e-mails C'est totalement gratuit pour un maximum de 3 000 e-mails par mois. C'est donc génial pour commencer. N'oubliez pas que nous avons créé le site Web de notre portfolio, mais l'IA nous a dit que le formulaire ne fonctionnerait pas car il n'est connecté à rien. Eh bien, le renvoi corrige ce problème. De bonnes choses. Et un dernier compte rendu est Super Base, qui est fantastique pour les bases de données, pour les projets complexes, ce que nous ferons peut-être plus tard dans le cours. Cela est absolument nécessaire, mais encore une fois, plus tard. c'est en un clic, alors pourquoi ne pas vous en débarrasser Mais oui, croyez-le ou non, nous en avons fini avec ces outils. Il y a quelques autres paramètres dans le curseur, mais nous le ferons une fois que vous aurez rattrapé votre retard. Pour l'instant, veuillez faire une pause, tout installer, vérifier la pièce jointe et ne continuer qu' après avoir parcouru la liste de contrôle N'oubliez pas, soyez patient et installez tout. 8. Configurer des MCP et des règles dans Cursor - La manière simple: Reviens. Nous avons installé mal de choses comme Python, pas de JS et Power Shell, mais nous pouvons également faire certaines choses avec le curseur. Le premier concerne les règles. Et vous pouvez accéder à cette section en concentrant sur le côté supérieur droit du curseur. Cliquez ici sur cette icône en forme de roue dentée pour ouvrir les paramètres du curseur. Vous allez le voir ouvert ici et il y a quelques options parmi lesquelles choisir. Commençons par les règles. Ici, il y a donc deux choix principaux. Il s'agit des règles de l'utilisateur et des règles du projet. La première nous intéresse. Vous avez un fichier joint qui s'appelle exactement comme ça. Tout ce que vous avez à faire est d'espacer le contenu dans Cursor. En bref, cela indique au curseur comment il doit agir. C'est comme dire à quelqu'un à quel point nous aimons notre café, et c'est un truc assez basique. Nous voulons que le curseur soit efficace. Nous voulions utiliser les meilleures pratiques. Nous voulons qu'il soit sûr et masque des informations sensibles, etc. Vous pouvez trouver des modèles de règles sur le Web ou vous pouvez simplement utiliser le mien. Je l'ai aussi trouvé sur le Web. Nous avons choisi les règles utilisateur parce que nous voulons que le curseur les applique à chaque projet. D'un autre côté, les règles du projet seraient spécifiques à ce seul projet. Par exemple, imaginons que nous passions à un projet d'application mobile sur IOS, n'est-ce pas ? Nous pouvons avoir des exigences différentes, est-ce pas, des règles différentes. Mais comme nous allons nous concentrer sur le travail de conception Web dans ce cours, nous voulons rester simples, pour que ce soit assez facile, collez ces règles, et c'est tout. Nous voulons qu'ils soient appliqués partout. Sur le prochain incurseur, nous allons cliquer sur les MCP. Je ne vais pas m'attarder sur les aspects techniques. C'est très simple. Ils vont beaucoup nous aider. Maintenant, voici le truc. Bref, cela va donner plus de contrôle à l'IA. Si nous n'utilisons pas ces MCP, nous devrons travailler davantage Il faudrait écrire plus de code. Il faudrait taper plus de commandes et déplacer des éléments. Ce n'est pas génial. Par exemple, nous allons avoir un MCP Github. Cela permettra à l'IA de créer elle-même un nouveau projet . Cela lui permettra de tout télécharger automatiquement. En gros, faites tout seul sans que nous ayons à suivre certaines instructions. Je déteste quand l'IA me dit ce que je dois faire. Les MCP sont donc fantastiques. Et une fois qu'ils seront configurés, l'IA les utilisera selon ses besoins. Ce sont essentiellement des outils pour l'IA au cas où elle en aurait besoin. Pour le moment, cette interface n' est pas adaptée aux débutants, mais je vais vous aider. Vous avez un fichier joint qu'il vous suffit de copier-coller puis de remplacer quelques clés. Voici le fichier, et voici les éléments que vous devez remplacer. Tout d'abord, laissez-moi vous montrer comment en supprimer ou en ajouter un au cas où vous voudriez ajouter ou supprimer un MCP Vous sélectionnez le fichier entier, Contrôle A, puis vous le copiez, Contrôle C. Ensuite, vous ouvrez le site chagpt.com Vous n'avez pas besoin d'un compte, vous pouvez l'utiliser totalement gratuitement. Ensuite, vous dites quelque chose comme supprimer le Super Base MCP de ce code, puis vous le collez simplement Vous deviez participer, et c'est tout. Chad GPT va vous fournir le code mis à jour, vous n'avez donc pas à vous soucier d'ouvrir et de fermer des crochets ou quoi que ce soit d'autre. Et c'est pareil si vous voulez ajouter quelque chose. Donc, oui, c'est comme ça que tu le fais. Je vais m'en tenir à ma liste initiale, et c'est ce que je vous recommande de faire également. Donc, avec le fichier texte original que vous avez joint, revenez à Cursor, à MCP et cliquez pour l'ajouter Je suis sûr que cette interface va changer dans le futur. Ce sera plus convivial pour les débutants. Mais pour l'instant, c'est ce que c'est. OK, une fois que vous avez collé, vous devez changer d'onglet. Vous devez revenir aux paramètres du curseur. Vous trouverez ici une liste de tous les MCP configurés. Le vert signifie qu'ils sont prêts à être utilisés. Tout le reste n'est pas idéal. Si vous rencontrez des problèmes avec certains d'entre eux, continuez à regarder. Je vais vous montrer comment vous pouvez les réparer. Désormais, le nombre de MCP que vous pouvez installer est limité. Il y a une limite au nombre d'outils qu'ils peuvent utiliser. Maintenant, ils sont tellement géniaux vous voudrez peut-être en ajouter des tonnes, mais plus de 40 outils au total, c'est impossible, du moins pour le moment. Maintenant, vous pouvez dire « Hey, Chris », mais il n'y a que quelques entrées ici. Nous avons Github. Nous avons de la mémoire, une pensée séquentielle Il ne s'agit pas de 40 articles. Vous avez raison, mais ce sont des outils, pas des objets. Vous voyez, chaque MCP possède tous ces outils. C'est la limite réelle. 40 outils au total. Github en compte à lui seul plus de 20, mais il est tellement utile que nous allons le conserver juste quelques mots à leur sujet, Mais juste quelques mots à leur sujet, juste pour que ce soit un peu clair. La pensée séquentielle aidera l'IA à décomposer la tâche en petits morceaux Cela nous aidera à les suivre, ces petits détails, et cela nous donnera un bien meilleur résultat. Cela aide essentiellement l'IA à ne pas perdre de vue. Il gardera une trace de tout. Il s'agit essentiellement d'une liste de contrôle. Ou le système de fichiers MCP. Cela permettra à l'IA de créer des dossiers, déplacer des fichiers , de couper, de supprimer, etc. C'est essentiel car certains projets vont contenir de nombreux fichiers et dossiers, et vous n'avez vraiment pas envie de les parcourir. Vous ne voulez pas les déplacer vous-même. C'est vraiment génial de laisser l'IA le faire pour vous. Mais introduisons vos clés, car encore une fois, vous devez connecter certaines d' entre elles à vos clés personnelles. Je vais donc vous montrer comment cela fonctionne, en commençant par GitHub. Maintenant, vous pouvez utiliser Google et rechercher jeton d'accès personnel GitHub Ou tu peux le faire. Vous pouvez retourner dans votre navigateur sur github.com À partir de là, vous pouvez accéder aux paramètres du compte, et à partir d'ici, sur le côté gauche en bas, vous verrez les paramètres du développeur. Et dans cette nouvelle fenêtre, vous allez voir exactement ce que nous voulons comme jeton d'accès personnel. Nous voulons le classique. C'est tellement créatif, mais sachez que vous devrez définir un nom, une date d'expiration. 90 jours, c'est ce que je recommande. Ensuite, vous allez devoir absolument tout cocher . C'est beaucoup de clics. Je sais que vous en avez assez de ces réglages, mais je vous promets que cela va nous faciliter la vie. Mais oui, une fois que tu seras prêt, tu auras la clé, colleras, et c'est tout. Assurez-vous de toujours le cacher. Il ne vous le montrera qu' fois pour des raisons de sécurité. Pensez-y comme à votre numéro de carte de crédit. Maintenant, pour ce qui est de la super Base, c'est beaucoup plus simple, rien de trop compliqué. Mais laissez-moi vous dire ceci juste pour que ce soit super clair. Je ne vous montrerai jamais les clés à personne. C'est comme si vous indiquiez votre numéro de carte de crédit sur Internet. Ce n'est pas une bonne idée. Tu dois le garder en sécurité. Tu ne dois le montrer à personne d'autre. C'est pourquoi la plupart des plateformes ne vous montreront votre clé qu'une seule fois. Si tu le perds, tu devras en créer un autre. une nouvelle clé ne vous coûte rien, mais ce n'est pas une bonne idée d'avoir 15 clés au hasard dans votre compte, sans savoir laquelle est laquelle. Alors gardez-le en sécurité, collez-le, et puis c'est tout. Maintenant, nous avons pratiquement terminé. Tu peux faire une pause. Vous pouvez tout configurer vous-même et vous assurer que vous êtes à jour. Si vous rencontrez des problèmes, ne vous inquiétez pas. Dans la prochaine vidéo, je vais vous montrer comment nous pouvons les corriger. Gardez donc cela à l'esprit. Pour l'instant, allez-y et mettez-vous au travail. 9. Comment résoudre les problèmes: Reviens. Des problèmes sont inévitables, et le plus frustrant, c'est que cela peut être n'importe quoi. Vous allez rencontrer des problèmes spécifiques à votre ordinateur, à votre système d'exploitation, à votre projet. Par exemple, si vous avez un antivirus, vous pouvez avoir des difficultés pendant des jours et aucun tutoriel ne pourra vous aider. C'est pourquoi je veux vous montrer comment j'ai appris à gérer ces affaires, comment je l'ai fait moi-même. Par exemple, supposons que le serveur Git MCP ne fonctionne pas et qu'il indique que c'est à cause de Python Maintenant, nous avons installé Python, et tout semblait correct, non ? J'ai donc copié l'erreur, puis j'ai utilisé Google. J'ai trouvé quelques éléments sur Stack Overflow , une plateforme pour les développeurs J'ai essayé différentes solutions, mais aucune n'a fonctionné. Soyons clairs, je ne suis pas développeur. Je ne sais pas quel est le problème. Maintenant, la façon dont vous gérez ces situations, ces problèmes, déterminera votre niveau de réussite. Je le répète, vous allez suivre les instructions, que soit celles de ce cours ou du Web, mais les choses ne fonctionneront pas. Et la façon dont vous parviendrez à gérer cela déterminera votre succès. Ici, j'ai essayé quelques trucs, puis je suis passé à chatgpt.com Vous pouvez l'utiliser gratuitement ou vous inscrire. Je vous recommande de vous inscrire, même s'il s'agit d' un autre abonnement. J'ai utilisé ce modèle, qui est très bon pour le raisonnement, et je lui ai expliqué exactement ce qui se passait. Salut, j'utilise Cursor AI, et j'ai ce problème. La première solution qu'il m'a proposée semblait un peu trop compliquée à mon goût, alors je l'ai simplement ignorée Je viens de passer au second. Ici, je n'avais aucune idée de ce que cela signifiait, mais j'ai juste commencé à les coller dans CMD, et c'est tout, tu La première ligne n'a pas semblé aider. Je suis donc passé à la suivante. Et voilà le truc. Après quelques secondes, il a installé quelque chose, et j'ai eu l'impression que cela fonctionnait. Je suis donc retourné au programme. Je me suis rafraîchie, et pourtant, tout allait bien. Je ne sais pas pourquoi, mais c'était la solution. Maintenant, il ne s'agissait que d'une seule situation. Voici un cas différent sur un autre ordinateur, le G MCP ne fonctionne pas, mais pour une autre raison Je ne sais pas pourquoi, et je tiens à être totalement transparent. Je n'ai pas l'intention d' apprendre ce genre de choses. Au lieu de cela, je vais utiliser la même méthode que précédemment. Je vais interroger GPT à ce sujet. De préférence, l'OT, car l'OT est le modèle de raisonnement le plus avancé, il est donc très bon en logique et en codage. Mais si vous n'avez pas accès au GPT pour discuter en GPT, vous pouvez éventuellement utiliser la fenêtre de discussion dans le curseur, et vous obtiendrez probablement un résultat similaire Maintenant, dans Chat GPT, je lui ai expliqué ce qui se passait, et après environ 90 secondes, il m'a donné un plan étape par étape Donc, tout d'abord, je dois installer quelque chose en utilisant PowerShell, et voici la commande exacte OK, je pense que c'est assez simple. Je vais utiliser le menu de démarrage. Je vais taper push, mais avec un W ou simplement un Power Shell. Ensuite, dans Power Shell, je vais juste copier, coller cette commande et entrer. Et encore une fois, il semble qu'il installe quelque chose. Je ne sais vraiment pas quoi. Il fait différentes choses. Mais oui, je pense que c'est bon d'y aller. Passons maintenant à l'étape suivante, il m'a donné une commande différente, mais il insiste pour que j' ouvre un nouveau terminal OK, je vais taper à nouveau push, puis je vais le coller. Bien entendu, cela soulève un problème. J'ai copié deux lignes différentes, ce qui n'est pas idéal. Ça devrait être un par un, mais peu importe, je vais quand même le coller. Et oui, je pense que c' est vraiment une bonne idée d'y aller. OK, maintenant nous devons redémarrer le programme. Ne l'ignorons pas. Je suis content ne pas avoir à redémarrer l'ordinateur. Maintenant, il va falloir attendre le second. Mais oui, une fois qu'il est chargé, vous pouvez appuyer sur le bouton d'actualisation sur le côté droit, et en gros, c'est la victoire, plus d'erreur. Ce sont des trucs géniaux. Pour être honnête, il s'agit d'un programme différent de Cursor. C'est pourquoi ça a l'air un peu différent. Mais le point est toujours d'actualité. De votre côté, vous allez avoir d'autres problèmes. Mais souvenez-vous d'une chose. Une fois que vous les aurez résolus, vous serez prêt à accepter que cela ne se reproduise pas. Le plus important, c'est de rester calme. C'est l'essence même du Vibe Coding. Vous n'avez pas besoin de savoir coder, mais vous devez avoir de la patience. B, posez les bonnes questions, voyez le plus important, essayez des choses jusqu'à ce que cela fonctionne. Maintenant, voici le truc. Nous avons le chat GPT, mais nous avons aussi un curseur qui utilise le chat GPT, non ? Eh bien, GPT 4.1. Pourquoi ne pas utiliser le curseur, non ? Parce qu'en gros, j' essaie de protéger mes crédits. Au lieu d'utiliser un seul crédit, je préfèrerais utiliser chagpt.com, où j'ai un abonnement séparé et où je peux poser autant de questions je le souhaite sans aucune limitation C'est pourquoi je préfère utiliser chgpt.com et j'ai un abonnement, car questions sont pratiquement illimitées, alors que dans le curseur, chaque conversation, chaque fois que vous appuyez sur le bouton de souris, chaque fois que vous cliquez dessus et qu'un crédit est réduit C'est pourquoi je le fais comme ça. Mais oui, ça résume tout. Tu vas sûrement avoir mal à la tête. Cela arrive. Dans les tutoriels, c'est toujours A, B, C et le succès, non ? Mais dans votre cas, il se peut que vous passiez des heures à l'étape B de la deuxième étape, et vous êtes bloqué et vous ne pouvez pas continuer. Tant que vous gardez mes conseils à l'esprit, les patients posent les bonnes questions et essaient des choses jusqu'à ce que cela fonctionne, tout ira bien. N'oubliez pas que c'est le prix à payer pour être arrivé si tôt, mais nous avons tellement d' avantages que, dans l'ensemble, c'est une offre fantastique. Et avec ça, continuons. 10. Claude et Gemini et GPT: Reviens. Les LLM sont grands modèles de langage et ils constituent le principal élément utilisé par le curseur Toute l'intelligence provient donc de ces LLM, plupart des gens appellent des modèles C'est ce que nous utiliserons également. Les modèles AI LLM ont fait de même. Donc, pour être clair, le curseur est le programme principal, mais l'essentiel de son intelligence provient de ces modèles provenant de différentes entreprises. Le curseur est un tuyau où les modèles sont l'eau. Maintenant, l'eau pourrait-elle s'écouler sans aucun tuyau ? Bien sûr, mais l'eau circulerait partout , non ? Cursor veille à ce que vous obteniez davantage de ce que vous voulez, c'est pourquoi nous l'utilisons. Sinon, nous pourrions simplement nous inscrire auprès d'une entreprise en particulier et utiliser ses modèles, mais cela serait beaucoup plus contraignant et nettement plus coûteux, surtout si vous souhaitez utiliser plusieurs entreprises et plusieurs modèles. Maintenant, c'est pourquoi le curseur est un bien meilleur choix. Pour faire le curseur, vous avez accès à la plupart des entreprises et à la plupart des modèles disponibles. C'est pourquoi, lorsque vous cliquez ici, vous pouvez choisir parmi plusieurs d'entre eux. En fait, il y en a bien d'autres. Vous devez les charger, ce sont les plus courants, et ce sont ceux qui sont recommandés en bref. Maintenant, la question clé, la question d'un million de dollars, laquelle devriez-vous utiliser, n'est-ce pas ? La réponse courte est que cela dépend vraiment. Voici donc ce que nous allons faire. Nous allons les comparer. Je vais confier la même tâche aux meilleurs afin que nous puissions comparer les résultats. La tâche est attachée, vous allez donc faire la même chose lors de votre deuxième visionnage. Pour l'instant, il suffit de regarder et de voir ce qui se passe. Maintenant, il y a une chose que les modèles changent souvent. Donc, ce qui est lent aujourd'hui peut être assez rapide demain. C'est donc quelque chose dont il faut être conscient. Les choses changent constamment. Maintenant, je vais utiliser un plan Pro, je vais donc avoir accès au dernier modèle Cloud Four. Mais si vous utilisez le plan gratuit, vous devrez utiliser le modèle 3.5. Mais comme vous allez le voir, ce n'est pas vraiment un problème car notre objectif est faire une idée de ces modèles en les testant. Donc, peu importe ce que vous utilisez en ce moment. Pour faire court, j'ai déjà créé trois dossiers vides sur mon ordinateur. Les noms n'ont pas vraiment d'importance, mais je voulais les étiqueter clairement pour que vous sachiez de quoi il s'agit. Pour rendre les choses un peu plus intéressantes, j'ai joint quelques images au cours. Maintenant, j'espère que les modèles pourront les utiliser. Pour ce faire, je vais copier ce dossier dans l'emplacement du projet Cloud Four. C'est le premier. Cela devrait donc aider le modèle à créer un site Web plus beau, non ? Je vais maintenant vous montrer la tâche dans une seconde. Mais nous devons d'abord aider le modèle en pointant les images pour indiquer au modèle qu'elles sont là. J'aime donner des instructions claires. Utilisez les images de ce dossier, puis ajoutez le chemin, l'emplacement exact des images. Maintenant, pour obtenir le chemin, allez dans ce dossier et cliquez sur cette zone, et vous allez voir quelque chose comme ça. C'est ce que nous devons coller dans le fichier texte. OK, encore une fois, assurez-vous de travailler sur votre deuxième visionnage et de faire une pause aussi souvent que nécessaire. OK, l'invite est prête, et maintenant nous pouvons la copier. Revenons au curseur, aucun projet n'est chargé, alors choisissons d'ouvrir le dossier. Nous devons maintenant naviguer dans notre ordinateur et trouver cet endroit, mais cela n'a rien de spécial. Une fois l'interface chargée, recevez une invite et collez-la dans le chat. Assurez-vous de sélectionner Cloud four ou Cloud 3.5 si vous êtes en mode d'essai. OK, maintenant je vais agrandir un peu mon interface qu'elle soit plus facile à suivre. OK, allons-y. Maintenant, Clot Four prépare immédiatement de nombreux déplacements. J'ai suspendu l'enregistrement parce que, comme vous pouvez le constater, il y a plusieurs étapes Maintenant, souvenez-vous qu'un texte effacé signifie voir ce que pense le modèle, mais il n'a pas encore répondu. Après le second, il reconnaît la tâche. Il le comprend, et il dit que cela va créer un beau site Web. Il indique ensuite qu'il utilisera le HTML cinq, CSS trois et le JavaScript Vanilla. D'accord, c'est assez important car si nous savons ce que le modèle utilise, nous pouvons potentiellement résoudre n'importe quel problème beaucoup plus facilement. Nous savons à quoi sert Google, n'est-ce pas ? Et maintenant, il a commencé à créer le fichier d'index. Maintenant, ce que je veux dire encore une fois, c'est qu'il faut être patient. Je vais changer la vitesse d'enregistrement de temps en temps pour ne pas trop attendre. En fait, je pense qu'avoir une minuterie quelque part dans le coin peut être une bonne idée. Permettez-moi donc d'ajouter cela. C'est une façon de comparer ces modèles. OK, le fichier d'index est chargé et le fichier CSS est le suivant. Maintenant, le fichier CSS détermine le style du projet, son apparence. Il semble que Claude souhaite utiliser la palette de couleurs rouge, rose et bleu foncé, ainsi qu'une police spécifique appelée Fredoca Il a donc créé cette police de caractères spécifique. Intéressant Eh bien, cela prend un certain temps. Si vous vérifiez les fichiers, vous verrez en fait des centaines de lignes de code. Je pense donc que le poids est justifié. Ne vous précipitez pas, n'est-ce pas ? Claude n'hésite pas, mais il faut un peu de temps pour écrire tout le code. Une fonctionnalité de couette Claude est en train de créer un fichier Lisez-moi. C'est utile, et j' apprécie le fait que le modèle le fasse. Bien entendu, nous devons le comparer à d'autres modèles pour voir de quoi il s'agit. Mais oui, dans l'ensemble, jusqu'à présent, de bonnes choses. Et oui, c'est enfin fait. Acceptons donc tout et vérifions-le. Donc environ 3,5 minutes au total. Et le site Web, le site Web a l'air bien. En fait, c'est mieux que bien. J'aime le dégradé dans le menu principal, la police épaisse. C' est très beau. L'ensemble de la palette de couleurs est en fait correct, mais je dois dire que je suis un peu déçue par la carte. Il n'en a pas ajouté un fonctionnel. Nous devons nous inscrire et lui donner une clé pour que cela fonctionne. OK. Mais à part ça, la zone de newsletter est solide, le pied de page est superbe Il s'agit d'un excellent résultat obtenu en quelques minutes seulement. Jetez également un œil à la version mobile. C'est une bonne chose à vérifier. Dans certains cas, il peut y avoir des problèmes d' alignement ou divers problèmes. Et ici, étonnamment, examinez certains de ces problèmes. Waouh, c'est choquant. La navigation supérieure est donc corrigée, ce qui est une bonne idée, bien sûr, mais elle couvre en fait le titre principal C'est super surprenant. Et dans la partie centrale de la zone des héros, je ne peux vraiment pas dire que je suis amoureuse de cette mise en page. Texte à gauche, photo à droite, puis ce bouton est bien séparé en bas. C'est trop loin. Mais pour être honnête, le titre est également assez éloigné. Euh, c'est le domaine le plus important, et je ne pense pas qu'il soit suffisant. Et il y a aussi quelque chose à dire à propos du fil Instagram. Ce n'est pas correct. Bien sûr, c'est une tâche un peu délicate. C'est un défi, mais voilà le truc. Pour la carte, il était indiqué que nous avions besoin d'une clé, et elle nous a donné quelques instructions. OK, cool. Mais pour le fil Instagram, il en a juste créé un à partir de mes photos. Ce n'est pas génial car cela peut nous embrouiller. C'est un peu trompeur. S'il ne peut pas le faire fonctionner, s'il ne peut pas l'implémenter, d'accord, dites-le simplement, non ? C'est très dangereux pour le codage de l'ambiance , car nous pouvons regarder quelque chose, et nous pouvons supposer que cela fonctionne alors qu' en fait, ce n'est pas le C'est donc un peu un signal d'alarme. Nous devons poursuivre notre comparaison avoir une meilleure idée du caillot 4. Mais oui, c'est très intéressant. Mais maintenant, s'il vous plaît, ne travaillez pas dans le même sens, passez à la leçon suivante, puis ce sera votre tour. Je vais te voir dans une seconde. 11. Claude vs Gemini vs GPT – partie 2: Reviens. Nous avons vu comment Claude Four a fait des hauts et des bas, mais nous avons dû le comparer à quelque chose pour avoir une meilleure idée de ces modèles. Mettons-nous donc au travail avec Gemini de Google. Commencez donc par coller les images dans ce dossier et ajoutez cet emplacement au fichier texte. C'est très important. Maintenant, vous allez bientôt vous habituer à cette approche à créer constamment de nouveaux projets, à créer un nouveau dossier, puis à l'ouvrir, à vous créer un nouveau dossier, puis à l'ouvrir, à assurer que les paramètres sont corrects, puis c'est parti pour les courses. D'accord, Gemini est donc un produit Google, et beaucoup de gens ont de grands espoirs à son égard Voyons comment cela fonctionne dans notre cas. Maintenant, le fil de la pensée est super rapide, et il contient beaucoup de détails. Mais voyons quelle est la vraie réponse, et nous verrons que Gemini souhaite utiliser une technologie différente de celle du cloud D'accord, il veut utiliser React et VT, ce qui ne nous dit peut-être pas grand-chose parce que nous ne codons pas, mais c'est une différence intéressante. C'est sans importance. autre chose ici. Maintenant, en ce qui concerne les actifs d'images, Gemini dit qu' il doit d'abord savoir quelles images se trouvent dans ce dossier et si nous pouvons les répertorier nous-mêmes. Nous devons donc répertorier les photos. OK, c'est choquant, en fait. C'est très inattendu. Claude a immédiatement vu les photos. Pour être honnête, nous aurions pu fournir moins de photos ou les nommer dans le même format de la même manière, comme IMG 01 ou autre. Mais oui, dans l'ensemble, il s'agit d'une comparaison entre les modèles. que nous confions à ces modèles le même ordinateur, exactement pour cette raison que nous confions à ces modèles le même ordinateur, la même tâche : les comparer. D'accord, de toute façon, en poursuivant cette approche technique, le modèle va créer quelques fichiers différents, commençant par le package point JSON. OK. Encore une fois, cela ne nous intéresse pas vraiment, mais c'est agréable de remarquer ces choses. Au fur et à mesure que vous vous familiariserez avec ces modèles, vous devriez vous habituer à ces approches. Et d'accord, au bout de deux minutes, je pense que nous avons peut-être déjà terminé. D'accord ? Cool. Nous pouvons voir un énorme résumé ici. Je vais juste l'ignorer pour les besoins de cet enregistrement. Dans la vraie vie, je vous suggère de lire tout ce que dit le modèle, car il peut y avoir des informations clés. Mais oui, ici, je vais juste tout accepter et voir comment je peux lancer le projet. Comme nous utilisons une approche technique différente, le fichier d'index n'est peut-être pas la clé pour ouvrir le projet. Et si nous nous concentrons sur le chat, nous pouvons voir à la troisième étape que nous devons exécuter un serveur de développement. OK. C'est intéressant Mais voici ce que dit le numéro quatre : le fil n'est qu'un espace réservé et que nous avons besoin d'une clé si nous voulons en utiliser une vraie OK, donc j'apprécie. Vous pouvez voir comment la personnalité de ce modèle transparaît. Je ne dis pas que c'est mieux que les nuages, mais c'est quelque chose à noter. Il a dit que je ne pouvais pas le faire. Tu dois fournir la clé. OK, de bonnes choses. Essayons maintenant d'ouvrir le lien de l'hôte local, mais je suis sûr que cela ne fonctionnera pas car Gemini nous demande de gérer un serveur Je ne veux pas le faire tout seul. Voici donc ce que je vais faire. Vous faites l'étape numéro un, et immédiatement vous voyez ici le mannequin dire : OK, je vais le faire, ce qui est un peu drôle, étant donné qu'il aurait pu le faire avant, n'est-ce pas ? Gardez à l'esprit que chaque commande, chaque fois que nous appuyons sur Entrée, cela nous coûte de l'argent Certaines personnes peuvent donc être un peu mécontentes de cette approche. Si vous savez quoi faire et comment le faire, alors faites-le, n'est-ce pas ? Il se passe donc quelque chose dans la console. Installation de NPM. Et au bout d'un moment, cela nous indique encore une fois que nous devons faire deux choses. Il faut ajouter des images, les renommer. Mais plus important encore, étape numéro trois, nous devons faire fonctionner le serveur. Je ne veux pas faire fonctionner le serveur moi-même, mais pour être honnête, c'est assez facile à faire, mais là n'est pas le but. Je vais donc dire ceci : sautez les images, passez à la troisième étape. Et c'est ce qui devrait être le cas. Je pense que nous devrions pouvoir consulter notre site Web en plus de 3,5 minutes, et l'expérience a été bonne, elle a été très différente. Mais voyons ce qui se passe. OK, donc au premier coup d'œil, nous pouvons voir que les images sont manquantes. Ce n'est pas une surprise. Le menu principal est agréable et propre. Il est intéressant de voir que la carte est déjà opérationnelle par rapport à Cloude Nous n'avons pas de fil Instagram, et il nous explique pourquoi c'est le cas. Cela ne nous a donc pas embrouillés comme Claude. Ensuite, si une newsletter Q, dans l'ensemble, est plutôt bonne. Une chose qui m'embête vraiment , ce sont les photos des produits, cependant Examinons donc l'invite et voyons si nous pouvons l'ajuster. Je pense que je ne lui ai pas donné le chemin exact. Je crois que j'ai pointé du doigt le dossier général des Gémeaux, mais pas les photos réelles Le fait est que le modèle devrait pouvoir faire n'importe quoi dans ce dossier. Je ne pense donc pas vraiment que ce soit le problème. Essayons quand même à nouveau. Disons au modèle les photos se trouvent dans le projet. Il suffit de les ajouter au projet. Utilisez-les, non ? Voyons si cela résout le problème, même si j'en doute vraiment. OK, avance vite et non. Il dit qu'il ne peut pas y accéder, ce qui est un mensonge. Et que je dois fournir les noms de fichiers exacts pour les huit images du produit. Je n'aimerais pas les renommer moi-même. Curieusement, le modèle a créé un nouveau dossier appelé Publxlash Images, qui m'indique que le modèle a accès à cet emplacement Il peut créer des choses. Je peux supprimer des choses, je peux déplacer des choses. Mais oui, allons-y et jetons un coup d'œil à la version mobile. D'accord, dans l'ensemble, cela a été une bonne expérience, mais me demander de renommer ces fichiers n'est pas idéal La version mobile semble bonne. En fait, je pense que c'est mieux que les nuages. Mais oui, dans l'ensemble, concluons. Passons à GPT 4.1. Je vais sauter la configuration afin de gagner un peu de temps. Maintenant, tout de suite, la version 4.1 nous donne un plan. Il nous indique qu'il va utiliser un projet basé sur React avec VT. OK, très bien pour nous, et cela nous donne une approche étape par étape. OK, quo. Maintenant, voici la première différence majeure. Il nous demande de revoir le plan et de lui dire si nous voulons l'ajuster, si nous voulons changer des choses. OK, maintenant, d'un côté, cela consomme un autre crédit, plus d'argent. autre côté, cela nous donne l'occasion de nous assurer que le modèle a bien compris la tâche, le projet. Maintenant, dans l'ensemble, je pense que c'est une mauvaise chose à mon goût et que c'est une préférence personnelle. Tu vois, je ne veux pas lui tenir la main. Je ne sais pas ce que je ne sais pas, non ? Je le cherche pour me guider. Je ne sais pas si Vt est une bonne idée, si React est une bonne idée, non ? Je dois donc pouvoir lui faire confiance s'il m'indique que le fil Instagram est terminé, alors que ce n'est pas le cas s'il s'agit d'un faux fil, ce n'est pas une bonne idée. S'il s'agit de me demander des conseils, encore une fois, ce n'est pas idéal. Mais d'accord, continuons. Et voilà le truc. Après quelques secondes, il me demande de confirmer que nous voulons installer VT Okay, c'est là que vous devez faire attention. Vous devez en fait taper Y dans cette partie ici et appuyer sur Entrée. Sinon, tu vas être bloqué. Ce n'est donc pas vraiment évident, mais c'est pourquoi ces leçons sont si essentielles, mais voici maintenant le gros problème. Une fois que vous avez accepté, vous devez choisir un cadre. Et, bon sang, il y en a beaucoup. Comme je ne suis pas développeur, je ne suis pas sûr de ce que je dois sélectionner. Le modèle mentionnait quelque chose à propos de React, mais honnêtement, je ne sais pas lequel choisir. Et c'est là que GPT 4.1 est très différent des deux autres Quoi qu'il en soit, je vais choisir React, et j'espère que cela continuera. Mais après la seconde, voici un autre coup dur. Il demande la variante et plusieurs options parmi lesquelles choisir. C'est extrêmement ennuyeux car nous ne le savons évidemment pas Avec les codes Vibe, nous n'en sommes pas sûrs. Nous pourrions potentiellement lancer chatgpt.com et lui poser des questions à ce sujet Nous pourrions même démarrer une nouvelle conversation ici à l'intérieur du curseur et demander au modèle quelle est la meilleure approche. Je vais juste en choisir un au hasard, le premier, dactylographié, et C'est loin d'être idéal pour l'ambiance qui règne. Les développeurs expérimentés, bien sûr, n' auront aucun problème, mais pour nous, cela ne s'annonce pas bien. Nous étions auparavant en colère contre Gemini pour ne pas avoir pu trouver certaines photos, mais je pense que c'est bien pire C'est là que je me suis un peu inquiété. Je pensais que c'était bloqué. Je pensais que ce fichier TSX à points d'application avait tout gelé. Mais je pense qu'il s' agit en fait d'un très gros dossier. Regardez donc le time up pour voir quand j' accélère l'enregistrement. Comme cela fonctionne, permettez-moi de vous dire que ces résultats ne sont pas définitifs. De votre côté, il se peut que votre expérience soit très différente. Si je tente exactement cette expérience, encore une fois, il se peut que j'obtienne des résultats complètement différents. Beaucoup de gens font ces comparaisons en tête-à-tête, mais une chose est sûre, c'est que les résultats varient. Un modèle peut être lent aujourd'hui, mais rapide demain. Ces entreprises ont donc la capacité de mettre à jour ces modèles de manière à ce qu'ils fonctionnent tout simplement mieux. Et certaines personnes soutiennent qu' à différents moments de la journée, certains modèles se dégradent Donc, un peu comme une heure de pointe à 17 h 00 où tout le monde quitte le travail en même temps. Donc, si vous travaillez le matin, le modèle est plus rapide, mais si vous travaillez tard le soir, c'est horrible, des trucs comme ça. Maintenant, je ne peux pas dire avec certitude que cela se produira, mais je dois être clair que les résultats varieront , peu importe la raison. Mais oui, voyons ce qui se passe. Je reçois donc un message de réussite ici, sur le côté droit. Il indique que c'est maintenant configuré. Mais sur le côté gauche, on peut voir que le terminal rencontre clairement quelques problèmes. Cela peut être assez déroutant. Je vais arrêter le temps passé avec Doug et voir ce qui se passe. Laissez-moi trouver le fichier d'index et voir à quoi ressemble le site Web. Mais pour être honnête, je suis assez sceptique. Et oui, ici, ça ne marche pas. Dans ce cas, parlez-en au modèle. Dites-lui exactement ce qui se passe. Le fichier d'index est vide et j'espère que le modèle vérifiera tout et détectera le problème. C'est pourquoi nous faisons cette comparaison, n'est-ce pas ? Mais ce n'est pas ce qui se passe ici. Nous pouvons voir un résumé où, eh bien, il n'y a rien de vraiment clair. Nous avons donc besoin d'un autre message. Aidez-moi à voir le site Web et mon navigateur. L'objectif est de faire en sorte que le modèle apporte des modifications et des corrections, n'est-ce pas ? Nous pourrions copier-coller cette erreur dans Google et voir ce qui se passe. Mais d'abord, je veux donner au modèle une chance de le réparer tout seul. Mais non, ça ne marche pas. Nous pouvons réessayer, mais cela va évidemment échouer. La meilleure réponse est donc de donner l'erreur au modèle. Il suffit donc de le copier, de le coller. Dans la plupart des cas, vous allez voir le mannequin dire quelque chose comme « Oh, oui, vous avez tout à fait raison ». Et oui, ici, il semble qu'il ait exécuté une commande dans un autre dossier, une erreur stupide Quoi qu'il en soit, cela n'a pas vraiment d'importance. C'est fait, et je dirais que cela a pris environ 10 minutes pour ce seul modèle. Tellement plus lent que les autres. Mais jetons un coup d'œil. Je ne peux pas dire que je suis époustouflé. L'ensemble du site est décalé vers la gauche. Je ne sais pas pourquoi, pour être honnête. Nous pouvons voir les images manquantes, et les critiques sont affichées dans un gris moche. Nous avons une carte de travail, et c'est le seul modèle qui m'a donné un véritable fil Instagram, et c'est un vrai, pas un faux. Il n'y a pas de pied de page, et première vue, je pense que la version mobile va être horrible Ouais Alors, dans l'ensemble, quel est le verdict ? De toute évidence, ce sont des avantages et des inconvénients. Personnellement, je préfère le Clot Four, un modèle actuellement disponible si vous avez un forfait à 20$ Si vous voulez vous en tenir au forfait gratuit, vous devez passer à Clot 3.5, qui est également très bon Mais c'est une question de préférence. C'est Pepsi contre Coke, Android Witz, iPhone. U D. Ces modèles proviennent de sociétés géantes qui investissent des milliards de dollars pour résoudre ces problèmes. Il n'y a pas de meilleur téléphone. Et du même côté, il n'y a pas de meilleur modèle. Les choses changent constamment. Pour le moment, j'aime bien Cloud Four. Demain, il se peut que je passe à un autre. L'important, c'est de tout tester de votre côté avec exactement le même message. Fais exactement comme je l'ai fait ici et raconte-moi ton expérience. Dites-moi le bon, le mauvais, l'horrible. Dites-moi ce que c'est dans la section des commentaires et publiez quelques captures d'écran. Je veux voir ce qui se passe. Amuse-toi bien avec. 12. Les coûts expliqués de manière simple: Bon retour. Je voudrais aborder un point très important, l'anxiété liée à l'autonomie. Et voilà le truc. Votre plan mensuel comprend un certain nombre de crédits, 500 crédits pour le moment, n'est-ce pas ? Vous payez une certaine somme et vous pouvez utiliser ces 500 crédits. C'est 20 dollars pour le moment. Maintenant, voici comment cela se passe, la version simple. Le plan gratuit, vous commencez par un essai de deux semaines du plan P. Cela signifie qu'à l'heure actuelle, vous recevez 150 crédits ou demandes. Pour voir combien vous avez dépensé, vous pouvez accéder à votre tableau de bord sur cursor.com C'est mon utilisation actuelle sur ce tout nouveau compte. Vous pouvez voir que j'ai un total de 150 demandes parce que, encore une fois, je suis en période d'essai de deux semaines. Maintenant, sur leur site Web, vous pouvez voir un numéro différent ou il peut y avoir une promotion, mais pour l'instant, c'est le cas. OK, maintenant, cela signifie que vous lancez le curseur, vous choisissez l'un des modèles, disons, Gemini 2.5, et chaque fois que vous appuyez sur Entrée, vous avez passé une demande C'est de là que vient l' anxiété liée à l'usure. Vous commencez par 150, puis 149, puis 140. Et après ce cours, il vous en restera peut-être 20, n'est-ce pas ? C'est alors que la panique commence à s'installer. Il est facile de se focaliser sur ce chiffre. Maintenant, si vous souscrivez au plan P, que je recommande, 20 dollars. Maintenant, tu vas en recevoir 500 par mois. Vous avez vu précédemment comment nous avons créé une page de destination décente avec deux, trois ou cinq demandes. Et si vous voulez le peaufiner, il vous faudra peut-être 20 à 50 demandes Ce que vous voulez, la qualité de vos instructions et le modèle que vous utilisez sont vraiment qualité de vos instructions et le modèle que vous utilisez sont importants. Avant de poursuivre cette discussion sur les prix, nous devons aborder la question de l' éléphant dans la pièce. Le coût varie. Certains modèles sont donc incroyablement chers tandis que d'autres peuvent être totalement gratuits de temps en temps sans promotions diverses. Par exemple, Open AI nous a donné GPT 4.1 et 04 gratuitement. Oui, gratuitement, pendant une dizaine de jours. À l'heure actuelle, GPT 4.1 ne consomme qu'une seule requête, tandis que Cloud four Sonnet, la version pensante, nécessite deux à chaque fois que vous appuyez sur Entrée . C'est donc deux fois plus cher, ce qui complique beaucoup les choses, Et voici le coup d'envoi. Parfois, vous invitez un modèle à effectuer une tâche, vous voulez qu'il fasse quelque chose, puis ce modèle fait 20 choses l'une après l'autre, n'est-ce pas ? Il exécute tout seul, et vous n'êtes qu'un passager Donc, avec une seule demande, vous faites beaucoup de progrès. Le modèle décompose une tâche énorme en tâches plus petites, puis il les exécute petit à petit. Il fonctionne tout seul. Fabuleux. Mais les autres modèles sont différents. Vous lui donnez une invite et il ne fait qu'une seule étape. Parfois, il vous indique réellement ce que vous devez faire. C'est donc très frustrant. C'est pourquoi le coût est relatif. Vous pouvez dire : OK, la version 4.1 coûte moins cher, mais si elle est amnésique et que vous devez lui tenir la main à chaque étape et lui donner quatre, cinq dix instructions, alors que Club ne vous demande qu' une seule invite, alors le moindre coût vous rend-il vraiment heureuse Non, pas vraiment. Encore une fois, ce ne sont que des exemples aléatoires. Je ne dis pas que Claude a une longueur d'avance sur Open AI avec GPT, 4.2, peu importe Alors gardez cela à l'esprit. Maintenant, d'un autre côté, certains modèles sont très chers, voire dix fois plus chers, 03, par exemple. Cela signifie-t-il qu'ils sont dix fois plus bons ? Non, ce n'est pas le cas. Encore une fois, les choses changent très vite, et ces modèles vont s'améliorer de plus en plus. Voici donc ce dont je veux vraiment que vous preniez note. Le plus important de cette leçon, que le manque de crédits n' est pas un gros problème. Même si vous parcourez les 500 et que vous n'avez pas de projet terminé, ce qui est presque impossible, à vrai dire. Vous pouvez toujours en acheter plus. Et le prix actuel est de dix dollars pour 250 crédits. Cela représente 0,04$ par invite et par tâche. Encore une fois, une seule invite peut parfois vous mener très loin, selon le modèle que vous choisissez et clarté de vos instructions. Mais même si vous avez des résultats moyens, c'est vrai, c'est 0,04$, dix tâches, 0,40$, 100 tâches, quatre dollars, 4 Et vous en utiliserez probablement moins de 50 par jour, surtout si vous utilisez certains des modèles les moins chers ou ceux qui sont en promotion. Maintenant, c'est là que ça clique. L'objectif, notre objectif est de créer des sites Web qui nous rapportent de l'argent ou créer des projets qui nous permettront d'être embauchés en tant que indépendants ou d'obtenir un emploi stable, n'est-ce pas ? C'est l'objectif. OK, maintenant, si vous vouliez engager un codeur, un développeur, croyez-moi, vous ne paieriez pas deux, trois ou quatre dollars par jour. Non, et je parle d'un codeur moyen. Mais ici, dans Cursor, vous avez accès à certains des meilleurs codeurs au monde pour quelques centimes une page de destination moyenne devrait vous Pour être très généreuse, une page de destination moyenne devrait vous envoyer entre 30 et 100 instructions , n'est-ce pas ? Nous avons utilisé cinq exemples. Mais disons qu'il s'agit de 50 instructions. Croyez-moi, ce n'est rien. Lorsque vous vendez ce site Web pour 500 dollars, par exemple, sur le bas de gamme, est-ce vraiment important que vous ayez dépensé 2 dollars pour le créer ? Cette crainte de manquer de crédits n'est donc en fait pas logique. Ce n'est pas rationnel. La plupart des codeurs demandent entre 25 et 100 dollars heure sur les plateformes de freelancing Le curseur est moins cher, plus rapide , meilleur et c'est sous votre contrôle. Vous n'utiliserez pas des centaines de crédits par jour, surtout au cours des premiers mois. Gardez à l'esprit autre chose. Au début, vous ne saurez pas ce que vous faites. Vous risquez de brûler des crédits, n'est-ce pas ? Mais c'est normal. C'est comme ça qu'on apprend. Au fur et à mesure que vous vous améliorez, vous utiliserez les crédits de manière plus judicieuse. Mais pour l'instant, faites des folies, utilisez-les. Ne t'inquiète pas pour eux. Il s'agit d'un investissement dans votre avenir. Tu dois acheter un cours. Vous devez acheter quelques abonnements, mais le coût global n'est rien comparé à la hausse. J'ai créé de véritables entreprises dans le secteur alimentaire. J'ai créé des entreprises dans le secteur de la technologie. J'ai eu des équipes de dizaines de personnes. Les coûts sont des loyers immenses, services publics, des salaires, des équipements coûteux. Les mots sur le revers de la médaille, avec le curseur, vous payez quelques centimes Il n'y a pas de meilleure offre que le Vibe Coding pour le moment. Avec quelques dollars, avec quelques dollars, vous pouvez accomplir tant de choses. Donc, pour résumer, si vous êtes en phase d'essai, bien sûr, tenez-vous-en à Gemini 2.5, GPT 4.1 et Cloud 3.5 Ce sont les modèles actuellement inclus dans l'essai qui peuvent, bien entendu, changer. Testez-les tous les trois et voyez lequel vous préférez. Découvrez quelle personnalité vous aimez. Par exemple, je déteste parfois vraiment la version 4.1, mais gardez à l'esprit que les choses changent constamment Mon conseil : Gemini est probablement un meilleur choix, mais vous le savez Maintenant, si vous souhaitez utiliser Cloud Four, vous devez souscrire au plan de 20 dollars, que je recommande vivement. Une fois cela fait, il est fort probable que vous ne travailliez avec Cloud Four que pour la plupart de vos projets. Maintenant, si vous avez le forfait pro, n'utilisez jamais le mode Auto ni le mode Max. Donc, pour faire simple, le mode Max n'est pas pour les débutants. C'est une façon dont le modèle est beaucoup plus intelligent, mais il y a un prix qui y est associé. Maintenant, je ne vais pas entrer dans détails techniques sur les contacts, les fenêtres et les jetons. Je vais plutôt vous dire ceci. Vous ne devez pas toucher le mode Max pendant au moins quelques mois. Même si vous rencontrez beaucoup de problèmes et que le modèle vous agace à fond, veuillez ne pas passer en mode Max. C'est une étape que vous ne devriez faire qu'après avoir lancé quelques projets, et vous êtes beaucoup plus à l'aise avec ce truc de codage Vibe Lorsque vous êtes à l'aise avec Github, avec Versell, avec Super Base, avec l'ensemble de cet écosystème Donc, dans cet esprit, vous pouvez complètement supprimer le mode Max de votre esprit. Et même si, encore une fois, ce n'est pas une bonne idée, vous devez choisir un modèle et y tenir. Maintenant, emballez-le. Ne protégez pas vos crédits. Ne les chérissez pas. Ils constituent un investissement dans votre formation et votre avenir. OK, continuons. 13. 80 %-20 %: Reviens. Permettez-moi d'être clair. Vous ne créerez pas vous-même une entreprise d'un milliard de dollars avec le codage Vibe, mais vous pouvez lancer des produits, des sites Web, des applications susceptibles de générer de bons L'un des principaux problèmes est d'obtenir les dix à 20 % restants comme vous le souhaitez. Cela peut vous prendre un temps incroyable et beaucoup de frustration. Alors faisons-le. En pièce jointe, vous avez ce dossier. C'est l'un de nos sites Web précédents, et il y a cette fiche produit qui a l'air décente. OK, plutôt bien. Mais peut-être voulons-nous le rendre encore plus beau. C'est le but, non ? Améliorez-le. C'est le genre de chose qui peut très bien ou très mal tourner. Alors tentons notre chance. Accédez au menu principal pour archiver et ouvrez ce dossier. Vous avez une archive jointe au cours que vous devez d' abord extraire. D'accord, nous allons utiliser Cloud pour le moment, mais vous aurez une expérience similaire avec la plupart des modèles. Si vous êtes en mode d'essai, vous pouvez utiliser Cloud 3.5 ou Gemini Cela ne changera pas vraiment la partie importante de cette conférence. OK, maintenant, voilà le truc. Vous voudrez peut-être ouvrir ce site Web afin de voir à quoi ressemble ma carte existante. Ceci est mon site Web et je veux l'utiliser comme référence, d'accord ? Maintenant, nous pourrions potentiellement écrire toutes les modifications que nous voulons, ce qui nous permettrait d'économiser quelques crédits, mais je veux procéder étape par étape. Cela vous donne généralement de meilleurs résultats. Donc, une seule tâche à la fois. Disons donc ceci. Pour les avis figurant sur les fiches produits, ajoutez le score du produit à deux chiffres. Mettez le score en gras. Et c'est parce que si vous voyez simplement cinq étoiles sur tous les plans, il n' y a pas de bonne façon les séparer et de prendre une décision, n'est-ce pas ? Si un produit a un score de 4,51 contre un autre de 488, bien sûr, vous allez choisir le second, n'est-ce pas ? C'est logique. Donc oui, nous partons pour les courses. D'accord, cela demande un peu d'analyse, mais c'est typique lorsque vous importez le projet. Il va parcourir l'ensemble du code et essayer de comprendre ce qui se passe. Cela prendra quelques minutes. Je dois dire que le cloud 4 semble être un peu plus lent que le 3.7, mais ce n'est qu'une impression approximative, et cela ne dit pas grand-chose, car encore une fois, il existe de nombreuses variables. Après tout, ce qui compte, c'est si vous terminez le projet et atteignez vos objectifs, c'est comme si vous arriviez quelque part. Peu importe que vous ayez pris un Uber, votre propre voiture, le métro ou le bus. Ce sont tous des choix très différents avec des prix et des expériences différents, mais en fin de compte, cela dépend vraiment de vous Vous allez y arriver de différentes manières. Si vous êtes prêt à payer pour plus de confort, le bus n'est probablement pas une bonne idée. Mais si vous essayez d' être économe, le bus est peut-être le meilleur choix Le contexte, votre propre contexte, est donc vraiment important. OK, avance vite, et ça devrait être fait. Et voici exactement ce que je veux dire. Cela ressemble-t-il à ce que j' ai en ligne sur mon site Web ? Pas vraiment. Est-ce que ça a l'air horrible ? Non, bien sûr que non. Mais ce n'est pas ce que je veux. Le score n'a pas beaucoup de sens lorsqu'on l' associe au système stellaire. Si c'était 92 sur 127 évaluations, le score aurait du sens, mais les étoiles me rebutent. Et si vous êtes perfectionniste, ce genre de choses peut vous rendre fou Si vous voulez que les choses soient d'une manière très spécifique, cela vous demandera beaucoup plus d'instructions et beaucoup plus d'efforts Vous pourriez écrire l'invite de manière beaucoup plus détaillée. Mais continuons sur cette voie. Écrivons ce qui suit. Ajoutez un texte d'affichage détaillé en orange et en gras, sans arrière-plan, et ajoutez un bouton Ajouter à la carte avec un fond orange et un texte blanc Ces deux boutons doivent être placés côte côte sous le classement. OK. Maintenant, encore une fois, pourriez-vous le décrire d'une meilleure façon ? C'est une discussion importante. Bien sûr. Tu as une idée en tête. Dans ce cas, nous avons un gros avantage car nous pouvons voir la version live. Mais oui, tu dois faire de ton mieux et décrire ce que tu veux. Cela va demander beaucoup de patience et d' essais et d'erreurs. Tu dois t'entraîner pour t' améliorer. Il n'y a pas d'autre moyen. Vous devez apprendre à décrire les choses de manière à ce que le modèle comprenne vos objectifs. Le modèle ne prend pas tout en compte. Par exemple, l'existence du système stellaire. Non, tu as demandé le score à deux chiffres. Eh bien, tu l'as compris, non ? C'est comme ce dicton amusant qui dit à l'IA d'éradiquer toutes les maladies de la planète. Donc ça tue tout le monde. Bien sûr, techniquement, il n' y a plus de maladies, n'est-ce pas ? Techniquement, cela a fait le travail, mais ce n'est évidemment pas ce que nous voulions. Vous devez donc faire très attention à vos instructions. OK, revenons-y. Voyons comment ça se passe. OK, au bout d'un moment, c'est fait. N'oubliez pas de toujours accepter toutes les modifications. Nous pouvons maintenant l'actualiser. Et oui, encore une fois, c'est plutôt bon. Est-ce exactement ce que je voulais ? Non, pas vraiment. C'est tout ce dont tu dois te rendre compte. Peu importe le modèle que vous utilisez. Bien sûr. Il y a une question sur la qualité de mon message. Je pourrais le décrire plus en détail, non ? Peut-être fournir une image, peut-être lui montrer un design réalisé par Figma Bien sûr, mais ça fonctionne un peu plus. Et je ne suis pas contre le travail sur les mods. Ce n'est pas ce que j'essaie de dire. Je dis simplement que vous devez être préparé à ce flux de travail. Tu as obtenu 80 à 90 % de ce que tu voulais. Pour le reste, c'est vraiment très délicat. Permettez-moi donc d'essayer une dernière invite. Déplacez le poids du produit vers la droite du prix, alignez le poids avec le bouton Ajouter à la carte, rendez le bouton Ajouter à la carte bleu, modifiez le poids des détails du gras au normal. OK, et voyons comment ça se passe. D'ailleurs, même si vous pouvez créer une boutique à 100 % avec un curseur, j'utiliserais toujours Woo Comers basé sur WordPress, ou peut-être même faire des achats si je le faisais pour un tel projet, simplement parce qu'ils sont super établis, mes 0,02 La seule exception serait une boutique très simple basée sur très peu de produits, ou peut-être quelques pages de destination pour un produit. Mais oui, y revenir, c'est, encore une fois, décent. Ce n'est tout simplement pas parfait. Ce n'est pas ce que je veux. Nous pourrions passer dix, 15 20 demandes supplémentaires ou nous pourrions essayer différentes approches pour nous rapprocher de ce que je souhaite Mais je préfèrerais vous dire ceci, m'en contenter. Cela ne fera ni réussir ni défaire votre projet. Ne soyez pas perfectionniste, s'il vous plaît. Lancez-le dès que possible, voyez comment il se passe, découvrez ce que les gens en disent, puis peaufinez-le. Il est si facile de se focaliser sur les détails, mais je te promets que tu vas juste être perdant. Et je parle par expérience. Lancez-le puis polissez-le. Et avec ça, continuons. 14. De Figma à Cursor ?: Reviens. Le rêve de coder un design réalisé Figma en quelques secondes ne s'est pas encore concrétisé. Du moins, pas dans le curseur. Nous avons un MCP Figma grâce auquel nous pouvons donner accès au curseur à mes créations réalisées dans Vous devez configurer un jeton dans les paramètres de votre Figma. Ce n'est pas très compliqué, mais il faut être un peu patient. Au fait, ne travaillez pas ensemble. Il suffit de regarder et de voir ce qu'est le présent, voici le truc. Ça a l'air génial, non ? L'IA peut analyser toutes vos décisions prises dans Figma, puis les mettre en œuvre de manière parfaite au pixel près Après tout, c'est là que nous avons du mal. Les dix ou 20 % derniers, ces détails. Mais même si cela semble incroyable, cela ne fonctionne pas. À la date de cet enregistrement, il fonctionne mal, quel que soit le modèle que vous utilisez. Je l'ai essayé avec Claude, avec Gemini, avec GPT, et les résultats vont de mauvais à l' impossibilité de terminer la tâche. Le flux est simple. Vous concevez une belle page dans Figma, puis vous copiez cette page spécifique en utilisant le lien de copie vers la sélection Il s'agit essentiellement de l'adresse de cette page en particulier. Ensuite, vous pouvez démarrer un nouveau projet et une nouvelle fenêtre, créer un nouveau dossier, comme toujours, puis indiquer le modèle de votre choix, implémenter ce design, puis ajouter le lien. Cela devrait être aussi simple, aussi simple que cela. Mais pour une raison ou une autre, cela ne fonctionne pas. Quand les choses changeront dans le curseur, je vous le ferai savoir. Mais pour l'instant, je ne pense pas que ce soient des crédits bien dépensés. autre côté, je recommande vivement mes cours de conception Web, et ce n'est pas parce que vous devriez apprendre Figma par vous-même, mais parce que les principes de conception contenus dans ce cours font la différence Des éléments tels que le contraste, le fait de s'assurer que les gens voient ce qui compte, la hiérarchie, le guide , les grands titres, les boutons effacés etc., les espaces blancs. Plus c'est mieux. Laisse les choses respirer. Ne regroupez pas les choses, symétriquement et alignement, gardez-les propres, bien rangées. Typographie, pas seulement de belles polices, mais aussi des tailles, un poids et un espacement appropriés Maintenant, comme vous êtes sur le point de le découvrir, ces plateformes de codage nous aident à résoudre tous les codes compliqués, bien sûr. Mais si vous voulez un design raffiné, quelque chose de beau, vous devez connaître ces principes afin de pouvoir guider le modèle. Tu dois savoir ce que tu veux demander. Des choses comme augmenter le rembourrage de la carte, faire en sorte que ce texte soit H deux, celui-ci H trois, ou comment certains boutons doivent être remplis Alors que les autres doivent être du texte pur. est ce que je vous enseigne dans mes cours de design, et je vous promets que ce n' est pas une publicité. Ce n'est pas moi qui essaie de te vendre un autre cours. Non, c'est ce dont vous avez besoin pour faire passer vos instructions au niveau supérieur et obtenir de meilleurs résultats. C'est ce dont vous avez besoin pour mieux décrire vos idées. Et c'est marrant, le mannequin hallucine et dit que le site web est terminé Le problème est qu'il n'y a aucun fichier dans ce projet. Vous pouvez le voir sur le côté gauche. Rien ne s'est passé C'est très drôle. Et voici le deal. Vous pouvez indiquer au modèle que vous avez besoin d'aide pour consulter le site Web. Mais oui, les résultats seront tout aussi horribles. Permettez-moi d' avancer rapidement et de vous montrer quelque chose. Le modèle s'est rendu compte que le dossier était vide, il a donc essayé de créer le site Web. Mais ce qu'il a réellement fait, eh bien, c'est à vous d'en juger. Encore une fois, je suis sûr que cela va aller de mieux en mieux, et dans quelques mois, il est fort probable que cela soit possible. que cela se fera dans le curseur ou directement dans figma, Je ne suis pas sûr que cela se fera dans le curseur ou directement dans figma, mais je suis sûr que cela se fera de Figma au code fonctionnel À l'heure actuelle, vous pouvez clairement voir comment le modèle invente quelque chose qui, vous savez, n'a aucun sens, mais c'est ce qu'il fait pour ne pas échouer complètement. Ça n'a aucun sens. Mais oui, toute façon, cela ne sert à rien. N'utilisez pas le Figma MCP pour le moment. Cela étant dit, continuons. 15. De l'idée au curseur en passant par Vercel et au site web en direct: Reviens. Laissez-moi vous expliquer le processus de création d'un site Web en ligne avec votre propre nom de domaine en très peu de temps. Nous allons commencer avec un curseur de projet totalement vide, un dossier vide, non ? Créez une version fonctionnelle de ce site Web qui s'exécute localement sur notre propre ordinateur. Ensuite, lorsque nous en serons satisfaits, nous l' enverrons sur Github Vous pouvez penser à Github comme Drawbox ou Google Drive. C'est un endroit sur le Web où vous pouvez stocker tous vos fichiers. Tu peux les y garder. Vous y avez accès depuis n'importe quel appareil, et si vous souhaitez les partager, c'est assez facile à faire. Maintenant, une fois le site Web sur Gid Hub, nous allons l' envoyer à Versell Verll est une plateforme qui va nous aider à publier le site Web afin que tout le monde puisse le voir En bref, VerSL remplace une société d'hébergement. Une fois que vous l'avez importé avec succès depuis GitHub, il fonctionne bien, alors vous aurez un lien assez moche. C'est la dernière chose. Donc quelque chose comme ça. Mais cela reste accessible à tous. Vous pourriez donc potentiellement partager avec vos amis, votre famille. Vous pouvez le montrer au client. Il fait le travail, non ? Mais si vous voulez passer à l'étape suivante, vous pouvez acheter un nom de domaine directement sur Versell cresbarn.com avec quelque chose, attendre quelques heures, puis vous aurez votre propre adresse, comme je l'ai dit, cresbarn.com Une fois que tout est configuré et fonctionne bien, voici le truc. Vous pouvez revenir sur Cursor et continuer à apporter des améliorations. génial, c'est que vous pouvez demander à Cursor de mettre à jour Github, et il le fera automatiquement Et voici le truc marrant. Ensuite, Versell va également se mettre à jour automatiquement. C'est donc assez facile à faire. Le plus dur a été de tout mettre en place au début du cours. Maintenant, il suffit de suivre les mouvements, de déboguer, de corriger des choses, etc., n'est-ce pas ? Maintenant, ces problèmes peuvent nous prendre cinq ou six instructions ou 15 minutes, ou nous pouvons être malchanceux et nous pouvons avoir besoin de 15 20 instructions, peut-être quelques heures, peut-être pas mal de tête Mais oui, ça fait partie du jeu. Donc, pour récapituler, nous allons commencer par une bonne invite, quelque chose avec une bonne quantité de détails Ensuite, nous allons commencer à créer le curseur. Lorsque nous aurons terminé, nous publierons Github puis sur Versell, afin que le contenu soit en ligne et partageable Maintenant, vous vous demandez peut-être, Chris, pourquoi nous sommes-nous inscrits à Superbase ? Eh bien, Superbse est idéal pour donner aux utilisateurs la possibilité de créer un compte Il va gérer les éléments complexes de la base de données, et avec la façon dont nous les configurons, il fonctionnera automatiquement. Pour l'instant, nous n'allons pas utiliser Super Base. Pour l'instant, nous allons créer un site Web solide du début à la fin, nous le publierons, et peut-être que plus tard nous ferons quelque chose d'un peu plus compliqué. Et, bien sûr, nous allons utiliser le renvoi pour envoyer des e-mails. Je suis vraiment excitée. Allons-y. Mettons-nous au travail. 16. Comprenons l'invite: Bon retour. Voici l'invite que nous allons utiliser tous les deux. Vous l'avez joint, et pour ce qui est des détails, c'est un six sur dix. Si vous participez à ce bal de fin d'année au son naturel et que vous essayez de l'améliorer dans le chat GPT, vous recevrez une invite beaucoup plus technique En général, cela aide, mais une demande compliquée peut être un peu écrasante, alors j'ai décidé de m'en tenir à quelque chose qui semble naturel. Nous marchons, puis nous courons. L'un des principaux problèmes est le suivant. Je dis bleu et blanc, mais d'habitude je fournis des codes de couleur. Tu dois être précis. Le bleu peut avoir tout, du bleu pâle très clair au bleu marine foncé et intense. Gardez donc cela à l'esprit. Plus vous incluez de détails, meilleur est le résultat. Je tiens à vous rappeler que même si vous faites tout exactement comme moi, votre site web sera différent du mien. C'est exactement ainsi que fonctionnent ces modèles. Mais je peux vous promettre que vous aurez des problèmes différents de ceux que je vais avoir. Je n'ai pas de boule de cristal, mais j'y travaille depuis assez longtemps pour savoir que c'est inévitable. Des problèmes vont survenir et ils vont être de toutes sortes. OK, configurez un nouveau dossier un nouveau projet et un nouveau curseur, les bases. Assurez-vous que tout est configuré comme nous l'avons fait dans la première partie du cours. Github, Python, pas de JS, tout fonctionne. En parlant de technologie, j'ai décidé de dire au modèle qu'il devrait utiliser Next JS et Tailwind, renvoyer le formulaire, puis Github et Versell Et voici pourquoi je l'ai fait. Au début, vous commencez par une vague demande très basique, comme Make me a website, n'est-ce pas ? Et puis vous voyez ce que les modèles SMOT recommandent, ce qu'ils utilisent Nous avons déjà vu comment certains d'entre eux ont choisi HTML, le CSS et le JavaScript de base, tandis que d'autres ont recommandé quelque chose d'un peu plus robuste, un peu plus technique, exactement ce que j'ai écrit ici, puis le JS, etc. Si le modèle que vous préférez souhaite utiliser ce textag, si vous voyez un motif, prenez-le en note Et la prochaine fois , suggérez-le. C'est exactement ce que j'ai fait ici. Et j'ai également fait ce qui suit. J'ai parlé à quelques codeurs, et j'ai juste demandé : OK, pourquoi tailwind ? Pourquoi pas celui-ci ou celui-là ? Pourquoi réagir ? Pourquoi pas ceci ou cela ? Bref, chacun semble avoir ses propres préférences. Certaines personnes aiment BMW Pepsi et Android, d'autres comme Mercedes, le docteur Peppa, iOS, qui a raison ? Personne, évidemment. C'est ce que tu préfères. Et c'est un peu la même chose ici. Maintenant, à propos de l'invite, j'ai demandé ce que l'on appelle le PRD, un document sur les exigences du produit C'est pour que le modèle puisse clairement nous indiquer ce qui va se passer. Le PRD a l'air chic, mais c'est une sorte de liste de contrôle Vous savez donc où nous en sommes. C'est donc le PRD. Cela ne fait pas mal, alors incluez-le toujours. Ensuite, je veux ajouter quelques images. Bien que nous puissions utiliser un MCP pour en télécharger automatiquement, je pense que c'est exagéré. C'est trop. Au lieu de cela, j'ai fait ceci sur unsplash.com. J'ai sélectionné quelques photos qui fonctionneraient pour un vétérinaire. Ensuite, je suis passé à People pour les critiques, très basiques, très standards. Ainsi, après avoir configuré votre projet sur votre disque dur, vous devez copier l'adresse de ces photos et la coller dans l'invite principale. Nous avons deux places ici et ici. Chèvre. Maintenant, juste pour être clair, vous téléchargez des photos depuis Unsplash Vous les placez n'importe où dans le dossier. Ensuite, nous devrons déplacer ce dossier de mon bureau vers l'endroit où le curseur est configuré jusqu' à l'endroit où ce projet spécifique est configuré. Maintenant, dans mon cas, j'ai ouvert ce dossier, et c'est là que nous devons coller les images. Maintenant, pour obtenir une adresse depuis n'importe quel endroit, vous devez utiliser cette zone. C'est assez facile à obtenir. Pour les critiques, c'est exactement la même chose. Vous obtenez le chemin, puis vous le copiez dans le bal de fin d'année. D'accord, le reste de l'invite est en fait assez basique. La seule chose importante que je demande c'est un formulaire pour prendre rendez-vous. Mais le formulaire ne possède aucune fonctionnalité avancée. Je n'ai pas inclus de liste déroulante pour les services que le client pourrait souhaiter. Je n'ai pas inclus l'heure. L'heure nous obligerait à connaître les rendez-vous du médecin, son emploi du temps complet. J'ai donc choisi la version la plus simple. De plus, j'ai ajouté un numéro de téléphone pour qu'ils puissent également répondre aux appels de cette façon. L'idée est la suivante, vous pourriez potentiellement vendre ce site Web. Tant que quelqu'un répond à leurs téléphones et à leurs e-mails, un formulaire de contact de base fera l'affaire. Le site Web sera fonctionnel. Le cabinet peut rappeler le client et lui demander beaucoup plus d'informations et fixer ainsi un rendez-vous. Je tiens donc à être clair. Ce site Web peut fonctionner même dans sa version de base la plus simple, mais pour être honnête, vous pouvez toujours ajouter plus de fonctionnalités. Et vous pouvez utiliser cette base et l'adapter à n' importe quel autre type de créneau : restaurants, avocats, tout ce à quoi vous pouvez penser. Donc, oui, c'est le message. Il est temps de se mettre au travail. 17. Démarrez le projet: Bon retour. Pour ce projet, je vais utiliser Cloud Four car j'aime bien sa personnalité. Peu importe ce que vous choisissez de votre côté, vous allez avoir beaucoup de problèmes qui n' apparaîtront peut-être pas de mon côté. Alors, s'il te plaît, sois patient. Essayez de débugger et demandez de l'aide. Vous allez voir que votre patience est l'une des principales clés de votre réussite. Maintenant, commençons. C'est parti pour les courses. Le modèle dit qu'il va créer une page d' accueil pour une clinique vétérinaire professionnelle, d'accord ? Et il est en train de vérifier les actifs. Les actifs désignent simplement des ressources ou, plus précisément, dans notre cas, des images. Ensuite, nous allons créer le PRD, le document dans lequel nous allons voir tous les éléments essentiels du projet. Ouais, on y va. Cela va de la vue d'ensemble aux objectifs en passant par l'ensemble des technologies. Et ici, nous voyons ensuite JS, tailwind, resend, erslGitHub Et ce n'est pas comme si nous connaissions ces choses, n'est-ce pas ? Mais cela confirme que nous sommes sur la bonne voie et que le modèle nous a compris. Et si nous devons utiliser Google pour résoudre des problèmes, ces informations pourraient nous aider. Maintenant, je vais accélérer l'enregistrement de temps en temps, car le caillot 4 est assez complet et intelligent, mais voilà Parfois, c'est vraiment lent. est amusant, c'est que dans le PRD, j'ai remarqué quelque chose qui ressemble un peu à un drapeau rouge Il n'a pas passé le bon rapport. Il a dit que cela avait été créé en 2024, ce qui n'a évidemment aucun sens. Quoi qu'il en soit, le modèle travaille d'arrache-pied. Si vous regardez dans le panneau de gauche, vous verrez que cette zone commence à s'agrandir pour s'étendre, plus en plus de fichiers. Chose amusante, vous pouvez voir différents canaux, divers problèmes, mais le modèle semble les connaître. Maintenant, on peut s'attendre à ce que l'intelligence artificielle écrive un code parfait. Mais non, même l' IA se trompe. Au moins à ce stade, je suis sûr qu'au fil du temps, la situation va s' améliorer de plus en plus. Si vous êtes assez âgé pour avoir utilisé Windows 95 ou 98, et que vous le comparez maintenant à la dernière version de Windows ou à une version ultérieure de macOS, c'est jour et nuit, n'est-ce pas ? Ce sera exactement la même chose ici de WinM à Spotify. Mais voilà le truc. Tant que le modèle connaît ces problèmes et qu'il les corrige lui-même, cela ne nous intéresse pas vraiment , n'est-ce pas ? Ce n'est pas un problème pour nous de simplement siroter une tasse de café et d'attendre que tout soit fini. Donc, dans l'ensemble, tout va bien , même avec ces erreurs. Maintenant, certains fichiers prennent un peu plus de temps que prévu, mais je pense que c'est parce qu'ils sont assez volumineux. Avec ce modèle et ce textag, il fallait s'y attendre, en fait Et c'est une bonne idée d'y jeter un coup d'œil et de voir ce qu'ils contiennent. Vous pouvez le faire en un seul clic dans le panneau de gauche, cliquant sur n'importe quel fichier, et il s'ouvrira ici. La partie centrale fonctionne avec les onglets exactement comme votre navigateur. Il est donc agréable et facile de se déplacer. L'un des plus gros problèmes que vous allez rencontrer dans les projets plus importants et plus sérieux concerne la taille du fichier. Bref, en termes simples, plus les fichiers sont volumineux, il est difficile de les maintenir et de les mettre à jour. Mieux dit, il vaut mieux éditer trois fichiers 300 lignes de code au lieu d' un seul fichier de 900 lignes de code. Pour une raison ou une autre, cela fait vraiment trébucher le modèle. Dans nos règles relatives au curseur, nous mentionnons cela concernant les fichiers courts, mais le modèle n'en tient pas toujours compte. D'un autre côté, dans certains cas, il n'est vraiment pas possible de tout concentrer dans un rayon de 300 lignes. C'est donc quelque chose que vous pourriez avoir du mal à affronter plus tard dans votre carrière de codeur Vibe Maintenant, mon conseil, commencez par des projets plus petits et plus simples, et encore une fois, soyez patient. Et c'est parce que nous recevons des mises à jour sérieuses toutes les deux semaines. Ce n'est donc qu'une question de temps avant qu'ils ne deviennent de plus en plus intelligents, et cette expérience sera magique. Ce ne sera pas avec autant de maux de tête. Il faut savoir que lorsque le modèle aura terminé son travail, parce que nous avons utilisé ce textag, cette technologie, nous aurons un serveur local, ce qui signifie que nous n'aurons pas un seul fichier d'index par lequel nous pourrons tester le site Web Il n'y a donc aucun fichier d'index que nous allons utiliser. Maintenant, au lieu de cela, nous allons obtenir une adresse qui va commencer par l'hôte local. Maintenant, je ne vais pas entrer dans les détails techniques. Cela n'a pas vraiment d'importance . Ce que vous devez savoir, c'est que la version initiale du site Web ne fonctionnera que sur votre ordinateur. Tu ne pourras pas le partager avec quelqu'un d'autre. Maintenant, si vous restez avec moi jusqu'à la fin, bien sûr, nous allons utiliser Versell et, grâce à cela, nous allons publier le site Web sur le Web afin que tout le monde puisse le voir Alors restez avec moi jusqu'au bout. Voici maintenant quelques problèmes. Le modèle essaie de démarrer un serveur local, mais il semble que cela ne fonctionne pas. Il ne nous demande rien, donc tout va bien. Neuf fois sur dix, Claude va le découvrir. Il essaiera à nouveau, ou il essaiera une approche différente. Et j'adore ça. J'ai déjà utilisé cette combinaison de technologies par le passé, et je sais que le renvoi nécessitera une clé Juste pour vous rappeler que lorsque quelqu'un remplit un formulaire de contact et l'envoie, un e-mail doit être envoyé à la clinique, n'est-ce pas ? Pour cela, nous avons besoin d'un service, d'un fournisseur qui puisse nous aider à envoyer cet e-mail. Et dans notre cas, nous avons choisi de renvoyer. Resend va nous aider. Nous y avons créé un compte, mais nous devons connecter resend à ce projet spécifique, et cela se fait via une seule clé Maintenant, le mannequin va nous demander cette clé. Nous allons nous en occuper, mais plus tard, je voulais simplement expliquer le processus. J'adore le fait que ce modèle soit bavard, qu'il m'indique comment la construction est généralement réussie et qu'il comporte quelques avertissements à prendre en compte C'est fantastique. Et c' parce que c'est un modèle de pensée, donc c'est un peu plus expressif. Maintenant, je ne peux qu'imaginer à quel point il est difficile d'être développeur, vous savez, de tout connaître par cœur, tout mémoriser, devoir beaucoup utiliser Google. Je pense que c'est incroyablement difficile. Je suis donc très heureuse que nous ayons le curseur de notre côté. présent, nous ne lui avons donné qu' un seul message, un seul bout du fil, une seule demande, un seul crédit. Et jusqu'à présent, de nombreux progrès ont été réalisés. Vérifiez simplement sur le côté gauche pour voir combien de fichiers il a créés. Ce sont des milliers de lignes de code. Je suis plus qu'heureuse de payer 0,04$ pour une telle quantité de travail. C'est fantastique. Mais bien sûr, après environ 25 actions, le modèle reçoit l'ordre de s'arrêter. Certains disent que c'est parce que le curseur veut que vous consommiez plus de crédits. Il s'agit donc d'une décision motivée par des raisons financières. Je ne pense pas que ce soit le cas. D'autres disent que c'est une bonne idée que le modèle s'arrête de temps en temps, afin que vous puissiez réellement revoir le travail et le remettre sur la bonne voie en cas de problème Quoi qu'il en soit, dans tous les cas, en tant que cods vibe sans aucune connaissance technique, nous allons appuyer sur le bouton de reprise de la conversation parce que nous voulons qu'elle continue Mais faisons-le après la pause rapide. Je vais te voir dans une seconde. 18. Comment gérer les insectes: Reviens. Nous avons fait beaucoup de progrès, mais il est normal que le modèle s' arrête après environ 25 étapes. Nous devons reprendre la conversation, ce qui signifie essentiellement que nous confirmons, que nous sommes sur la bonne voie et que le modèle peut continuer, mais voilà. Immédiatement après avoir cliqué, voici l'un des plus gros problèmes actuels avec le curseur. Il indique que la connexion a échoué. Vérifiez votre connexion Internet ou votre VPN. C'est vraiment frustrant. Il n'y a aucun problème avec mon accès à Internet et je n'utilise pas de VPN. Il s'agit d'un problème bien connu. Le curseur fonctionne, mais pour le moment, cela arrive encore de temps en temps. Les quatre pièces sont remplies de nombreuses personnes qui s'en plaignent. Maintenant, cela n'est pas confirmé, mais je pense que cela pourrait affecter notre projet. Lorsque le modèle s'arrête au milieu d'une phrase, lorsque l'IA est obligée de s'arrêter alors qu'elle avait prévu cinq, dix ou 15 autres étapes, ce n'est pas idéal. Malheureusement, le bouton « Réessayer » ne fonctionnera pas , peu importe combien de fois vous cliquez dessus. Vous pouvez essayer, mais cela ne marchera pas . Maintenant, voici le truc. Je préfère essayer de cliquer sur Accepter qui est caché derrière. C'est pour que nous puissions enregistrer tous les progrès réalisés jusqu'à présent. Vous devez faire une pause, attendre quelques secondes, puis enfin, si vous cliquez assez vite, vous pouvez accepter toutes les modifications. C'est ce que je vous recommande de faire également, même si je sais que cela peut être assez triki, c'est ce que je voulais dire en disant que nous sommes en avance Ce sont les problèmes qui peuvent vous ennuyer. En fait, tu dois rester calme et essayer de continuer. Dans ce cas, pour y remédier, deux choix s'offrent à vous lancer une nouvelle conversation ou redémarrer le programme. Je vais opter pour la deuxième option, alors fermez le programme, attendez quelques secondes, puis redémarrez-le. Ensuite, bien sûr, attendez encore quelques secondes jusqu'à ce qu'il se charge, et vous verrez la conversation précédente et le problème. La seule chose que nous pouvons faire pour le moment est de taper continue, et cela fonctionnera. Le modèle va analyser le projet, les progrès réalisés jusqu'à présent, et il va essayer de continuer. Maintenant, est-ce que c'est horrible ? Non, bien sûr, mais ce n'est pas idéal non plus, car le modèle continue. Il a encore beaucoup de choses à faire. Mais oui, j' espère vraiment que de votre côté, vous pourrez essayer d'éviter ce problème. J'espère que vous aurez de la chance au moins pour votre premier grand projet. Mais il faut savoir qu' fur et à mesure que vous travaillerez avec le curseur, cela deviendra inévitable. Je vais accélérer les choses jusqu'à ce que nous atteignions un point de sauvegarde, pour ainsi dire. Maintenant, une chose que j'adore, c'est d'avoir un fichier appelé statut du projet, où le modèle nous indique ce qui se passe. C'est très utile, et c'est une bonne idée d'y jeter un coup d'œil de temps en temps pour voir ce que le modèle a fait, ce qu'il a réalisé. Maintenant, je ne suggère pas que vous lisiez le code réel, mais c'est une bonne idée de vous habituer au fonctionnement de ces modèles, à leur fonctionnement. Avec le seul codage Vibe, il est peu probable que vous deveniez un véritable codeur, mais ce n'est pas l'objectif Nous pouvons cependant créer des trucs sympas et lancer des produits, lancer des sites Web. C'est l'objectif. OK, passons à autre chose. OK, voici le résumé, et il est énorme. Il y a beaucoup de choses à parcourir. Le modèle nous en dit long sur les progrès réalisés, mais je vais juste trouver l'adresse du site Web. Local host 3,000, copiez-le puis collez-le dans votre navigateur. Jetons donc un coup d'œil au site Web. Cela ne nous a pris que quelques minutes et quelques instructions. Bien sûr. Donc des problèmes, mais oui, je pense que c'est bon. Et oui, j'en suis très content. La première impression est géniale. Pour être honnête, le message était en anglais, mais pour une raison ou une autre, le modèle a rendu le site Web assez amusant dans ma propre langue locale. Maintenant, je suppose que c'est à cause de l'adresse que j'ai indiquée, d' une drôle de façon dont cela fonctionne. Maintenant, nous pouvons le traduire plus tard, mais oui, c'est quelque chose à noter. Le site Web a l'air professionnel et assez moderne. Mais je ne sais pas pourquoi les photos n'apparaissent pas. C'est quelque chose que nous devons également corriger. Maintenant, voici le truc. L'objectif est de tirer les leçons de chaque erreur. À moins de passer par plusieurs projets, vous ne pouvez pas vraiment acquérir cette précieuse expérience. Je suis donc ouvert à tous les problèmes, à tous les bugs. Par exemple, toutes les images d'Unsplash sont énormes, tant en taille qu'en poids Dans l'idéal, nous les aurions optimisés. Nous pourrions utiliser Tiny PNG. Nous pourrions utiliser ilovemg.com. Mais parce que nous l'avons ignoré, cela peut-être causé ce problème C'est peut-être pour ça que ça ne marche pas. Mon conseil pour l'avenir est de prendre des précautions. Par exemple, pour ce qui est de la langue, j'ai simplement supposé qu'elle utiliserait anglais parce que l' invite était en anglais. Mais comme vous pouvez le voir clairement, ce n'est pas correct. Ce n'est pas le cas. C'est donc l'approche que vous devez adopter. Vous apprenez à travers ces petites erreurs et vous adaptez votre approche. Idéalement, bien sûr, le modèle serait assez intelligent, mais il ne peut pas lire dans nos pensées. La prochaine fois, vous devrez donc mentionner que vous souhaitez que le site Web soit en anglais et que vous devriez optimiser les images au préalable. Et cependant, pour la version mobile, vous pouvez réellement redimensionner votre navigateur ou utiliser un raccourci clavier C'est pour Firefox. Vous pouvez même choisir différentes tailles de téléphone. Mais l'important est de rechercher les problèmes majeurs, les problèmes d' espacement, les problèmes d'alignement , etc. Mais oui, Cloud Four fait généralement du bon travail. Et oui, dans l'ensemble, je suis content. Ce n'est pas un design fantastique, mais il est très solide, et je pense que la plupart des entreprises auraient plus de clients à traiter avec. OK, faisons une petite pause. 19. Mettre la forme au travail: Bon retour. Le site Web a l'air plutôt bon, mais je suis sûr que nous pouvons le traduire, l' améliorer de différentes manières. Mais l'essentiel, c'est la fonctionnalité. Nous avons une fonctionnalité importante ici, et c'est le formulaire de contact. le moment, il n'est connecté à rien, donc il ne fonctionnera pas. Maintenant, voici le truc. Si nous le remplissons et que nous essayons d'envoyer un message, cela indiquera que cela fonctionne que la demande a été envoyée. Mais ce n'est pas possible car il n'est connecté à rien. C'est donc un autre point sur lequel il faut être sceptique. Au cas où vous n'en seriez pas sûr, vous pouvez simplement demander au modèle. Hé, où sont envoyés les e-mails ? Et cela devrait vous indiquer que cela ne fonctionne pas réellement. Dans le passé, j'ai vu Cloud 3.7 afficher une erreur, un problème, un problème, et c'est une bien meilleure approche, car en tant que codeurs Vibe, nous pouvons nous laisser berner par C'est pourquoi je préfère signaler ces situations. Si tu ne le sais pas, tu es peut-être stupide. Mais oui, pour y revenir, nous avons un compte de renvoi, et je dois créer une clé pour que le formulaire fonctionne Ce que j'aime dans le fait de renvoyer, c'est qu'une fois que vous vous êtes connecté, le tout premier bouton que vous voyez est d'ajouter une clé d'API, et c'est exactement ce que nous voulons. Et voilà le truc. Vous cliquez dessus une fois, et vous allez voir ces points, et c'est tout. Je l'ai déjà dit, les clés API doivent être protégées exactement comme votre numéro de carte de crédit. Et laissez-moi vous expliquer pourquoi. Supposons qu'il s'agisse de mon compte réel et que je m'abonne au plan payant. Pour cela, je vais devoir ajouter ma carte de crédit, bien sûr, mais c'est pareil avec le curseur. Vous aurez besoin d'un plan payant après un certain temps pour en tirer le meilleur parti. OK, maintenant, disons que je montre mes clés à des dizaines de milliers d'étudiants. Ils le copiez-collent dans leurs propres projets, et ils commencent à l'utiliser, non ? Et au bout d'un moment, je reçois des centaines de dollars en frais, peut-être des milliers. Pourquoi ? Parce que tous leurs projets utilisaient ma clé. Donc mon compte, donc ma carte de crédit. Ils commencent à envoyer des e-mails et, bien sûr, les renvoyer me facturera Et c'est ainsi que fonctionnent ces touches. C'est pourquoi la plupart des plateformes ne vous montreront votre clé qu'une seule fois et vous devrez la coller dans un fichier séparé. Vous ne pourrez pas le voir à nouveau sur la plateforme lors du renvoi. Bien sûr, vous pouvez toujours créer une nouvelle clé, et cela ne vous coûtera rien, mais ce n'est pas idéal d'avoir des tas de clés sans savoir lesquelles. C'est pourquoi je vais masquer mes clés privées. OK, revenons au projet, vous pouvez créer un fichier qui stockera toutes vos informations sensibles. Mais ma première approche, mon approche préférée, consiste à demander au modèle de m'aider. Alors écrivons ceci. J'ai une clé d'API de Resend Veuillez l'ajouter au projet, et je vais le coller dans une minute. Ensuite, je vais également lui envoyer deux e-mails spécifiques, ce que vous devez faire également. Nous avons un e-mail, qui est une adresse standard qui doit être la suivante délivrée à resend point dev C'est à des fins de test. Si vous souhaitez envoyer des adresses e-mail réelles, vous aurez besoin d'un nom de domaine vérifié, comme resbarn.com ou autre. Maintenant, pourquoi ça ? Eh bien, je suis sûr que vous avez vu des e-mails comme celui-ci. s'agit donc de spams prétendant provenir de Netflix, d' Amazon ou de votre banque. Mais elles sont, bien sûr, fausses. Ils veulent voler l'information. Et si vous vérifiez l'adresse, vous verrez qu'il ne s'agit pas de l'e-mail professionnel officiel de cette entreprise en particulier. C'est donc ce que le RSnD essaie d'empêcher. Vous ne pouvez pas ajouter une fausse adresse e-mail ici. Bien sûr, nous n'en avons pas un vrai car il ne s'agit que d'un projet de test, n'est-ce pas ? C'est pourquoi vous devez utiliser cette adresse spécifique à des fins de test, livrer au point de renvoi Maintenant, le deuxième e-mail, c'est ici qu' il va arriver. Donc, une fois que vous aurez rempli le formulaire, qui recevra ce message ? Maintenant, il doit s'agir de l'adresse e-mail que vous avez utilisée pour vous inscrire pour le renvoyer Vous ne pouvez donc utiliser aucun autre e-mail. Il doit s'agir de celui que vous avez utilisé lors du renvoi lors de votre inscription. Encore une fois, tout cela est à des fins de test. Si vous n'êtes pas sûr, vous pouvez revenir en arrière pour renvoyer, vérifier votre compte et voir quel e-mail vous avez utilisé Si vous ne suivez pas ces instructions, le formulaire ne fonctionnera pas, et vous serez en colère contre le curseur pour ne pas avoir fait son travail. Mais le modèle, il se peut qu'il passe en revue l'ensemble du code. Il peut essayer de réparer les choses, mais il est évident que cela ne fonctionnera pas si vous ne suivez pas les instructions de renvoi Mais voilà le truc. Une fois que vous avez compris comment utiliser cette plateforme, vous êtes en or. Vous allez être prêt pour tous vos projets. C'est pourquoi ce n' est pas grave. OK, voyons ce que fait le modèle. Le fichier qui stocke toutes vos clés et mots de passe s'appelle env point local Pour une raison ou une autre, cela est bloqué. Le modèle doit donc créer un autre fichier appelé example. C'est très intéressant. Nous verrons si le modèle s'en sort. J'adore le fait que Claude soit résilient et qu'il n'abandonne pas immédiatement. Il essaie différentes solutions, différentes commandes. Cela ne fonctionne pas toujours, mais c'est agréable de voir que cela fait des efforts. C'est faire des efforts. Lorsque vous programmez des vibrations, vous pouvez être tenté de regarder votre téléphone ou de vous éloigner, mais je vous encourage à rester concentré, même si cela peut parfois être ennuyeux Au bout d'un moment, le modèle dit qu'il va résoudre le problème de l'image. Et c'est marrant, je n'en ai pas parlé. C'est un drapeau vert. C'est un point positif. La question est si cela résoudra réellement le problème ? Nous allons voir. OK, passons à autre chose et voyons le résumé. C'est marrant, parfois dans le résumé, il peut vous montrer votre clé d'API. Je vais brouiller les choses, bien sûr. Mais oui, nous avons ici quelques détails, et les étapes deux et trois sont exactement ce que je prévois. Visitez le site Web et testez le formulaire. OK. Mais la première étape indique que je dois démarrer le serveur moi-même. Et si nous essayons de rafraîchir le site Web, nous verrons que cela ne fonctionnera pas. OK, donc on ne peut pas vraiment sauter cette étape. Maintenant, le fait est qu'il aurait pu le faire tout seul, mais gérons-le nous-mêmes. Il y a un petit bouton d'exécution sur le côté. Cliquez dessus, et vous verrez en bas du terminal comment le serveur redémarre. C'est un peu frustrant, mais ce n'est pas grave. Après quelques secondes, nous pouvons revenir au navigateur et actualiser. La première chose que je veux vérifier, ce sont les images. Je serais extrêmement impressionné s' il réglait ce problème sans que je lui demande de le faire Mais non, ça ne les a pas vraiment réparés. Bien, concentrons-nous sur le formulaire. C'est l' essentiel. Je suis sûr que nous recevrons un message de réussite comme avant. Nous nous assurerons que les e-mails sont envoyés en consultant bord de renvoi, puis en consultant mon adresse e-mail personnelle Mais oui, ici ça ne marche pas. Maintenant, voici le truc. Claude dit que nous devons créer le fichier EMV à points nous-mêmes, donc il n'a pas réussi à le faire tout seul. Encore une fois, ce n'est pas l'idéal. Cela nous donne le code exact. Copions-le donc en utilisant cette toute petite icône ici. N'oubliez pas d'agrandir votre interface si vous ne la voyez pas bien, Control plus. OK, je ne suis pas très content, mais allons-y. Cliquez donc avec le bouton droit de la souris dans le panneau de gauche. Dans cette liste, choisissez un nouveau fichier. Ensuite, appelez-le exactement comme le curseur dit point nv point Local. OK, alors à l'intérieur, collons ce que nous avons précédemment copié. Ce seront la clé et les deux adresses e-mail. Pour être honnête, je ne sais pas si le serveur doit être redémarré, mais je vais actualiser le site Web et utiliser à nouveau le formulaire Ensuite, nous partirons de là. En attendant, je vais dire à Cursor que les images chargent pas et que j'ai créé le fichier EMV à points Je pense qu'il devrait savoir que nous avons créé le fichier manuellement. Mais voilà le truc. En fait, le mail est arrivé. Donc, victoire, c'est une bonne chose. Fantastique Inutile d'en parler à Cursor. Cela fonctionne tout simplement. Très intéressant Vous pouvez également le vérifier dans le tableau de bord récent. Vous allez voir qu' un e-mail a été envoyé il y a quelques secondes. Des trucs tellement géniaux. Nous avons fait fonctionner notre formulaire. Félicitations. N'hésitez pas à le tester à nouveau. Mais oui, je suis content que nous ayons réussi, sans trop de maux de tête. Faisons une petite pause. 20. Corriger les images qui ne se chargent pas: Bon retour. Le site Web est plutôt beau et nous avons fait de grands progrès, mais voici le truc. Les images ne se chargent pas. L'approche est assez simple. Dites exactement cela au modèle. Il n'est pas nécessaire de fournir un contexte supplémentaire. Claude devrait revoir le code et découvrir quel est le problème. Maintenant, il réfléchit pendant près d'une demi-minute. Waouh. OK, jusqu'à ce qu'il trouve une solution. Mais après cela, il indique qu' il a identifié le problème. Maintenant, même si cela fonctionne en arrière-plan, vous allez remarquer qu'il ment parfois. Ouais, je l'ai dit. Il peut dire qu'il l'a compris, mais en réalité ce n'est peut-être pas le cas. Il existe de nombreuses images amusantes sur Reedit à propos de cette situation Beaucoup de personnes ont donc vécu la même chose. Ou de la même manière, il est écrit : Oh, vous avez raison, mes excuses lorsque vous signalez quelque chose qu'il n'a clairement pas fait Maintenant, la première fois que vous voyez ces messages, il se peut que vous ayez une réaction positive. Mais après les avoir vus pour la 20e fois, cela devient un peu ennuyeux. Ici, nous pouvons voir qu'il fait tout un tas de choses. Et après un certain temps, il vérifie même le fichier point ENV que nous avons créé auparavant Nous l'avons fabriqué conformément à ses instructions. C'est intéressant qu'il soit en train de vérifier. Cela n'a aucun lien avec les images, mais bon, d'ailleurs, remarquez le panneau de gauche, des tonnes de fichiers créés en quelques minutes avec juste quelques instructions Ce sont des choses fantastiques. Mais pour être honnête, personne ne s'intéresse vraiment à ce genre de choses. Tout ce qui compte, c'est le résultat final. Et si le projet atteint réellement ses objectifs, à savoir obtenir plus de prospects pour générer des revenus, développer l'activité réelle, nous n'essayons pas de générer des milliers de lignes de code, nous sommes là pour résoudre les problèmes, pour aider les entreprises à accéder à un site Web bien optimisé livré en quelques jours seulement OK, intéressant. Il va vérifier la fonctionnalité du courrier électronique, ce que je n'ai pas demandé. Maintenant, est-ce une bonne ou une mauvaise chose ? D'un côté, je suis heureuse qu'elle veille sur nous et qu'elle vérifie que le projet est bien construit. OK, c'est bien. Mais d'un autre côté, nous lui avons dit de corriger les images, ne pas regarder la clé de renvoi ou de vérifier le formulaire, n'est-ce C'est peut-être un mauvais signe. Cela peut montrer que le modèle ne se concentre pas sur la tâche à accomplir. C'est pourquoi je vous demande constamment de le tester, créer quelques projets avec différents modèles du début à la fin et de voir quelle personnalité vous préférez. une chose que je pourrais changer de modèle dès maintenant ou à tout moment, mais d'après mon expérience, je ne le recommande pas. À moins que vous ne soyez vraiment coincé et le modèle tourne en rond, je ne pense pas que ce soit une bonne idée de changer. Maintenant, voici le truc. Lorsque j'ai changé pour quelque chose d' assez important, le nouveau modèle était en fait bouleversé par l'ancien modèle. Il n'était pas d'accord avec la structure du projet, avec la façon dont le code a été écrit. C'était très amusant à voir. C'est comme si j'étais vraiment déçue que quelqu'un n'ait pas fait un travail assez bon. C'était donc fantastique. Et plutôt que de continuer avec l'ancien modèle laissé de côté, il a en fait commencé à réécrire différentes parties du code, même si je ne l'ai pas demandé C'est pourquoi je n'arrête pas de dire que ce qui se passe ici est peut-être une bonne ou une mauvaise chose. Mais passons au résumé. Dans la plupart des cas, il dira que c'est réglé, mais vous devez toujours être sceptique et vérifier trois fois. Jetons donc un coup d'œil et voyons. Et oui, c'est exactement ce que je veux dire, problèmes à gauche et à droite Mais le problème. C'est une chose à laquelle tu dois t'habituer. Tout ce que nous avons à faire est de copier tout et de le coller à nouveau dans le curseur. D'ailleurs, vous verrez parfois quelques fichiers référencés au-dessus du chat. Vous pouvez les laisser ou les fermer. Cela dépend vraiment de la situation. Ici, je ne pense pas qu'ils en aient besoin , alors je vais les fermer. Maintenant, autre chose, nous pourrions potentiellement connecter ce navigateur à Cursor, mais je préfère simplement copier-coller certains problèmes. La plupart des gens disent qu'ils ont une meilleure expérience en utilisant le navigateur Brave en combinaison avec le curseur. Mais je préfère m'en tenir à Firefox et simplement copier-coller les problèmes. OK, juste en passant, il semble que le problème ait quelque chose à voir avec la mise en cache. OK, c'est bon pour nous. C'est très bien Nous attendrons que le modèle le corrige. Cela peut prendre un certain temps, mais je vais accélérer les choses. Bon, maintenant, regardons le résumé. Encore une fois, le modèle indique que c'est réparé. OK, testons-le. Aujourd'hui, l'un des plus gros problèmes du codage Vibe est de faire confiance au modèle, de faire confiance à l'intelligence artificielle. voyez, s'il s' agit de petites choses, que se passe-t-il lorsque vous avez un vrai projet ou un vrai client et que des milliers de dollars sont en jeu ? C'est le plus gros problème. Les problèmes, les bogues, c'est bien. Nous pouvons les réparer. Tout va bien. Mais encore une fois, cela ne fonctionne pas ici. Les instructions ne nous disent pas que nous devons faire autre chose. Il suffit de visiter le site Web et les images devraient se charger parfaitement, mais cela n'arrive pas. Je le souligne parce que parfois nous pouvons sauter quelque chose. Vous savez, il se peut que nous devions faire quelque chose manuellement, et si nous ne lisons pas correctement le résumé, et si nous ne lisons pas correctement le résumé, évidemment, nous risquons de le manquer, et ce sera de notre faute, comme c'était le cas avec le fichier EMV à points, nous avons dû le faire Mais ici, non, cela devrait fonctionner, mais cela ne dit pas au modèle que seules quelques photos chargent et qu'il doit revoir l'intégralité du code pour résoudre le problème. D'accord, cela va prendre un certain temps car je voulais revoir le tout, toute la base de code de manière exhaustive Cela signifie que nous avons affaire à quelques minutes d'attente. Heureusement, il s'agit d'un enregistrement qui me permet d' accélérer les choses. Mais oui, dans ton cas, tu vas devoir attendre un peu. Je vais juste passer au résumé, mais voici la question. Est-ce que nous nous soucions vraiment de savoir quel était le véritable problème ? Maintenant, d'un côté, oui, parce que nous pouvons peut-être empêcher que cela ne se reproduise dans notre prochain projet. C'est donc une chose pour laquelle vous devez faire attention à tout ce qui se passe dans le chat. autre côté, non, pas vraiment parce que le résumé devrait nous indiquer ce qu'il a résolu, vous savez, quel était le problème et comment il l'a résolu. Cela signifie que c'est à vous de décider si vous voulez revoir chaque étape, la lire, essayer de la comprendre et voir si vous pouvez ajuster votre approche à l'avenir, si vous pouvez faire quelque chose différemment. OK, donc le résumé, en fait, ne dit pas ce qu'il a fait, choses comme la bonne taille d'image, ce qui ne me dit pas grand-chose Il dit qu'il a désactivé quelque chose concernant l'optimisation de l'image à des fins de débogage. Cette partie m'indique donc que le problème est peut-être lié à la taille de l'image. OK. Dans tous les cas, jetons un coup d'œil et voyons s'ils apparaissent tous. Et oui, la victoire. Tout va bien. Enfin, il y a une remarque secondaire. Je dois dire que l' image principale ne me rend pas heureuse. Le poste n'a pas vraiment de sens. Mais dans l'ensemble, c'est bon, et je suis d'accord avec le fait que les images se chargent. Nous avons réglé ce problème. Le formulaire fonctionne. Il est maintenant temps de continuer. Faisons une petite pause. 21. Télécharger le site web sur GitHub b: Bon retour. Le site Web est opérationnel, mais il se trouve uniquement sur notre ordinateur local. Nous voulons pouvoir le partager avec le monde entier, nous allons donc devoir le télécharger sur GitHub Disons donc au modèle de faire exactement cela. J'aimerais également mentionner le fait qu' il devrait utiliser le Github MCP, ce qui devrait empêcher le modèle de nous demander de faire des choses manuellement. Idéalement, j'aimerais ne même pas toucher à GitHub. Le modèle doit tout faire. Je vous en prie, soyez conscient d'une chose. Vous devez ajouter votre jeton personnel dans le curseur interne du Github MCP Sans cette clé, cela ne fonctionnera pas. OK, il va examiner mon compte, voir ce qui se passe et créer un nouveau projet. C'est ce qu'on appelle le dépôt. C'est le bon terme, mais tu peux t'en souvenir comme ça. Référentiel de projets. C'est la même chose. Nous pouvons voir qu'il utilise l'outil MCP, ce qui est bon signe Un problème potentiel que je vois est la quantité de code que nous avons créée. Il y a beaucoup de fichiers, mais nous verrons comment cela se passe. Ah, il semblerait qu'il y ait un problème. Il indique que le Github MCP ne fonctionne pas réellement. OK, allons-y voir. Cliquez sur l'icône des paramètres en haut à droite pour ouvrir les paramètres du curseur. Et oui, pour une raison ou une autre, rien ne fonctionne vraiment. sont tous rouges, ce qui signifie qu'il y a un problème. Pour être honnête, beaucoup d'entre eux sont activés. Nous avons dépassé la limite, mais ils ne devraient pas tous être rouges. C'est un peu étrange. Maintenant, voici le truc. Le modèle fonctionne toujours en arrière-plan, enfin , sur le côté droit, mais il ne pourra rien faire. est peut-être pour cela que nous avons également eu quelques problèmes avec les photos. Une chose que nous pouvons faire est d'essayer de modifier l'un d'entre eux, puis de revenir aux outils MCP Cela devrait déclencher une sorte de rafraîchissement. Et dans le passé, cela a résolu certains de mes problèmes. Mais maintenant, ici, ça ne marche toujours pas. Je pense qu'il vaut mieux arrêter le modèle. C'est l'un de ces rares cas où cela a du sens, car si vous le laissez fonctionner, cela peut faire plus de mal que de bien. La seule chose à laquelle je peux penser est un redémarrage classique. Le bon vieux, avez-vous essayé débrancher puis de le rebrancher ? OK, jetons-y un coup d'œil. Alors, attendez quelques secondes. Et maintenant, oui, feu vert un par un, ce qui est à la fois drôle et ennuyeux. Qu'est-ce que je peux en dire ? Quels enseignements pouvons-nous tirer de ce problème ? Je n'ai aucune idée de ce qui l'a causé, et je ne sais pas comment y remédier. Redémarrer n'a aucun sens. Même si j'étais un développeur senior avec 20 ans d'expérience, je ne pense pas que cela aurait du sens. La seule chose potentielle est la suivante essayez peut-être de désactiver quelques MCP que vous n'utilisez pas habituellement Github doit évidemment rester actif. OK, une fois que nous aurons le feu vert, revenons au chat et transmettons-lui le même message, mais je vais également lui dire que je prévois d'utiliser Versll qui pourrait aider le modèle à tout préparer, afin que nous ayons peut-être moins de problèmes à l' avenir avec VerSL OK, ça va prendre un moment. Je ne sais pas si cela est dû au fait que nous avons beaucoup de fichiers ou à leur taille ou, d'un autre côté, cela peut être dû au fait qu'à cette heure de la journée, de nombreuses personnes utilisent le curseur Cloud. En fait, cela a beaucoup ralenti. En attendant, permettez-moi vous dire quelques choses à propos de Github Maintenant, ce qui est cool, c'est que vous n'avez rien à faire sur github.com, mais en quoi cela vous aide-t-il Eh bien, GitHub devient bien plus qu' un simple intermédiaire entre cursor et Versell Lorsque votre projet est en ligne sur GitHub, vous avez créé une sauvegarde de contrôle de version publique ou privée selon votre choix Maintenant, qu'est-ce que le contrôle de version ? Disons donc que ce sera la première version avec un formulaire très basique, très simple, n'est-ce pas ? Ensuite, vous pouvez créer un formulaire beaucoup plus avancé où le visiteur pourra peut-être choisir une heure, des services et d'autres éléments, n'est-ce pas ? Vous l'apportez au client. Tu le fais vivre. Mais au bout d'un moment, tu reçois un appel téléphonique. Hey, Chris, j'ai de moins en moins de rendez-vous. Les gens n' aiment pas le nouveau formulaire. Peux-tu, s'il te plaît, ramener l'ancien ? Oh, ce serait douloureux. Vous devrez revenir au curseur et supprimer tout ce code supplémentaire qui pourrait vous donner des bogues. Le formulaire peut se casser, l'ensemble du site Web peut se casser. Mais c'est là que le contrôle de version entre en jeu. Avec GitHub, c'est comme une situation de sauvegarde et de chargement de jeu. il vous suffit de revenir à être honnête, il vous suffit de revenir à la version précédente ou à n'importe quelle version. Tant que c'est sur GitHub, vous pouvez en avoir plusieurs. Vous pouvez avoir des versions distinctes basées sur des schémas de couleurs, fonctionnalités, des mises en page, etc. GitHub vous aide donc organiser tout cela. Contrôle de version. Maintenant, est-ce super simple ? Non, pas vraiment. Il faut un certain temps pour s'y habituer. Mais comme nous avons un curseur, nous disons simplement au modèle ce que nous voulons, et il le fera. Nous allons simplement dire : « Hé, ramenez version du schéma de couleur rouge ou ramenez le formulaire de contact qui ne comportait que trois champs ». C'est le contrôle de version. C'est le pouvoir de Github. Ensuite, public ou privé. public signifie que d'autres personnes peuvent vous voir au travail, ce qui est très utile si vous souhaitez obtenir un emploi ou collaborer avec d'autres personnes. Si vous voulez montrer ce que vous êtes capable de faire au travail, c'est de le rendre public. Vous allez probablement le garder privé au cas où vous voudriez vendre ce site Web à un client. Il s'agit donc du contrôle de version, public ou privé. Mais le plus important, c' est le pont parfait entre votre code local et votre curseur et le déploiement en ligne, en le publiant. Vous voyez, des plateformes comme Versell sont profondément intégrées à Github Ainsi, lorsque votre site est prêt à être mis en ligne, Versll peut consulter votre projet Github et dire : « OK, je vois vos fichiers, je vois vos paramètres, je vois vos dernières Je l'ai reçu, et il va être publié. Cela signifie que vous n'avez rien à faire manuellement. Vous n'avez pas besoin de télécharger de fichiers ni de définir de paramètres. Vous n'avez pas besoin d'une société d'hébergement, rien. Il vous suffit de connecter Versell à votre dépôt GitHub, ce que nous allons faire dans Et puis boum, c'est tout. Votre site Web est en ligne. Et ce système est extrêmement puissant car il permet de tout automatiser et de rester Si vous apportez des modifications à votre projet ultérieurement dans le curseur, vous allez demander au modèle de mettre à jour Github, et c'est tout Versell reçoit automatiquement un signal pour mettre à jour la version en ligne du site Web Aucune étape supplémentaire. Tout est automatique. Tout est connecté. Fantastique Donc, en termes simples, le curseur est l'endroit où vous créez le site Web. Github est l'endroit où vous le stockez, puis Versell est l'endroit où vous faites vivre pour que le monde entier puisse le voir OK, pour en revenir au projet, il semblerait que le modèle se soit arrêté. Pour une raison ou une autre, il a examiné les règles que nous avons établies. Puis ça s'est arrêté. C'est assez étrange. La meilleure façon de procéder est de le demander. Avez-vous téléchargé le site Web sur Github ? Puis-je le transmettre à Versell et voir ce qu'il dit ? Parlez-lui comme vous parleriez à un développeur, posez-lui des questions lorsque vous n'êtes pas sûr. Et il semble qu'il redémarre à zéro. Je ne sais pas pourquoi c'est le cas. Alors voyons voir. Au bout d'un moment, nous obtenons un résumé qui n'a aucun sens. Je suis sûr que c'est hallucinant, que c'est de l'imagination C'est donc ce que je vais faire. Je vais faire une nouvelle discussion. Faisons cependant une pause, et nous allons continuer dans une seconde. 22. Quand démarrer un nouveau chat ?: Bon retour. Dans le nouveau chat, disons au modèle que le site Web a été partiellement téléchargé et qu'il doit utiliser le MCP Github pour terminer le travail afin que nous puissions continuer à survendre. D'accord, nous avons vu à quel point le modèle avait du mal à télécharger le site Web sur Github Dans le passé, c'était toujours un travail de deux minutes pour moi. Mais ici, le mannequin a vraiment du mal. Bien sûr, au départ, le GID Hub MCP ne fonctionnait pas, bien sûr, mais nous avons corrigé ce problème pour redémarrer Maintenant, il n'y a aucune raison pour que cela fonctionne si lentement. Lorsque vous constatez un quelconque type de dégradation, lorsque vous constatez que le modèle ne répond pas correctement, il est temps de démarrer une nouvelle discussion Vous pouvez le faire en haut à droite. Le curseur vous indiquera également quand c'est le cas en vous affichant un message en bas à droite. Cependant, pour être honnête, cela apparaît assez tôt et assez souvent. Bref, si la conversation est trop longue, l'IA ne fonctionnera pas aussi bien. Ça va être bouleversé. C'est pourquoi il est préférable de diviser votre projet en plusieurs discussions. Par exemple, la traduction du site Web doit être effectuée dans un nouveau chat Si nous voulons améliorer le formulaire, ajoutez-y quelques éléments, encore une fois, une nouvelle discussion. Si vous souhaitez changer le schéma de couleurs, encore une fois , une nouvelle discussion, et cela vous donnera les meilleurs résultats possibles. autre côté, lorsque nous avons eu du mal à empêcher le chargement des images, il est préférable de poursuivre cette conversation jusqu'à ce que vous arriviez à une conclusion. Soit c'est corrigé, soit le modèle n'a absolument aucun sens, et il est clair que vous ne pouvez pas continuer. Ici, je dois vous dire que ce fut un cauchemar. Cela a pris du temps, environ 45 minutes au total. Chaque fichier a pris beaucoup de temps, et plus que cela, c' est incroyablement ennuyeux. Le mannequin a déclaré à un moment donné qu'il n'avait vu aucun projet sur Github et qu'il avait décidé d'en créer un tout nouveau C'est, bien sûr, très frustrant car nous venons de dire qu'il a été partiellement téléchargé. J'aurais apprécié que le modèle s'arrête et me pose des questions à ce sujet. Au lieu de cela, elle a continué. Pour être honnête, je suis content de continuer à progresser, mais maintenant je vais devoir nettoyer le projet précédent sur Github Il va falloir que je le retire. Il suffit de quelques clics. Il n'est pas difficile de le retirer. Mais je n'aime pas le fait qu'il n'ait pas pu voir ce que nous venons il y a quelques instants et le fait que j'aie clairement indiqué dans le message que nous l'avions partiellement téléchargé. Pour être honnête, nous avons entamé une nouvelle conversation, mais j'en attendais quand même un peu plus. Après une longue attente, le site est enfin mis en ligne sur Github Nous pouvons voir tous les fichiers lors de leur téléchargement, ainsi qu'une description. Ce que j'aime dans ces modèles, c'est qu'ils écrivent beaucoup de détails. Tout est clairement expliqué. Cela va aider tout le monde. Cela vous aidera, ainsi que tout employeur potentiel, tout codeur avec lequel vous pourriez travailler, mais également tout autre modèle d'IA que vous pourriez utiliser à l'avenir. Parce que c'est le truc. Peut-être que vous poursuivez ce projet avec un autre modèle, mais peut-être que vous lancez une version. Cela fonctionne bien, mais vous devez ensuite engager un codeur pour résoudre certains problèmes que vous ne pouvez pas gérer vous-même. Avec tout ce qui est si bien agencé, les choses vont se dérouler plus facilement et plus rapidement. Avec cela, nous pouvons faire une pause et nous passerons bientôt à Versell, ce qui signifie que nous pourrons partager le site Web avec n'importe qui Je te verrai dans une seconde. 23. Publier le site Web et le partager avec n'importe qui (article: Reviens. Notre site Web est disponible sur Github, et c'est formidable car Versell y est intégré. Et voici comment cela se passe. J'ai déjà un projet ici, mais vous allez passer à l'écran suivant. Vous verrez celui-ci ici. C'est donc ce que vous allez voir lorsque vous lancerez VSL pour la première fois et que vous lui donnerez accès à votre compte Github Ici, nous pouvons voir que le projet VDClinic est le premier de la liste Nous devons cliquer sur Importer. Ensuite, cela va lancer le processus. Pour nous assurer que tout fonctionne bien, nous devons faire un peu de configuration, mais c'est juste un peu, et cela se fait en cliquant ici sur les variables d'environnement, ce qui semble très sophistiqué. Mais en fait, il suffit de coller la clé récente et ces deux adresses e-mail. C'est ça. Rien de plus Maintenant, après l'avoir fait une fois, vous allez voir à quel point c'est facile. OK, revenez dans le curseur, vous devez ouvrir le fichier ENV que nous avons créé précédemment À partir de là, copiez sur le côté gauche, la clé d'API de renvoi Retournez ensuite dans Versell et collez-le dans le champ de gauche. Huit. Maintenant, répétez l'opération pour le côté droit. C'est aussi simple que cela, rien de spécial. Bien sûr, vous allez devoir utiliser le bouton en ajouter car nous avons trois éléments au total. Donc, la clé du courrier électronique. Et enfin par e-mail. Je vais accélérer sur la largeur, mais oui, je suis contente que ce soit si simple. Maintenant, il s'agit d'un podcast où le fondateur de VerSL dit que l' approche globale consiste à pouvoir lancer un site Web en un rien de temps Pour eux, cette rapidité est cruciale, essentielle. Et tu sais quoi ? Après avoir utilisé ce service pendant un certain temps, je dois accepter. J'ai créé plusieurs comptes, et c'est toujours un jeu d'enfant. Oh, veuillez vous assurer de copier-coller avec précision. N'omettez aucun caractère et n'incluez aucun espace supplémentaire. Cela peut entraîner d'énormes problèmes car il est probable que vous n' obteniez pas d'erreur à ce sujet. D'ailleurs, les développeurs ne disent pas : publions un site Web. Ils disent de déployer le site Web. Et cela va prendre un certain temps, généralement une minute ou deux. Cependant, dans la plupart des cas, le déploiement échouera probablement du premier coup . Ce n'est pas difficile à corriger, mais nous devons attendre que le processus soit terminé. Vous devriez déjà remarquer l'icône de copie en haut à droite. C'est ce que nous allons utiliser pour saisir les problèmes, les erreurs, puis les coller à nouveau dans le curseur, car je suis sûr que cela sera inévitable pour la plupart des projets. Nous avons quelques problèmes ici. Transférons-les pour que le curseur puisse les corriger. Je vais vous donner un peu de contexte. Je vais dire au modèle que j'utilise Versell et que je reçois ces erreurs Ensuite, je vais tout coller. OK. Oui, il semble donc y avoir un problème avec NextGS, ce qui nous convient parfaitement. Nous ne nous en soucions pas vraiment. Tant que le modèle est capable d' identifier et de résoudre le problème par lui-même, je suis content. Cela peut prendre un certain temps car l'IA doit examiner plusieurs fichiers, mais elle doit également les publier sur Github. Tu te souviens de ça ? Versell prend automatiquement tous ces fichiers depuis Github. Si nous avons de la chance, cela ne devrait pas prendre trop de temps, mais nous verrons si c'est le cas. Et malheureusement, dans ce cas, en ce soir, les choses sont plutôt lentes. En fait, cela a pris environ 40 minutes 40, même si ce n'est pas si compliqué que ça. Je ne peux qu'imaginer à quel point cela doit être ennuyeux s'il s' agit de votre première expérience avec un projet plus sérieux. Mais je suis convaincu que les choses vont s'améliorer de plus en plus. Les gars de Cursor améliorent constamment les choses, et ils viennent d'annoncer l'installation de Winclick pour les MCP, vous n'avez donc plus à vous soucier de ces bits de code Jusqu'à présent, nous ne disposons pas de beaucoup d'outils, mais nous progressons encore. Autre chose à noter, Versell essaiera constamment publier pour déployer le site Web Donc, si vous y jetez un œil et que vous voyez beaucoup de rouge, ne vous inquiétez pas, ce n'est pas grave. Vous pouvez également recevoir une tonne de courriels concernant les échecs. Nous pourrions éventuellement suspendre Versell jusqu'à ce que le modèle termine son travail avec GitHub, mais je vais le laisser fonctionner, même si nous allons recevoir pas mal de messages OK, il semble que le modèle soit terminé. Génial, mais il va falloir attendre voir si nous allons obtenir le feu vert. Dans certains cas, vous devrez peut-être copier-coller plusieurs fois, le curseur doit donc résoudre plusieurs problèmes. Cela dépend vraiment du type de projet et des performances du modèle ce jour-là. Une chose, cependant, n' oubliez pas qu'il y a un petit délai entre la un petit délai entre mise à jour de Github et le moment où Versell Ce n'est pas long, peut-être quelques minutes, mais ne paniquez pas au cas où vous ne verriez pas de nouveau déploiement ici. Un nouveau déploiement signifie simplement que Versell essaie à nouveau de publier le site Web. Et on peut voir ce bâtiment au feu jaune. Nous pouvons en fait cliquer dessus et obtenir quelques détails supplémentaires. À l'intérieur, nous recevons un tas d'informations, mais en fait, nous ne nous intéressons qu'au statut. C'est vert ou pas ? S'il est rouge, nous allons effectuer une autre action de copier-coller. Mais j'espère, croisons les doigts, que ce sera vert. Au bout de deux minutes, je suis un peu anxieuse, mais je vais attendre encore un peu. Mais voici le truc. Vous souhaiterez peut-être actualiser au cas où. Et oui, la victoire. C'est prêt. C'est vert. Nous sommes prêts. Jetons un coup d'œil à notre site Web. Bien sûr, le lien va être assez laid et compliqué, et les images ne semblent pas se charger. Mais oui, le site Web est en ligne, et nous pouvons maintenant le partager avec tout le monde. Est-ce une victoire ? Oui, c'est tout de même un grand progrès. Maintenant que la chaîne est établie, nous pouvons tout réparer. Cursor Github Versel. Permettez-moi de faire une petite pause et nous reviendrons pour résoudre les problèmes éventuels. 24. Traduire le site web: Bon retour. Nous avons fait de solides progrès jusqu'à présent, mais continuons sur cette lancée. Entamez une nouvelle conversation et demandez au modèle de changer la langue en anglais. Maintenant, si vous n' avez pas ce problème, vous pouvez travailler sur n'importe quelle autre partie, et il y a beaucoup à peaufiner. Maintenant, ici, le modèle fonctionne assez rapidement, et il semble comprendre ce qu'il doit faire. De mon côté, je m'attends à ce que cela prenne quelques minutes, en fait, assez peu. Mais gardez à l'esprit que c'est assez tard dans la soirée, et beaucoup de personnes sur Redi pensent que c' est une erreur précipitée, que ce n'est pas l'idéal Mais ici, le modèle évolue petit à petit. Je voudrais mentionner quelque chose. Dans mes projets précédents, j'ai rencontré pas mal de problèmes lors de leur mise à jour. Ajouter des choses simples, ajouter diverses mises à jour, divers petits éléments. Toute modification simple a amené le modèle à revoir l'ensemble du projet, ce qui est tout à fait normal, bien sûr. Mais parfois, il refait aussi des choses, des choses qu'il ne devrait pas faire Par exemple, vous lui demandez de corriger le style d'un bouton, disons, n'est-ce pas ? Mais ensuite, il met en œuvre un système de conception complet. En gros, tuer trop, utiliser un marteau pour écraser une mouche, non ? Et voici un autre exemple. J'ai mis à jour l'une de mes applications Android et je voulais utiliser Material Design Three. Il vient d'être lancé, non ? Et cela a pris plus de 45 minutes. Et puis des tas de problèmes, des tonnes de suggestions. Et après avoir tout dit et fait, bout de 45 minutes, l' application semblait identique. Aucun changement, mais des tonnes de fichiers, des tonnes de code. C'est pourquoi les développeurs expérimentés ne prennent pas le codage Vibe au sérieux Bien sûr, vous pouvez lancer un projet, mais le mettre à jour en permanence, le maintenir. C'est très difficile à faire. Jusqu'à présent, j'ai réussi à le faire, même si je pense que vous devez ajuster vos attentes. Si tu le fais, tu seras bon. Et voici comment je vois les choses. Une fois que vous avez obtenu la validation, une fois que vous avez constaté que le projet gagne du terrain, vous pouvez augmenter le niveau de vos abonnements afin de pouvoir faire un meilleur travail. Vous pouvez utiliser des modèles plus intelligents ou, à l'inverse, engager un développeur, et les coûts pourraient être bien moindres, car vous avez fait le gros du travail et tout est bien documenté. Mais encore une fois, d'un autre côté, cela dépend vraiment de la nature du projet, car j'ai travaillé avec de nombreux codeurs qui abordent un projet d'une manière très, très spécifique Ils n'utilisent que certaines technologies, revient à dire qu'on ne boit jamais autre chose que du coca, par exemple, qu'on utilise toujours un iPhone, rien d'autre. Vous savez, Code a une approche similaire Ils sont un peu rigides parce qu'ils savent quelle approche leur donne le meilleur résultat. C'est pourquoi, par exemple, certains développeurs n'aiment pas Wordpress, ou ils n' utiliseraient jamais Magento, etc. Il y a donc une petite chance que, peu importe ce que vous utiliserez dans le prochain JS, peut-être que certains développeurs n'aimeront pas ça, et dans ce cas, cela peut être plus cher. Les choses sont très fluides et en constante évolution. Le fait est que le taux d' amélioration est fantastique. Oh, trois viennent de se faire couper. C'est désormais 80 % moins cher. Et oui, les choses vont de mieux en mieux. Mais même à ce stade, vous pouvez toujours réaliser des projets qui fonctionnent bien. Ce ne sont peut-être pas les projets les plus complexes, bien sûr, mais vous pouvez le faire. Et au bout de quelques mois, lorsque les modèles s'améliorent encore, vous êtes aux commandes. Vous êtes là et vous avez de l'expérience. Vous savez travailler avec des modèles et diverses plateformes comme Github, Versell, etc. Donc, dans l'ensemble, tu vas être en or. C'est vrai. À ce stade, c'est un peu ridicule. Les progrès se font à un rythme effréné. Le quatrième nuage traîne des pieds. C'est pourquoi je vous le dis, vous devez être patient, zen, et laisser toute votre frustration disparaître. La tâche est très, très basique, mais Claude agit comme s'il déplaçait des montagnes, tu sais ? Donc, ce que je vais faire, c'est augmenter considérablement la vitesse de la vidéo afin que nous ne soyons pas là toute la journée. Mais je voulais vraiment inclure tous ces éléments, même si j'aurais pu facilement les supprimer du cours. Pour moi, il est essentiel que vous sachiez que l' attente joue un rôle important dans le codage des vibrations S'ennuyer, c'est sûr, ce n'est pas l'idéal, mais c'est le prix que nous devons parfois payer. N'oubliez pas que votre expérience peut être très différente même avec le même modèle Mais encore une fois, le revers de la médaille, c' que vous devriez vraiment essayer la même approche avec exactement la même invite avec un modèle différent. Par exemple, disons Gémeaux. Le fait est que ces entreprises sont engagées dans une guerre massive. Google et Tropic Open AI, pour n'en nommer que quelques-uns. Twitter avec XAI Les entreprises chinoises font un travail fantastique. Bien sûr, Meta, Facebook. Ils jouent également un rôle important dans cet espace d'IA. C'est donc toujours aussi passionnant. Et en tant que consommateurs, nous allons en bénéficier. Imaginez que les plus grandes compagnies de voitures ou de téléphones mènent une telle bataille. Mais voilà le truc. Le cycle dure des semaines, pas des années. Donc, en obtenant des voitures et des téléphones meilleurs, plus rapides et plus intelligents, des voitures et des téléphones moins chers également. Mais cela se produit très rapidement, comme toutes les deux semaines environ, vous recevez un tout nouveau projet, une longueur d'avance sur les précédents C'est fantastique pour nous. OK, il semblerait que nous devions reprendre la conversation. OK, pas de soucis. Mais bien sûr, nous avons le même problème qu'avant les problèmes de connexion. Au fait, ma vitesse ici, la vitesse d'Internet est fantastique dans mon pays. L'un des plus rapides d'Europe. Mais d'accord, réparons-le. Voilà le truc. Au lieu de redémarrer le curseur, nous pouvons également le faire, démarrer une nouvelle conversation en utilisant l'icône en haut à droite Regardez ensuite vers le bas et ouvrez le chat précédent. Vous allez rencontrer le même problème, mais voici la différence. Nous pouvons maintenant taper et continuer, et j'espère pouvoir reprendre le processus à partir de cet endroit, plus ou moins. C'est le plan. Quoi qu'il en soit, il n'y a aucune garantie. Voyons donc ce que dit le modèle. Et oui, c'est vraiment, vraiment y penser. Je pense donc que je dois accélérer les choses. D'accord, il est dit que la traduction est terminée, et cela va tout transférer sur Github OK, ça me convient. Je vais le laisser fonctionner en arrière-plan. Et après pas mal de temps, je n'en ai toujours pas fini avec le processus de réflexion sur ce modèle, façon dont il crée de la confusion, façon dont il perçoit une situation et sur la façon dont il essaie de la corriger. Mais oui, passons simplement à autre chose, car il est fort probable que votre design soit déjà en anglais. Je pense vraiment que l'emplacement de la clinique détermine la langue. Faites-moi savoir dans la section des commentaires si, sur votre version, vous avez obtenu votre propre langue en fonction de l'adresse de la clinique. Bien sûr, j'utilise le faux, bien sûr, mais j'utilise le nom aléatoire de ma ville, de mon pays, d' où la langue. Oh, ouah, il y a quelque chose qui ne va pas ici. Pour une raison ou une autre, le modèle me demande d'aller sur Github et de créer un nouveau projet Et cela n'a aucun sens. De toute évidence, cela a mal tourné, et c'est le signe que nous devons passer à un nouveau chat. Si cela continue pendant encore trois, quatre ou cinq instructions, je changerai probablement de modèle D'ailleurs, vérifiez toujours si le Github MCP est opérationnel S'il redevient rouge, s'il est cassé, cela aurait du sens. Mais de mon côté, c'est bon, ce qui signifie que le modèle n'a tout simplement pas suivi mes instructions pour une raison ou une autre. Pour éviter cela, je vais récupérer le lien du dépôt directement sur GitHub afin de ne pas avoir de questions à ce sujet Si nous pointons le modèle directement vers le projet sur GitHub, il devrait pouvoir le mettre à jour sans aucun problème Et d'ailleurs, c'est dans cette situation que vous pouvez utiliser un modèle différent. La tâche est super simple. Il n'a pas besoin d' un autre contexte. Il s'agit simplement de télécharger des fichiers sur le Web. C'est ça. Dans ces cas, il y a donc peu ou pas de risque. Nous ne demandons pas au nouveau modèle de bien comprendre le code ou de l'améliorer. Non, ce serait donc une bonne chance, mais je veux continuer avec Cloud Four. Je veux l'utiliser du début à la fin parce que je pense que c'est également ainsi que vous devriez travailler. Utilisez-le, soyez frustré. Prenez note de tous les problèmes qui en sont la cause, puis comparez-les à autre chose. C'est la meilleure façon d'apprendre. Ici, nous avons un nouveau problème la première fois que je le vois, une limite de débit avec sommet, aucune idée Et il nous demande d'utiliser le modèle Auto Select, ce qui n'est pas idéal dans ce cas car nous voulons apprendre. Il indique que nous pouvons attendre quelques minutes et réessayer. C'est ce que je vais faire. Maintenant, je vais cliquer sur Reprendre et voir comment ça marche. Maintenant que cela fonctionne, laissez-moi vous expliquer pourquoi la sélection automatique n' est pas une bonne idée pour nous. Nous voulons en savoir plus sur ces modèles. Nous voulons voir des choses comme je ne sais pas, par exemple, je ne sais pas, Chat GPT 4.1 n'est pas capable de déplacer les images, d'accord ? Quelles sont les difficultés de Claude pour traduire un site Web ? Pourquoi imini est nul en termes d'espacement, quel alignement ? Vous ne pouvez en arriver qu'à ces conclusions qui sont fausses, d'ailleurs. Si vous utilisez ces modèles pendant des heures, peut-être des dizaines d'heures, je m'en tiens à cette déclaration. Les modèles changent tout le temps. Ils évoluent, même s'ils portent le même nom en utilisant le Cloud Four ici, mais le Cloud Four que vous pouvez utiliser en une semaine ou un mois peut agir d'une manière complètement différente. La raison pour laquelle c'est le cas est un peu plus compliquée. Peut-être anthropique, mais l'entreprise qui l'a créée l'a légèrement ajustée Peut-être que Cursor a apporté quelques modifications. Peut-être que moins de personnes l'utilisent à ce moment-là, ou peut-être que les serveurs ont été mis à niveau, afin qu'un plus grand nombre de personnes puissent utiliser le modèle en même temps, mais sans aucune dégradation, c'est délicat, c'est compliqué. Mais, bien sûr, voici un autre échec de connexion, ce qui est fantastique. C'est une bonne chose pour une si petite tâche. Encore une fois, calme. Faisons une nouvelle discussion, puis revenons. Je souhaite poursuivre cette conversation car je pense que nous sommes proches d'un résultat. Voyons donc ce que c'est. Le modèle mentionne quelque chose qui est presque terminé. Pour être honnête, n'y croyez pas. Vérifiez toujours. Je ne pense pas que quoi que ce soit ait été mis à jour. Vous pouvez jeter un œil sur Github et voir quand le dernier push a eu lieu Push signifie simplement mettre à jour. Mais oui, des tonnes de problèmes. Super poussette. C'est une expérience horrible, et comme vous pouvez le constater, cela n'a rien à voir avec le site Web lui-même ou le codage de l'ambiance Il s'agit simplement du processus d' utilisation d'un modèle qui est dépassé, du moins pour le moment. Sur GitHub, nous pouvons voir que le dernier push a eu lieu il y a 5 minutes. Cela signifie que Versell a probablement mis à jour quelque chose entre-temps Examinons donc le dernier déploiement et voyons si c'est le cas. Allons y jeter un œil. Et oui, c'est en anglais. Nous devons cependant tout vérifier du début à la fin et voir si c'est complètement fait. Je pense que c'est traduit à environ 95 %. Il y en a peut-être quelques points ici et là, mais dans l'ensemble, c'est bon. Mais je n'en ai aucune idée de ce qui se passe dans Cursor . Il semble que le modèle veuille créer un nouveau projet, un nouveau dépôt sur Github Je ne sais pas pourquoi il a une si horrible amnésie. Je pense que c' était peut-être une sorte de panne. En général, Cloud Four fonctionne bien mieux que cela. Nous pouvons essayer d'observer un processus de réflexion, mais pour être honnête, je ne suis pas vraiment curieux. Le fait est que nous sommes en direct. Le site Web est traduit, et même si cela ne semble pas être une victoire, nous avons quand même progressé. Faisons donc une petite pause, regroupons-nous et voyons ce que nous pouvons faire ensuite Merci de rester avec moi, et j'espère que cela ne vous découragera pas de coder en mode vibe Nous sommes en avance et cela se voit, mais je suis convaincu que ces problèmes sont des problèmes mineurs qui seront bientôt résolus. Donc, dans l'ensemble, continuons. Je vais te voir dans un moment. 25. Acheter notre propre nom de domaine: Bon retour. La route a été cahoteuse, mais dans l'ensemble, nous avons réussi à avoir un beau site Web C'est en anglais avec un formulaire de travail, et il est déjà hébergé sur Versell Cela signifie que nous pourrions le partager avec le monde entier, mais voici le truc. Le lien est assez moche. À des fins de test, c'est très bien. Si vous souhaitez présenter votre travail au client avant la mise en ligne du projet, encore une fois, c'est très bien. Mais que faire si vous voulez un lien sympa, une bonne adresse ? Cela signifie que vous devez acheter un nom de domaine. Vous pouvez le faire directement depuis VSL. Voici mon compte en haut à gauche. Et ici, nous pouvons voir l' intérieur du projet. D'accord, depuis la navigation, nous pouvons accéder aux paramètres. Dans cette nouvelle page de gauche, nous pouvons trouver le cadre latéral avec un certain nombre d'options, mais nous nous intéressons aux domaines. Et nous y voilà. Il s'agit du lien existant, qui est loin d'être idéal. Alors faisons-le. Utilisons le bouton Par domaines pour voir ce qui est disponible. Désormais, les domaines courts et élégants ne sont presque toujours pas disponibles. Des tonnes d'entreprises ont acheté des milliers de domaines et ont fait des affaires en les revendant. Mon conseil : éloignez-vous de cela. Utilisez votre nom ou un mot qui signifie quelque chose pour vous. Et voici pourquoi, il y a de nombreuses années, votre nom de domaine était vraiment important. Donc, avoir quelque chose comme des didacticiels Photoshop aurait été un avantage. Mais aujourd'hui, ce n'est pas le cas. Cela n'a aucune importance. Je vais donc utiliser mon propre nom, mais la version .com n'est pas disponible car je l'ai déjà achetée Ce que j'aime chez Versell, c'est le fait que j'obtiens un maximum de transparence ici Nous pouvons voir toutes les options disponibles. Certains d'entre eux sont incroyablement chers. Par exemple, res barn.ai coûte 149 dollars, ce qui n'a aucun sens Je vois une version .net ici, ne coûte que 12 dollars, et je pense que c'est logique Versell a déjà enregistré ma carte de crédit parce que j'ai effectué l'achat précédent ne me reste donc qu'à confirmer que je veux l'acheter. Bien entendu, je vais devoir confirmer la transaction auprès de ma banque, mais cela ne pose aucun problème. C'est la même chose que pour n'importe quelle transaction sur le Web. Mais oui, c'est tout ce qu'il faut pour empiler un nom de domaine aussi simple que cela. Nous allons maintenant le voir dans ce tableau de bord. Mais revenons au projet afin de pouvoir le lier. Donc, depuis la page d'accueil, cliquez sur le projet VT. Maintenant, à l'intérieur, nous pouvons voir les domaines en haut à droite. Ce n'est pas tout à fait évident, mais vous allez vite vous habituer à l'interface de Vasel OK, cliquons dessus, et maintenant nous revenons à ce point. Mais cette fois-ci, nous allons cliquer sur Add-main Et bien sûr, nous allons sélectionner chrisbarn.net que nous Merci de cocher cette case. C'est un paramètre important. Maintenant, Vasl va nous demander si nous voulons télécharger la version de production, et bien sûr, ce serait le cas Et c'est parce que nous pourrions potentiellement avoir une version différente, et voici pourquoi. Nous pouvons lancer ce site Web tel quel, mais ensuite nous pouvons continuer à y travailler. Peut-être avons-nous un test pour quelques amis, une nouvelle version légèrement différente. C'est donc là que les déploiements multiples entrent en jeu. Mais ce n'est pas le cas ici, alors restons simples, vous savez, appuyez sur Enregistrer, puis nous devrons attendre un peu. Il y a plein de détails que nous pourrions approfondir, mais je veux rester concentré sur la réalisation de ce processus, de l'idée au lancement du site Web le plus rapidement possible Le certificat SSL est quelque chose que la plupart des sites Web devraient avoir, mais sa génération et sa configuration prennent quelques minutes. Je vais passer à autre chose et oui, nous y voilà. Nous pouvons maintenant visiter chrisbarn.net. C'est un beau site web. Nous n'avons plus besoin de ce mignon lien. Cela fonctionne toujours, mais maintenant nous pouvons utiliser celui-ci. Nous sommes donc tous prêts, le site Web n'est pas parfait. Cela demande du travail, mais la première chose à faire est de corriger les images. Ils ne se chargent pas. Revenons donc à Cursor, ouvrons une nouvelle discussion et indiquons exactement cela au modèle. En fait, tu sais quoi ? Il serait peut-être préférable pour moi de redémarrer le programme compte tenu du nombre de problèmes que nous avons rencontrés. Honnêtement, je ne sais pas si un redémarrage est vraiment utile, mais j'ai remarqué que le modèle rencontrait des problèmes, même en écrivant des mots. Donc pas du code réel, mais des phrases, ce qui signifie que les performances sont vraiment lentes. C'est comme si j'utilisais un ordinateur vidéo, ce qui n'est pas le cas. Mais oui, voyons ce que c'est. L'invite est donc assez simple. Les images, je ne les charge pas, corrigez cela et mettez à jour le site Web. Maintenant, c'est un peu vague, pour être honnête. J'aurais dû mentionner le lien GitHub. Donc oui, on va voir si ça va passer. il en soit, en dehors des courses, nous verrons ce qui va se passer. Le modèle voit donc les images et commence à étudier le problème. OK, la vitesse semble un peu meilleure. Il semble que le redémarrage ait un peu aidé, mais il n'en est qu'à ses débuts. Voyons donc que le projet soit opérationnel, puis nous déciderons, mais d'après ce que je vois, non, il est toujours en difficulté. Peut-être que ce n'est pas le bon mot qui pose problème, mais je m'attendais à ce que le problème soit assez simple à résoudre, comme quelques lignes de code quelque part, mais peut-être que les fichiers ne les téléchargeraient pas sur Github à cause de ces problèmes, vous savez ? Mais le modèle, Clot 4, est vraiment trop. Cela prend vraiment son temps. Et d'après ce que je vois, il s'agit de démarrer des serveurs. Il s'agit de créer une page de test, un serveur de test. Et c'est en fait assez impressionnant. C'est un drapeau vert, même si c'est un peu ennuyeux, pour être honnête. Alors, jetez un œil ici. Cela crée un serveur sur lequel nous pouvons tester et voir si les images fonctionnent réellement, si elles sont chargées. Et c'est fascinant. Et oui, nous pouvons voir que 11 images sur 11 sont réellement affichées. Cependant, pour être honnête, jetez un œil aux tailles. Ils sont absolument énormes. C'est donc un problème que nous pourrions certainement résoudre pour de futurs projets. Mais pour être honnête, je savais en fait que cela risquait de poser problème. Maintenant, voici le truc. Les modèles peuvent donc optimiser les images pour nous, que vous le demandiez directement ou selon ce que le modèle suggère. C'est ce que j' essayais de capturer dans l'enregistrement. Ici, cependant, cela a fait beaucoup de mal, mais c'est quand même une bonne expérience d'apprentissage. Maintenant, vous pouvez éviter cela. Zoomons donc vers l'avant et voyons ce que fait le modèle. Avancez donc vite, et je pense que c'est fait. Le résumé est énorme. Impressionnant. Beaucoup , beaucoup de lignes. C'est très utile parce que nous pouvons lire quelque chose dans un anglais simple. Cependant, la question est le modèle a résolu le problème. Nous devons d'abord vérifier Github. S'il n'y a pas de mise à jour récente sur Github, il n'y a aucune chance que la version fonctionnelle du site Web nous montre des images N'oubliez pas que nous nous appuyons toujours sur Github comme intermédiaire entre le curseur et Versell Et non, je ne vois pas de mise à jour récente. Le mannequin a oublié ou n'a pas compris mon message parce que, pour être honnête, j'étais un peu vague. Mais pas de soucis. Faisons-le. Le projet est là et je vais lui donner le lien proprement dit. Cela devrait éviter tout problème potentiel. OK, voyons ce que c'est. OK, le mannequin semble comprendre. Il ouvre un terminal, et il va probablement vérifier des informations. Cela prend parfois un certain temps. Et parfois, il gèle. C'est un gros problème car il n'y a pas de barre de progression. Il n'y a aucun bon moyen de vérifier si cela fonctionne toujours ou non, moins aucun à ma connaissance. Ce que j'aime faire, c'est simplement cliquer ici sur Passer en arrière-plan. C'est très, très petit, mais j'espère que vous pouvez le voir. Et cela agit comme un petit rafraîchissement. Maintenant, après quelques secondes, il semble que cela fonctionne toujours, nous sommes donc de retour sur la bonne voie. La tâche est désormais simple. Téléchargez des fichiers sur Github. Cela devrait être facile, non ? D'ailleurs, nous pourrions potentiellement utiliser le terminal et télécharger les fichiers nous-mêmes. En fait, ce n'est pas si difficile. Les commandes ne sont pas compliquées, mais voilà le truc. Je veux que le mannequin le fasse. Il peut le faire. Donc, bien sûr, il devrait le faire. Et d'un autre côté, je préfère découvrir ses limites, vous savez, trouver sa personnalité, l' explorer, voir de quoi il s'agit. Bien sûr, nous pourrions travailler davantage nous-mêmes, mais là n'est pas le but. Bien sûr, si quelque chose est impossible, le modèle ne peut pas réellement le faire. Bien sûr, nous allons le faire. Mais quand je sais que le mannequin peut le faire tout seul, je ne me lèverai pas de ma chaise pour l'aider. S'il en est plus que capable, il devrait le faire. Mais oui, cela prend du temps. L'ensemble du processus a duré environ 25 minutes. Incroyablement frustrant. Et voilà le truc. Au bout d'un moment, il semble avoir relancé le processus de réflexion, ce qui n'est pas normal Il s'agit d'y réfléchir à nouveau et de planifier les prochaines étapes. Il s'agit simplement de télécharger un fichier. C'est ça. C'est donc comme si quelqu'un avait débranché le modèle puis l'avait rebranché Amnesia, j'ai oublié. Bien sûr, cela n'a pas échoué. Il ne nous a pas demandé d'aide. Mais cela cache un peu le fait qu'il a échoué, ce qui est un gros signal d'alarme. Ces modèles sont entraînés pour ne pas manquer de dissimuler leurs erreurs. Combinez cela avec le délai d'expiration de 25 étapes et les faux problèmes de connexion Et je comprends pourquoi beaucoup de gens n'en sont pas amoureux, en particulier les développeurs seniors. Maintenant, je veux être ouvert et transparent à propos de ces problèmes, afin que vous sachiez à quoi vous pouvez vous attendre. Certains codeurs Vibe pensent qu' ils peuvent réellement remplacer les codes Senior comme ça Mais être arrogant n'aide pas, surtout lorsque la performance n'est tout simplement pas au rendez-vous. Mais je vais passer à autre chose et en voici le résumé. Il semble que cela ait réussi à se terminer, mais nous devons vérifier. Je n'ai pas confiance en elle. Cela dit que nous avons besoin d'une clé pour renvoi et d'autres choses qui n'ont aucun sens Je suis donc assez sceptique. Jetons donc un coup d'œil à Github, Control R ou F five pour nous rafraîchir Et c'est une mise à jour qui vient d'être faite. Au fait, 45 validations, 45 mises à jour. C'est bien trop. C'est ridicule. C'est un signe. Le modèle a essayé bien trop de fois. Quelque chose clochait clairement. Maintenant, vérifions-le. Ils savent qu'il y a un retard. La dernière version est celle qui existe, donc rien n'a probablement changé. Aucune image à voir dans cette version. Mais oui, au bout de quelques secondes, un nouveau va apparaître et s'y trouver. Oui, nous avons nos images. Cela n'a pas été facile, mais nous avons réussi à nous en sortir. Maintenant, j'espère que vous avez réussi à en arriver à un site Web fonctionnel sans aucun bogue majeur. Maintenant, faisons une pause et nous verrons ce que nous pouvons améliorer. Je vais te voir dans une seconde. 26. Améliorer le site Web: Bon retour. À ce stade, fois que tout est prêt, il existe une connexion entre le curseur, Github et Versell, ce qui signifie que nous pouvons continuer à travailler dans Cursor, et le site Web va automatiquement mettre à jour des éléments fantastiques Bien entendu, il existe de nombreuses façons de travailler. Par exemple, nous pouvons tester quelque chose, puis revenir à une version précédente. Après tout, c'est pourquoi nous avons le contrôle de version sur Gid Hub. Mais je suppose que nous allons constamment publier des mises à jour, nous allons continuer, puis voyons comment cela se passe. Nous allons donc nous concentrer sur le curseur. Nous allons demander au modèle de mettre à jour le schéma de couleurs. Je veux un changement radical, et je pense que cela devrait être assez évident, tu sais ? Alors faisons-le. Changeons le schéma de couleurs du bleu au rouge, puis envoyons la mise à jour sur Github Ici, pour être honnête, compte tenu de notre expérience, j'aurais pu fournir le lien. Mais dans le passé, cela n'était pas nécessaire dans mes projets précédents. Alors croisons les doigts, voyons comment ça se passe. N'oubliez pas que toutes ces vidéos sont enregistrées les unes après les autres. Donc, s'il y a un embouteillage, il y a de fortes chances que les performances ne soient pas excellentes. Ça va être aussi mauvais que les vidéos précédentes. Mais voilà le truc. Si le modèle fait une erreur, je préfère de loin le montrer plutôt que, vous savez, montrer une version modifiée où tout se passe parfaitement, parce que voilà le truc. Quand j'apprenais à coder en mode vibe, j'ai regardé de nombreux cours, tutoriels, où, vous savez, il était dit « étape A, B, C », puis « réussite Ça avait l'air génial. Mais pour ma part, j'ai passé des heures sur l'étape B, ou je n'arrivais même pas à comprendre comment démarrer l' étape A. Par exemple, créer un script Python rapide et l'exécuter dans votre terminal. Ces choses-là m'ont agacée. Je n'en avais aucune idée, aucun contexte, aucune idée. Ou alors que j'essayais de résoudre un problème, m'a demandé, vous savez, des choses comme : OK, quel terminal utilisez-vous ? C'est là qu'il faut être patient. Il faut être zen. Vous devez essayer différentes choses jusqu'à ce que cela fonctionne. Posez la question de différentes manières et continuez à chercher la solution. C'est donc mon expérience, et c'est ce que j' essaie de vous enseigner également. Maintenant, revenons au projet. Cela prend une éternité. Mais permettez-moi de zoomer. OK, voici le message de réussite. Permettez-moi de vérifier sur GitHub que nous avons bien une mise à jour. Et voilà le truc. Le modèle a en fait créé une nouvelle branche. Woof, ce n'est pas l'idéal. Je vais expliquer ce que cela signifie dans une seconde. Voyons quand même si cela a fonctionné. Nous devons vérifier Versldoh. Ici, nous devons attendre quelques secondes car la dernière mise à jour de Github met un moment avant qu' elle ne soit envoyée à Versell Mais avance vite, et oui, nous avons notre schéma de couleur rouge. Le mannequin a fait le job. La mise à jour n'a pas été lancée correctement, mais c'est une bonne expérience d' apprentissage, à noter. Tout d'abord, nous pouvons le faire. Comme la version rouge n' est pas la version principale, nous pouvons cliquer dessus puis choisir de la mettre en production. Cela signifie que cresbarn.net va enfin devenir rouge. C'est donc une chose que nous devons faire. va falloir attendre qu'il soit construit, mais je vais accélérer les choses. Maintenant, voici comment vous devez aborder ces situations. Donc, dans Github, nous avons une sorte de message d' avertissement. Mais disons que nous ne savons pas quoi faire. Pas de problème Il suffit de prendre une capture d'écran de cette zone spécifique , puis de la faire glisser dans le chat. Faites-le glisser vers le curseur. D'ailleurs, si vous essayez de capturer l'intégralité de l'écran, cela risque de ne pas fonctionner aussi bien et le nom du fichier peut également poser problème. Si vous utilisez Windows F, deux pour le renommer. Désormais, les captures d'écran ont généralement des noms très longs. Raccourcis-le juste pour des raisons de sécurité. J'utilise SS depuis une capture d'écran. OK, maintenant, vérifiez si vous voyez un petit aperçu ici. Mais oui, après avoir fait glisser l'image à l'intérieur, demandez simplement ce qui se passe avec ce message. Quelle est la situation sur Github ? Et même si le modèle a échoué à bien des égards, je pense toujours que c'est la meilleure approche. Il suffit de demander, tu sais ? Et au bout de quelques secondes, cela explique en fait ce qui s'est passé. Et à première vue, il propose deux choix. Mais voici les choses amusantes. Il exécute déjà la deuxième option, nous n'avons donc pas à prendre de décision ici. Permettez-moi maintenant d'expliquer ce qui s'est passé, même si je suis certain que dans le résumé, le modèle va également l'expliquer. Supposons donc que nous travaillions pour le client, n'est-ce pas ? Et le client n'est pas sûr ce à quoi devrait ressembler le site Web. C'est pourquoi nous voulons présenter deux choix, un rouge et un bleu. Bon, maintenant, une façon d'y parvenir est de créer une nouvelle branche dans le hub Gid En gros, c'est une alternative. Travailler avec des branches vous permet d'expérimenter différentes apparences, différentes mises en page, différentes fonctionnalités, mais sans avoir à revenir en arrière sans avoir à annuler maintenant, vous pouvez annuler, revenir en arrière, c'est une Vous savez, enregistrez une version bleue , puis enregistrez une version rouge. Mais c'est une seule ligne, tu sais ? Et à cette fin, vous pouvez montrer le rouge. Et si le client ne l'aime pas, vous pouvez demander au modèle de revenir à un modèle précédent. OK, ce n'est pas aussi bon. Au lieu d'avoir une seule ligne, ligne imaginaire, vous créez une branche séparée, une ligne séparée, si vous voulez. Maintenant, c'est une méthode de préférence, mais la plupart des développeurs préféreraient utiliser une branche différente pour ce genre de choses. Et oui, c'est ce que le modèle nous dit également dans le résumé. Mais cela l'a essentiellement corrigé, et ce message n'est plus disponible sur Github Cela signifie donc que nous avons terminé. Nous nous sommes tous mis en place. Maintenant, c'est à vous de décider. Partez du haut, utilisez la même invite et créez un site Web vétérinaire. Je vous en prie, soyez calmes et amusez-vous bien. Raconte-moi ton expérience. Publiez une capture d'écran et dites-moi comment le modèle a fonctionné de votre côté. Dites-moi le bon, le mauvais et le médiocre. Vous pouvez remplacer quelques éléments dans l'invite. Vous pouvez réduire les images si vous voulez être prudent. Mais l'objectif est de refaire ce projet de la même manière Si vous ne souhaitez pas partager de capture d'écran, vous pouvez partager le lien VSL Je ne vous recommande pas d'acheter un nom de domaine pour des raisons de discours. Un VersLink fera très bien l'affaire. Alors vas-y et amuse-toi bien. Explorez. C'est comme apprendre à nager ou à faire du vélo. Tu vas tomber. Vous pourriez avaler de l'eau, eau salée Mais dans l'ensemble, ce sera une expérience positive, et vous serez heureuse de l'avoir fait. Avec le Vibe Coding, c' est le cas. OK, continuons. 27. Pas sûr ?Regardez cette vidéo (en anglais: Bon retour. Je tiens à souligner quelque chose. Lorsque j'ai appris à coder par vibration, j'ai essayé d'utiliser des projets créés par mon ancienne forme de développeur Ces gars étaient des développeurs qualifiés avec beaucoup de connaissances, mais ils ont commis une grosse erreur. Ils n'ont laissé aucune note. Maintenant, dans GitHub, dans mon propre GitHub, je peux accéder à 30 ou 40 projets qu'ils ont réalisés, mais voilà le truc Je ne sais rien d'eux. Donc, quand j'ai commencé, j'ai essayé de les mettre à jour et de les faire fonctionner. Ils ont été fabriqués en 2018, 2019, donc évidemment assez vieux. Et voilà le truc. Bref, j'ai échoué. J'ai passé beaucoup de temps, beaucoup de crédits, et c'était très ennuyeux. Puis j'ai essayé de taper pour la première fois. Alors j'ai changé d' approche et j'ai dit : « D'accord, faisons moi-même mon premier tapotement. Mais je vais utiliser un code existant, non ? Je vais donc utiliser quelque chose de Github. N'oubliez pas que certains projets sont publics. Cela signifie que vous pouvez les copier et vous pouvez construire dessus, n'est-ce pas ? Et je me suis dit que cela me permettrait d'économiser beaucoup de temps, de tracas et, bien sûr, de gaspiller des crédits. Mais voilà le truc. J'ai échoué une fois de plus. Et ce n'est pas l'échec qui est le problème, c'est ce que je ressentais, et c'est ce que je veux partager. Voilà le truc. Je travaillais avec des modèles d'IA ouverts, des modèles qui étaient gratuits à l'époque, les modèles 4 et 4.1. Et j' écrasais constamment des bugs, réparais des pièces, des pièces après des pièces Le problème, c'est que je ne savais pas si je prenais du BG 5 sur 50 ou 5 sur 50 000. Je n'avais aucun point de référence. C'était comme nager dans l'océan avec beaucoup de brouillard autour de moi. Je ne pouvais pas voir le rivage. Je ne pouvais pas voir la plage. Je ne savais pas si je nageais dans la bonne direction. J'étais peut-être à quelques encablures de la plage. J'étais peut-être à des kilomètres. Et c'était super fatiguant, d'essayer diverses choses, d' essayer toutes sortes de choses Et c'est là le problème. Je ne savais pas si je m'en rapprochais, si j'étais plus proche l'objectif final, qui est de mener à bien le projet. Je n'en avais aucune idée. Et voilà le truc. Si vous êtes bloqué et que vous n'en êtes pas sûr, vous pouvez toujours entamer une nouvelle conversation. Il vous suffit de cliquer ici. Un nouveau modèle sera d'autant plus utile. Par exemple, si je devais ajouter la section galerie au site Web du dentiste, je lancerais une nouvelle conversation en cliquant ici. Il s'agit de la méthode recommandée. Vous divisez le projet en plusieurs parties. Nous avons maintenant une fondation. Nous l'avons publié. Cool. Ensuite, nous souhaiterons peut-être ajouter quoi que ce soit, une galerie, puis un suivi Google Analytics, puis peut-être un formulaire plus compliqué. OK, eh bien, ces choses peuvent être trois conversations différentes. N'oubliez pas que vous utilisez le même montant de crédits. Il n'y a aucun inconvénient, mais une nouvelle conversation signifie un nouveau modèle Il n'est pas fatigué par les instructions précédentes. Mais pour en revenir à mon point de vue, si vous avez l'impression de nager dans un océan et que vous ne savez pas où vous vous trouvez, vous devez faire une pause et réévaluer Vous devez changer de modèle ou démarrer une nouvelle conversation. instant, j'ai tendance à penser qu'il vaut mieux partir de zéro. Ayez le modèle, créez vous-même tout à partir de zéro. Mais bien sûr, vous pouvez faire référence à un projet. Encore une fois, pour vous inspirer, utilisez-le comme source d'inspiration, et le modèle en tiendra compte. Mais n'importez pas de code, et j'espère qu'il fonctionnera. J'espère que vous pourrez vous appuyer sur cela. Habituellement, cela ne fonctionnera pas, surtout au début de votre carrière. Je vous conseille donc de commencer par de petits projets amusants, puis de gravir les échelons. Ne vous fatiguez pas en nageant trop longtemps dans l'inconnu. Oui, soyez patient. Mais si vous avez l'impression de ne pas faire de bons progrès, vous devriez faire une pause et chercher une autre solution. 28. Mes conseils honnêtes: Bon retour. Félicitations. Tu es arrivée jusqu'au bout, et c'est un gros problème. Vous ne vous êtes pas contenté de créer quelques sites Web. Vous avez en fait développé les compétences qui les sous-tendent. Vous avez appris à guider l'IA à l'aide d'instructions claires, à créer un style précis, à améliorer l'apparence et à vous sentir mieux Et cela sans plonger dans un code complexe, sans aucun codage. Plus important encore, vous vous entraînez un peu à chaque fois, quelques instructions ici et là, quelques ajustements ici Et c'est comme ça qu'on devient bon. Non pas en regardant mais en pratiquant. Et maintenant ? Eh bien, tu dois continuer. Tu dois choisir une toute nouvelle idée. Vous pouvez créer une marque, un projet personnel. Vous créez un nouveau dossier et vous travaillez simplement. Vous essayez l'invite, vous la collez, vous la peaufinez, vous la publiez, vous la personnalisez. En gros, vous êtes prêt à créer des choses pour vous-même, puis pour vos clients, peut-être juste pour le plaisir. Mais quoi que vous fassiez, souvenez-vous de ceci, vous devez avoir la foi. Il faut être patient. Et oui, vous n'avez pas vraiment besoin d'un développeur pour créer de belles choses. Il suffit de savoir comment parler à ces outils. Merci d'avoir passé ce temps avec moi. Va créer quelque chose dont tu seras fier. Au fur et à mesure que les choses changeront, je vais continuer à mettre à jour le cours. Je vais ajouter de nouveaux projets, de nouvelles fonctionnalités, plus d'exercices. Mais oui, pour le moment, tu dois continuer à t'entraîner. Tu l'as. C'est Chris Barron qui démissionne. Merci beaucoup