Wie ich als Produktmanager und Nicht-Programmierer eine Reise-KI-App mit ChatGPT entwickelt habe

Ich tat es! Ich habe ungefähr 100 Stunden gebraucht, aber mit der Hilfe von ChatGPT konnte ich eine echte App schreiben und bereitstellen.

Seitdem habe ich etwa weitere 100 Stunden damit verbracht, Funktionen zu pflegen und hinzuzufügen, sodass daraus ein schönes, voll leidenschaftliches Projekt geworden ist.

Die Prämisse des Experiments lautete: „Kann ich als Produktmanager, der schon lange nicht mehr aktiv Code geschrieben hat, mit ChatGPT eine App entwerfen, erstellen und bereitstellen?“

Ich verfüge über eine gute Grundlage, da ich meinen Bachelor in Informatik gemacht habe und mich mit verschiedenen Aspekten der Technologie (Systemdesign, Entwicklung, DevOps, Hosting) beschäftige, aber ich habe in den letzten mehr als 10 Jahren keine praktische Entwicklung mehr durchgeführt.

Ich habe ein ziemlich gutes Gespür für Produkte, was sich in einem Verständnis dafür niederschlägt, wie man Produkte iterativ baut und wie man die Funktionalität überprüft, was meiner Meinung nach hilfreich war.

Wie bei der SW-Entwicklung üblich, flossen mehr als 80 % der Zeit in die Fehlersuche und das Debuggen.

Warum Reise-KI

In meinem Bestreben, etwas Nützliches rund um die ChatGPT-API zusammenzustellen, dachte ich, dass GPT einzigartig geeignet ist, das Problem der Reiseplanung anzugehen – herauszufinden, wo man hingehen sollte, welche Sehenswürdigkeiten man besuchen sollte, Reiserouten usw. Es gibt viele Entscheidungen zu treffen Ich halte es für wertvoll, wenn ich auf Reisen arbeite und jemanden beauftrage, dies alles auf der Grundlage individueller Vorlieben oder Umstände für Sie zusammenzustellen.

Codierung mit ChatGPT

Ich habe ungefähr 6 Wochen damit verbracht, nachts und an einigen Wochenenden zu arbeiten, vielleicht insgesamt 100 Stunden. Ich hatte ein ChatGPT+-Konto, was mir eine bessere Stabilität beim Zugriff auf den Bot und beim Zugriff auf GPT4 verschaffte.

Hier sind meine Erkenntnisse aus diesem Prozess:

• ChatGPT hat mir geholfen, die richtigen Tools für den Job auszuwählen (Vue.js-Framework für die Single-Page-App) und den Code in Iterationen zu entwickeln. Ohne hätte ich es definitiv nicht geschafft. Trotzdem gab es definitiv Komplikationen:

  
  

  1. Die Beschränkungen, die die ChatGPT-Benutzeroberfläche vorgibt (4.000 Tokens für Ein- und Ausgabe und ungefähr 15.000 Kontext), sind ziemlich restriktiv und Sie führen am Ende eine starke Segmentierung Ihrer Fragen durch. Dies ist nicht ideal und erfordert zusätzlichen Aufwand. Ich habe den Zugriff über die CLI noch nicht ausprobiert – ich habe nur irgendwo gelesen, dass es nicht die gleichen Einschränkungen gibt – einen Blick wert.

  2. Die Qualität der „Verständlichkeit des Codes“ war inkonsistent – manchmal ist es besser, manchmal schlechter. Ich bin mir nicht sicher, womit es zu tun hat.

  3. Daher würde ich raten, frühzeitig mit der Strukturierung des Codes zu beginnen (den Code in kleinere Funktionen aufzuteilen), da ChatGPT dies nicht automatisch für Sie erledigt, dies aber tun wird, wenn Sie darum bitten. Dies erleichtert später die Fehlerbehebung.

  4. GPT4 bricht nach 25 Abfragen über 3 Stunden ab und schaltet auf das „Standard“-Modell um, von dem ich annehme, dass es 3,5 ist. Interessanterweise kommt es ziemlich gut an und ich möchte fast sagen, dass es besser abschneidet als GPT4, aber weil ich nicht damit angefangen habe Mit 3,5 ist es kein direkter Vergleich.

     
     

     Update: Die Limits wurden kürzlich auf 50 Abfragen innerhalb von 3 Stunden angehoben.

Entwicklungs- und Bereitstellungsumgebungen

