Comment j'ai développé une application Travel AI avec ChatGPT en tant que chef de produit et non-programmeur

Je l'ai fait! Cela m'a pris environ 100 heures, mais j'ai pu écrire et déployer une véritable application avec l'aide de ChatGPT.

Depuis, j'ai passé environ 100 heures supplémentaires à maintenir et à ajouter des fonctionnalités, ce qui s'est transformé en un joli projet passionné à part entière.

Le principe de l'expérience était le suivant : « Puis-je, en tant que chef de produit, qui n'a pas activement écrit de code depuis longtemps, concevoir, créer et déployer une application à l'aide de ChatGPT ? »

J'ai une base décente, ayant fait mon BS en CS et m'occupant de divers aspects de la technologie (conception de systèmes, développement, développement, hébergement), mais je n'ai pas fait de développement pratique depuis plus de 10 ans.

J'ai un assez bon sens du produit, ce qui se traduit par une compréhension de la façon de créer des produits de manière itérative et de vérifier les fonctionnalités, ce qui, je pense, m'a aidé.

Comme d'habitude avec le développement de logiciels, plus de 80 % du temps a été consacré au dépannage et au débogage.

Pourquoi l'IA de voyage

Dans ma quête pour créer quelque chose d'utile autour de l'API ChatGPT, j'ai pensé que GPT était particulièrement qualifié pour résoudre le problème de la planification des voyages : déterminer les endroits où aller, les points d'intérêt à visiter, les itinéraires, etc. Il y a beaucoup de décisions à prendre. fait lorsque vous voyagez et demander à quelqu'un de rassembler tout cela pour vous en fonction de préférences ou de circonstances uniques, est quelque chose que j'ai pensé être précieux.

Codage avec ChatGPT

J'y ai passé environ 6 semaines à travailler la nuit et quelques week-ends, peut-être un total de 100 heures. J'avais un compte ChatGPT+, ce qui m'a donné une meilleure stabilité lors de l'accès au bot et de l'accès à GPT4.

Voici mes découvertes grâce à ce processus :

• ChatGPT m'a aidé à choisir les bons outils pour le travail (framework Vue.js pour l'application monopage) et à lancer le code par itérations. Je n'aurais certainement pas pu le faire sans cela. Cela dit, il y avait certainement des complications :

  
  

  1. Les limites imposées par l'interface utilisateur de ChatGPT (4 000 jetons en entrée et en sortie et autour de ce qui semble être 15 000 de contexte) sont assez restrictives et vous finissez par faire beaucoup de segmentation dans vos questions. C’est loin d’être idéal et demande des efforts supplémentaires. Je n'avais pas essayé d'accéder via CLI - il suffit de lire quelque part que cela n'impose pas les mêmes limites - cela vaut le détour.

  2. La qualité de la « donner du sens au code » a été incohérente : parfois elle fait mieux, et parfois elle fait moins bien. Je ne suis pas sûr de ce que cela a à voir.

  3. Avec cela, mon conseil serait de commencer à structurer le code dès le début (en divisant le code en fonctions plus petites), car ChatGPT ne le fera pas automatiquement pour vous, mais il le fera si vous le demandez. Cela facilite le dépannage en cours de route.

  4. GPT4 s'arrête après 25 requêtes sur 3 heures et vous fait passer au modèle "par défaut", qui, je suppose, est 3,5 - Fait intéressant, il répond plutôt bien et j'ai presque envie de dire qu'il fait mieux que GPT4, mais parce que je n'ai pas commencé avec 3,5, ce n'est pas une comparaison de pommes avec des pommes.

     
     

     Mise à jour : les limites ont été augmentées récemment à 50 requêtes sur 3 heures.

Environnements de développement et de déploiement

• J'ai utilisé Replit pour l'IDE new age. C'est un bon concept et c'est probablement l'avenir, surtout s'ils peuvent le combiner avec une intégration Codex/ChatGPT significative. L'IA dont ils disposent actuellement n'est pas très utile car elle n'utilise pas le code du projet et nécessite toutes les mêmes manipulations et allers-retours que je faisais avec ChatGPT. Cependant, j'ai vraiment aimé la façon dont Replit s'intègre à Github pour le contrôle de source et comment il prend en charge la mise en scène.

  
  

• J'ai déployé avec Cloudflare car je voulais déployer en tant que cloud natif. J'ai utilisé des pages CF pour l'interface utilisateur et un Workers pour le backend (passerelle API). J'ai aimé la façon dont les pages s'intégraient à Github pour CICD - c'était vraiment cool - en gros, l'application se redéployait sur n'importe quelle validation dans la branche principale.

  
  

  En général, CF est génial car il simplifie une tonne de problèmes de réseautage.

Rapide

J'ai passé pas mal de temps et effectué de nombreuses itérations sur l'invite, la vidant et essayant de résoudre les particularités. L'un des premiers points de décision était de savoir si l'API ChatGPT renvoyait une liste de textes que j'essaierais ensuite de comprendre et de classer ou si elle renvoyait un JSON qui a déjà une structure intégrée. La perspective de devoir interpréter des données textuelles dans une structure m'a fait peur car les structures devenaient de plus en plus complexes à mesure que je demandais de plus en plus de données à ChatGPT (comme en témoigne cet extrait)