• Ich habe Replit für die New-Age-IDE verwendet. Es ist ein gutes Konzept und wahrscheinlich die Zukunft, insbesondere wenn es mit einer sinnvollen Codex/ChatGPT-Integration kombiniert werden kann. Die KI, die sie derzeit haben, ist nicht besonders nützlich, da sie den Code aus dem Projekt nicht nutzt und dieselben Manipulationen und Hin- und Herbewegungen erfordert, die ich mit ChatGPT durchgeführt habe. Mir hat jedoch sehr gut gefallen, wie sich Replit für die Quellcodeverwaltung in Github integriert und wie es sich um das Staging kümmert.

  
  

• Ich habe die Bereitstellung mit Cloudflare durchgeführt, da ich eine cloudnative Bereitstellung wollte. Ich habe CF-Seiten für die Benutzeroberfläche und Worker für das Backend (API-Gateway) verwendet. Mir gefiel die Integration der Seiten in Github für CICD – das war wirklich cool – im Grunde würde sich die App bei jedem Commit im Hauptzweig neu bereitstellen.

  
  

  Im Allgemeinen ist CF großartig, da es eine Menge Networking-Probleme vereinfacht.

Prompt

Ich habe ziemlich viel Zeit damit verbracht und viele Iterationen an der Eingabeaufforderung durchgeführt, sie ausgespült und versucht, auf Eigenheiten einzugehen. Einer der ersten Entscheidungspunkte war, ob die ChatGPT-API eine Textliste zurückgeben soll, die ich dann zu verstehen und zu klassifizieren versuche, oder ob sie JSON zurückgeben soll, in das bereits eine Struktur integriert ist. Die Vorstellung, Textdaten in eine Struktur interpretieren zu müssen, machte mir Angst, da die Strukturen immer komplexer wurden, da ich immer mehr Daten von ChatGPT anforderte (wie aus diesem Snippet hervorgeht).

Aus diesem Grund habe ich mich entschieden, ChatGPT für JSON aufzufordern. Dies hatte jedoch seine eigenen Nebenwirkungen, da JSON nicht immer gut strukturiert war oder die Eingabeaufforderung zu vieldeutig war und ChatGPT ein Ergebnis zurückgab, das ich nicht erwartet hatte. Ich würde sagen, dass ich fast 25 % der Zeit zwischen sofortiger Feinabstimmung und JSON-Fehlerbehandlung verbracht habe. Es war eine ziemliche Lernerfahrung. Letztendlich ist hier die Eingabeaufforderung, die ich erhalten habe:

 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" } ]`;

Hinweis: Zum Zeitpunkt des Schreibens dieses Artikels hat OpenAI gerade Verbesserungen zur Feinabstimmung veröffentlicht, die meiner Meinung nach sehr hilfreich sein können, um die Rückgabe strukturierter JSON-Daten robuster und konsistenter zu machen.

Wunschzettel

Der größte Punkt auf meiner Wunschliste ist derzeit die Integration der Entwicklungsumgebung/KI-Codegenerierung. Dinge hin und her einzufügen und darauf zu achten, die Codestruktur nicht durcheinander zu bringen (besonders wenn die Codebasis größer wird), lässt definitiv zu wünschen übrig.

Ich denke, der nächste große Schritt in der KI-Code-Generierung werden integrierte intelligente Code-Editoren sein, die den Code intern in Abschnitte zerlegen und relevante Eingaben zum/vom Modell bereitstellen und akzeptieren können, ohne dass der Benutzer dies manuell tun muss.

Der nächste Schritt danach wäre die Integration in den Browser zu Debugging-Zwecken, um letztendlich einen iterativen Debugging-Zyklus mit geschlossenem Regelkreis zu schaffen.

Das wäre ein cooles Projekt, an dem man arbeiten könnte!

Hinweis: Ich bin gespannt, was Google mit dem IDX-Projekt vorhat – vielleicht ist es genau das.

Zusammenfassung

Insgesamt war ich nicht nur in der Lage, eine (meiner Meinung nach) nützliche App zu erstellen, sondern habe mich auch mit den modernen Frameworks vertraut gemacht und etwas praktische Zeit gewonnen, ohne mich mit Syntax und Framework-Lernen zu beschäftigen, was genau das war, was ich wollte. Ich denke, es ist eine große Sache und öffnet viel mehr Menschen die Tür zur Softwareentwicklung.

Sie finden die App unter VoyageAI.app . Die Nutzung der App ist und bleibt kostenlos, ohne Werbung und ohne Logins (also ohne Verwendung personenbezogener Daten).