Pour cette raison, j'ai décidé d'inviter ChatGPT pour JSON. Cependant, cela avait ses propres effets secondaires, car JSON n'était pas toujours bien structuré ou il y avait trop d'ambiguïté dans l'invite, où ChatGPT renvoyait un résultat auquel je ne m'attendais pas. Je dirais que j'ai passé près de 25 % du temps entre le réglage rapide et la gestion des erreurs JSON. Ce fut une véritable expérience d’apprentissage. En fin de compte, voici l'invite avec laquelle je me suis retrouvé :

 SYSTEM_PROMPT = `You are a helpful travel assistant. You perform the requests with diligence and make the best attempt to answer the questions, never refusing due to complexity etc. Reset the conversation if I mention a new location in my user prompt. Return the results in JSON format as an array of objects. Make sure JSON format is complete and valid and does not include unescaped special characters. Please avoid escaping double quotes and instead use single quotes or another method to prevent JSON parsing issues. Do not use "\n" newline symbols in the middle of element text. Each object in the array should have the following keys: - "title" - "description" - "airportCode" (for the destination airport) - "poi" (array of points of interest) - "lodging" (array of lodging options) - "itinerary" (array of objects, each representing a day) - "considerations" - "history" (history related to the destination) - "key_local_phrases" (array of common local phrases) - "cost" The "itinerary" key should contain an array of objects, each object representing a day with the key "activities", which is itself an array of objects. Each activity object should have the following keys: - "description" - "waypoint" (name of the location, not coordinates) - "cost" - "travelTime" - "travelOptions" If travel is involved within the itinerary, include "Travel To" as part of the daily activity and provide the travel time, travel options, and associated cost. Each step in the itinerary should also suggest representative local "food" to try. Focus on most interesting points of interest, lodging, and activities. Consider activities that are popular, affordable, and recommended by the travelers. Make sure you cover the entire duration of the trip or outing. If it says "week-long", it has to cover the entire week. It's OK to group multiple days or weeks together if it's a longer trip. If it doesn't give a timeframe, take a guess based on the nature of a trip. Considerations should include travel restrictions and visa requirements, typical weather, criminogenic conditions including which areas to avoid, recommendations on visit timing, parking situation, and ways to save on travel costs. Here is an example of the desired output format: [ { "title": "Sample Title", "description": "Sample Description", "airportCode": "XYZ", "poi": ["Sample POI1", "Sample POI2"], "lodging": ["Sample Lodging1", "Sample Lodging2"], "itinerary": [ { "day": "Sample Day 1-2 - City or Place", "location": "Wikipedia identifiable name of the place in city,_country or city,_state format", "activities": [ { "description": "Sample Activity1", "waypoint": "Sample Waypoint1 connected to the activity", "cost": "$100", "travelTime": "30 minutes", "travelOptions": "Taxi or Bus" }, { "description": "Sample Activity2", "waypoint": "Sample Waypoint2 connected to the activity", "cost": "$50", "travelTime": "1 hour", "travelOptions": "Ferry or Bus" } ], "food": ["Sample Food1 with short description", "Sample Food2 with short description"] }, { "day": "Sample Day 3 - City or Place", ... }, { "week": "Sample Week 2 - City or Place", ... } ], "considerations": "Sample considerations text", "history": "Sample history text", "key_local_phrases": ["Sample phrase 1 - translation", "Sample phrase 2 - translation"], "cost": "Sample total cost" } ]`;

Remarque : Au moment d'écrire ces lignes, OpenAI vient de publier des améliorations de réglage qui, à mon avis, peuvent être très utiles pour rendre le retour des données structurées JSON plus robuste et cohérent.

Liste de souhaits

L'élément le plus important sur ma liste de souhaits à ce stade est l'intégration de l'environnement de développement et de la génération de code AI. Coller des éléments d'avant en arrière, en cherchant à ne pas gâcher la structure du code (d'autant plus que la base de code s'agrandit) laisse certainement beaucoup à désirer.

Je pense que la prochaine grande étape dans la génération de code AI sera l'intégration d'éditeurs de code intelligents qui analysent le code en sections en interne et peuvent à la fois fournir et accepter des entrées pertinentes vers/depuis le modèle sans obliger l'utilisateur à le faire manuellement.

La prochaine étape consisterait à intégrer le navigateur à des fins de débogage, créant finalement un cycle de débogage itératif en boucle fermée.

Ce serait un projet sympa sur lequel travailler !

Remarque : je suis curieux de voir ce que Google a prévu avec le projet IDX - ce pourrait être juste cela.

Résumé

Dans l'ensemble, non seulement j'ai pu créer (ce que je pense être) une application utile, mais je me suis également familiarisé avec les frameworks modernes et j'ai eu du temps pratique, sans me noyer dans l'apprentissage de la syntaxe et du framework, ce qui est exactement ce que je voulais. Je pense que c'est un gros problème et qu'il ouvre la porte au développement de logiciels à beaucoup plus de personnes.

Vous pouvez trouver l'application sur VoyageAI.app . L'application est et restera gratuite, sans publicité ni connexion (donc sans utilisation de données personnelles).