Vibe KI-Programmierung für Anfänger:innen mit Bolt NEU

1. Einführung: Willkommen, alle zusammen. Mein Name ist Greg Kang Willkommen bei AI-Coding für Anfänger. Dieser Kurs richtet sich an alle , die mit dem Programmieren beginnen und dabei die Leistungsfähigkeit von EI nutzen und Ihre Kreativität einsetzen möchten. Sie benötigen keine Programmierkenntnisse. Und ich bin tatsächlich seit über zehn Jahren ein kanadischer Inhaltsersteller . Ich habe einen technologischen Hintergrund, bin aber kein Programmierer. Aber ein Freund hat mir diese App vorgestellt. Ich fing an, damit herumzuspielen. Ich habe angefangen, verschiedene Anwendungen zu erstellen wie diese Seite hier, die einen Community-Chat hat. Es gibt Rankings, ein Verzeichnis der besten Digionmad-Standorte. Und in diesem Kurs werde ich Ihnen Schritt für Schritt zeigen, wie Sie auf dieser Plattform beginnen, Ihre eigenen Apps erstellen und dabei Ihrer Kreativität freien Lauf lassen können Es macht viel Spaß, also lasst uns anfangen. 2. Erwartungen setzen: Hallo. Bevor wir mit dem Kurs beginnen, möchte ich nur Ihre Erwartungen an die Struktur des Kurses darlegen , was Sie erwarten können, zu lernen und wie Sie aus dem Kurs herauskommen können. KI-Codierung ist also ein sehr neues Gebiet. Tatsächlich wurde Bolt erst im Dezember 2024 veröffentlicht. Wir sind jetzt im Januar 2025. Sie können also mit vielen Experimenten rechnen, um zu sehen, was Sie aus der App herausholen und was Sie erstellen können Und ich werde das in den Lektionen durchgehen, Sie werden sehen, wie ich eine Vielzahl von Apps erstelle, und ich habe hier eine Liste, weil ich hier einige erstellt habe Sie werden also verschiedene Websites sehen, die Rankings erstellen. Zum Beispiel die reichsten Menschen der Welt. Sie haben auch eine Anleitung zum Erstellen von Instagram-Rankings . Während der Erstellung dieser Apps werde ich Ihnen zeigen, wie Sie verschiedene Funktionen wie Filter implementieren und werde ich Ihnen zeigen, wie Sie verschiedene Funktionen wie wie Sie Profilbilder hinzufügen, um Ihre App aufzupeppen und sie optisch ansprechender aussehen zu lassen ansprechender aussehen Ich habe auch ein Spiel , in dem ich dir zeigen werde, wie man Pong erstellt, das eigentliche TD-Spiel Pong mit KI-Codierung Wir werden auch funktionale Apps wie Währungsumrechnungsrechner entwickeln Wir werden APIs und Schnittstellen zur Anwendungsprogrammierung verwenden, um unserer App mehr Leistung zu verleihen Wir werden tatsächlich verschiedene APIs von Google aufrufen. Sie werden eine API aufrufen , die es uns ermöglicht, eine Audiodatei und mehr tatsächlich zu transkribieren Und APIs sind ein ziemlich mächtiges Merkmal der KI-Programmierkenntnisse , das Ihnen wirklich eine neue Welt eröffnen wird Wir werden auch zeigen, wie Sie PayPal oder Stripe verwenden können , um eine Paywall vor Ihrer App zu implementieren , falls Sie sie später monetarisieren möchten Abschließend zeige ich Ihnen ein wirklich fortgeschrittenes Beispiel, einen LLM-Chatbot mit mehreren KIs , der verschiedene KI-Chat-Bots von Open AI und Google verwendet, und dafür werde ich auch eine API verwenden Halten Sie also Ausschau nach dieser Lektion, und wir haben auch eine lustige, eine einfache Ridesharing-App, die Ihnen nicht die komplette App bietet, sondern Ihnen eine Vorstellung davon gibt, was Wenn Sie also diese Apps erstellen, werden Sie an einen Punkt kommen , an dem Sie etwas erstellen , es bereitstellen und Sie werden diese URL erhalten , die nicht benutzerfreundlich sein wird Also werde ich Ihnen einige Ideen geben wie Sie das ändern können. Ich denke, der einfachste Weg ist, eine Domain-Site von Netafe, dem integrierten Anbieter, zu kaufen eine Domain-Site von Netafe, dem integrierten Anbieter Aus Bolzen. Sie können aber auch einfach den Namen der Site-Konfiguration ändern, damit sie benutzerfreundlicher ist, z. B. pong dotnetlofy.com Und Sie verwenden auch die URL-Weiterleitung. Also werde ich Ihnen einige Beispiele zeigen, wie das geht. Gleichzeitig entwickelt sich die App selbst jede Woche weiter. Zum Beispiel führen sie in Bolt integrierte Super Base-Datenbank ein. Sie werden es oben rechts sehen, und so können Sie eine Datenbank erstellen, die Benutzer für Sie erstellt. Ich werde Ihnen auch eine andere Plattform namens Lovable vorstellen , die es etwas einfacher macht, eine Verbindung zur Datenbank herzustellen und die Authentifizierung von Google hinzuzufügen Meiner Meinung nach erleichtert es auch die Integration von Zahlungs-APIs von Stripe Deshalb werde ich dir am Ende des Kurses den liebenswerten Dot Dev vorstellen am Ende des Kurses den liebenswerten Dot Dev Sie haben also eine Vorstellung von anderen Alternativen nur zu BlanEU. Bol brachte Nu nicht die einzige Anwendung im Spiel bei, nicht den einzigen KI-Programmierer im Aber dieser Kurs ist wirklich für Anfänger konzipiert. Weil ich kein Programmierer bin und Ihnen die Möglichkeiten zeigen möchte, bin und Ihnen die Möglichkeiten zeigen möchte was möglich ist, wenn Sie kein Programmierer sind Aber wenn Sie ein Programmierer sind, dann müssen Sie damit rechnen, dass es einen ziemlich anfängerfreundlichen Kurs geben wird Wir werden nicht in die Tiefe gehen. Wir werden uns nicht mit GitHub-Repositorys befassen , solche Dinge Wir werden unsere Projekte nicht in ein Programm wie Cursor oder GitHub übertragen und uns dann mit dem Code beschäftigen Darum geht es in diesem Kurs also nicht, und aus diesem Grund lautet der Titel KI-Programmierung für Anfänger. Nachdem das geklärt ist, beginnen wir mit dem Kurs. 3. Anmeldung: Wir schauen uns gerade Schrauben an, und ich werde einfach einen Schritt zurücktreten und Ihnen zeigen, wie Sie anfangen können. Also zuerst willst du zum RL Bolt Dot Nu gehen . Das ist Bolt Dot Nu. Und was Sie tun müssen, ist sich für ein Konto anzumelden. Sobald Sie das Konto erstellt haben, können Sie sich im Dashboard anmelden und haben die Möglichkeit, einige Apps kostenlos zu erstellen und ein Gefühl dafür zu bekommen, was diese App kann. Jetzt, nach einer Weile, wird es dir sagen, dass du einige Credits benötigst, um dich anzumelden, und an dieser Stelle empfehle ich dir, dich für einen persönlichen Tarif anzumelden . Also werde ich dir nur den Plan zeigen, den ich habe. Also habe ich mich für den P-Plan angemeldet , der 20 US-Dollar kostet und der Ihnen 10 Millionen Tokens gibt, und das ist gut für einen Monat Und ich habe noch 8,2 Millionen Token übrig, und ich gebe Ihnen nur eine Vorstellung von der Anzahl der Apps , die ich erstellt habe So kannst du hier nebenbei auf deine Chats zugreifen. Sie können also sehen, dass ich eine Golf-Scoring-App, ein Währungs-Dashboard, ein Investment-Dashboard, eine Golfpunktanwendung, ein Golfplatz-Ranking, Bitcoin und ein Blockchain-Dashboard erstellt habe Währungs-Dashboard, ein Investment-Dashboard, eine Golfpunktanwendung, . Also habe ich mit den Tokens, die ich habe, ziemlich viel geschaffen. Mit diesem Symbol unten links können Sie also auf das Menü zugreifen. Und über das Menü können Sie auf Ihre Chats und Einstellungen zugreifen . Das Hilfecenter. Und du kannst deine Tokens dort tatsächlich sehen. Ich habe also fast 1,8 Millionen verwendet. Sie können mehr Tokens kaufen. Und im Abonnement, meinem Abonnement, kannst du sehen, welchen Abonnementplan du hast. Wenn du auf deinen Chat zugreifen und eine neue Aufforderung starten möchtest, hast du immer diese Option, und von diesem Menü aus kannst du jederzeit einen neuen Chat starten. Ordnung, damit werden wir von hier aus beginnen und unsere erste App erstellen 4. So sparst du Zeit und Token: Ordnung. Ich möchte ein Update zu Bolts machen, um dir Tokens und etwas Zeit zu sparen. Es gibt eine neue Einstellung, wenn Sie zu Ihren Einstellungen unten links gehen, und wenn Sie zu den Feature-Vorschauen gehen, gibt es eine Funktion namens DIFS, die Sie aktivieren können Und das bedeutet, anstatt die gesamte Datei neu zu schreiben, konzentriert sich nur auf die neuen Änderungen, wodurch Sie Zeit und Token sparen Also, als ich mir das vor nicht allzu langer Zeit angeschaut habe , war es letzte Woche eine experimentelle Phase, aber jetzt ist dieses Label weg Ich würde also sagen, dass es sicher ist, das zu versuchen. Ich habe es eine Woche lang ausprobiert und es scheint den Prozess etwas zu beschleunigen. Es befindet sich also wieder unter Einstellungen, Feature-Vorschauen und den Funktionen, die als DIFs bezeichnet werden Ich spare dir Tokens und Zeit. 5. KI-Eingabe-Tipps: Wenn es um generative KI geht, egal ob Sie Bilder, Videos oder Code generieren, ist das Geheimrezept meiner Meinung nach wirklich der Input, das schnelle Engineering. Anweisungen, die Sie geben, bestimmen also , was Sie aus diesen KI-Modellen herausholen Ich habe Bildgeneratoren wie Adobe Firefly, Diffusion, Microsoft Bangs Copilot, ChagBT und Metasama getestet Diffusion, Microsoft Bangs Copilot, ChagBT Es gibt jetzt einfach so viele verschiedene KI-Systeme. Aber die gemeinsame Fähigkeit, die auf allen Plattformen erforderlich ist, ist schnelles Engineering. Also, was sind hier einige Tipps? Wenn Sie also Videos mit dem Bildgenerator Opening Eye Sa oder Adobe Fireflies generieren , geben sie Ihnen einige Referenzbilder um zu zeigen, was ihr Modell kann Außerdem geben wir Ihnen einige Beispiele für verschiedene Arten von Bildern und Videos Sie können diese also als Referenzpunkte verwenden. Sie können in das Bild klicken, das Ihnen gefällt. Sie können die Aufforderung erhalten , mit der sie das Bild erstellen, den Stil, und dann können Sie es nach Ihren Wünschen anpassen Eine weitere wichtige Fähigkeit, sei es Bildgenerierung oder sogar die Codegenerierung, ist das, was ich Iteration, Wiederholung nenne Es ist also im Grunde ein ausgefallenes Wort dafür, es noch einmal zu tun. Sobald Sie also die erste Referenzaufforderung erhalten, werden Sie sie anpassen. Nehmen wir einfach an, Sie erhalten eine Aufforderung hyperrealistisches Bild von Vancouver vor der Bergkulisse Sie werden also Ihr erstes Bild generieren lassen und dann werden Sie wahrscheinlich feststellen, und dann werden Sie wahrscheinlich dass es nicht ganz Ihren Wünschen entspricht Dann möchten Sie also wiederholen, den Farbton ändern, den Himmel heller und wärmer machen und dann wiederholen Sie können auch Variationen vornehmen. einigen Plattformen wie Adobe Firefly können Sie also aus vier verschiedenen Versionen des Bildes wählen vier verschiedenen Versionen des Bildes Und von dort aus können Sie weiter iterieren und iterieren. Das meine ich also mit Iteration. Und natürlich kannst du manchmal deinen Fortschritt speichern. Du kannst es bevorzugen, damit du dich später an deinen Schöpfungsstil erinnern kannst deinen Schöpfungsstil erinnern Ich hatte also in letzter Zeit einige Erfahrungen mit dem Programmieren mit KI, und es ist eine sehr ähnliche Sache Du kannst mit einer ähnlichen Aufforderung beginnen wiederholen und etwas Unglaubliches erschaffen Und wenn Sie eine weitere App erstellen möchten, können Sie denselben Stil verwenden Ich habe zum Beispiel ein Kryptowährungs-Dashboard erstellt , das anpassbar war, Drop-down-Menüs und E-Mail-Benachrichtigungen enthielt. Nun, ich könnte dieselben Funktionen für eine andere Art von anpassbarem Dashboard verwenden. Sagen wir einfach für Sportergebnisse. Sie könnten also dasselbe Design und dieselbe Inspiration für eine andere Anwendung oder ein anderes KI-Image verwenden. Also ja, wie würde ich das nennen? Ich nenne es einfach Bookmarking, Bookmarken für deine Arbeit für die Zukunft Je genauer Sie in Ihren Eingabeaufforderungen sind, desto detaillierter wird Ihre Ausgabe Schnelles Engineering ist also unerlässlich, und ich denke, einige Fähigkeiten, um darin gut zu werden. Es ist nur eine Übung. Und wenn Sie dann diese Referenzbilder erhalten, schauen Sie sich die Eingabeaufforderungen an, und Sie werden einfach lernen, wenn Sie mehr tun Aber angesichts der Beliebtheit all dieser KI-Modelle kann ich mir definitiv mehr Kurse vorstellen, in denen Menschen im Bereich Prompt Engineering all dieser KI-Modelle Eine weitere Sache, die ich mit Ihnen teilen möchte, ist die verbesserte Eingabeaufforderungsfunktion. Einige Anwendungen wie Bol dachten neu. Ich glaube, es gibt andere wie WIX. Sie ermöglichen es Ihnen, zuerst Ihre Eingabeaufforderung zu erstellen, und möglicherweise sehen Sie ein magisches oder KI-Symbol, das Ihre erste Eingabeaufforderung näher Sehen Sie sich das hier in Aktion an. Ich habe gerade eine Aufforderung aus zwei Sätzen , um ein Instagram-Dashboard zu erstellen. Wenn ich auf die erweiterte Eingabeaufforderung klicke, kannst du sehen, dass sie ausarbeitet und sogar eine fundierte Vermutung darüber anstellt, was ich genau will, und du löst das Bild, um es zu bearbeiten, und fügst dann in deinen ersten Abschlussball So sehr mächtig. Viel Spaß damit und viel Glück. 6. So erstellst du das Instagram-Ranking für deine erste App: Leute, das ist Greg hier. Wir werden heute unsere erste App mit Boldoc New erstellen heute unsere erste App mit Boldoc Sie erhalten also eine Reihe kostenloser Eingabeaufforderungen zum Zahlungsplan, aber denken Sie darüber nach, bevor Sie fortfahren, und drücken Sie die Eingabetaste da die ersten Eingabeaufforderungen am wichtigsten Und ja, du kannst einfach mit einer ersten Aufforderung beginnen, und dann kannst du hier sehen, ich habe eine Idee für ein Dashboard-Ranking der besten Instagram-Influencer mit einer Profilauswahl und Sobald Sie Ihre Eingabeaufforderung eingegeben haben, haben Sie dieses Symbol, haben Sie dieses Symbol, dem es sich um eine erweiterte Eingabeaufforderung handelt Und wenn Sie darauf klicken, hilft Ihnen KI dabei, Ihre Eingabeaufforderung um viel spezifischere Anforderungen zu erweitern . Also werde ich es mir hier einfach durchlesen. Erstellen Sie ein visuell ansprechendes Dashboard, in dem die 20 wichtigsten Iscram-Einflüsse weltweit angezeigt werden, geordnet nach der Anzahl der Follower Enthält die folgenden Elemente für jeden Influencer, jede Profilauswahl Verwende den Namen mit verifiziertem Badge-Status, falls zutreffend, vollständigen Anzeigenamen, der Gesamtzahl Follower und dem Herkunftsland Das sieht toll aus. Also lass uns auf Go drücken. Er ist in Ordnung. So können wir sehen, wie der Code auf der rechten Seite generiert wird. Machen Sie sich jetzt keine Sorgen, wenn Sie nicht wissen, was das bedeutet. Es ist in Ordnung, weil Sie nur irgendwie auf der linken Seite folgen müssen. Ich gebe dir eine Vorstellung davon, was es tut. Sie warten auf Ihre erste Vorschau oder Ihren ersten Entwurf. Sobald Sie Ihre erste Vorschau oder Ihren ersten Entwurf haben, können Sie ihn überarbeiten oder wiederholen Okay, also du kannst meinen hier sehen. Und es zeigt mir hier zwei Namen. Okay, und dann zeigt es ein Problem auf der linken Seite, was normal ist. Es ist normal. Lassen Sie uns zunächst einfach auf Versuch korrigieren klicken, und dann fordere ich es vielleicht auf, weitere Profile aufzunehmen. Ich werde mich hier einfach aus dem Weg räumen. Ordnung. Und es ist normal, diese potenziellen Probleme zu bekommen. Korrigieren Sie das Profil, wählen Sie Bilder aus und zeigen Sie mindestens das Topt-Profil an. In Ordnung Also dann wird es gehen und sich wiederholen. Und Sie können auf der rechten Seite irgendwie sehen , dass es Selena Gomez für Nummer drei, Kylie Jenner für Nummer vier, The Rock für Nummer fünf abholt Kylie Jenner für Nummer vier, The Rock für Nummer fünf The Es nimmt also die Daten aus dem Code auf. Nun, was die Syntax angeht, ich meine, ich verstehe das und den ganzen Code hier nicht wirklich. Aber wie ich schon sagte, das musst du nicht wirklich. Es läuft einfach durch und macht sein Ding. Ihr Hauptziel ist es, es mithilfe dieser Technologie dazu zu bringen, das zu bekommen, was Sie wollen. Ordnung, großartig. Also die Top-Instagram-Influencer Christiana Ronaldo, Lionel Messi, Selena Gomez Und ja, diese Profilauswahl ist es zwar nicht, aber sie ist definitiv nicht korrekt. Es zeigt die richtigen Daten und andere Informationen wie das Wachstum die Anzahl der Follower, also ist dies eine gute zweite Version. Wenn Sie nun bei Ihrer zweiten oder dritten Aufforderung einen Fehler machen , haben Sie die Möglichkeit, hierher zurückzukehren. Also werde ich dir nur zeigen, wo. Sie ändern ständig Dinge , weil sie Updates an dieser Anwendung vornehmen. Aber Sie können hier am Ende Ihrer letzten Eingabeaufforderung sehen, dass es hier eine Schaltfläche zum Rückgängigmachen gibt. Sie können also auf Rückgängig klicken , falls etwas kaputt geht. Also werde ich hier weitere Funktionen hinzufügen. Ich werde einen Filter hinzufügen. Und bitte sie, die Profilauswahl zu korrigieren und einen Filter hinzuzufügen. So können Sie den Prozess zum Erstellen einer App gewissermaßen sehen. Sie erstellen Ihre allererste Aufforderung, Sie verbessern sie und dann erstellen Sie Ihre erste Version, schauen sich an, was Bolt für Sie erstellt, und dann können Sie sie überarbeiten und rückgängig machen Und es ist eine Reise, oder? Es ist ein Prozess. Die Qualität Ihrer App oder Ihrer Ausgabe hängt von Ihrer Eingabe ab. Okay, es kommt also ein bisschen ins Stocken. Nett. Und so haben wir weiterhin Probleme mit den Picks. Es könnte nur eine Copyright-Sache sein. Aber okay, ich habe Nike richtig verstanden. Zumindest haben wir die Daten hier und wir haben verschiedene Filterkategorien. Ich kann sehen, dass sie funktionieren. Klicken wir auf Musik, Beyonce, Ariana Grande, Justin Bieber, Das wird also ein guter Entwurf sein, oder? Also sagen wir einfach, wir sind bereit, das bereitzustellen, um es zu teilen. Und später zeige ich Ihnen, wie wir verschiedene URLs für unsere App erstellen können. Eine erweiterte Funktion ist die Möglichkeit, sie herunterzuladen und Splits zu öffnen und zu speichern oder sie mit einer Datenbank zu verbinden Das ist fortgeschrittener. An dieser Stelle klicke ich einfach auf Deploy. Und es wird eine URL mit Net LIFE, einer anderen Plattform , erstellen , und du bekommst diese URL, sodass du sie hier sehen kannst , wenn ich darauf klicke, sie öffnet die App und du kannst sie mit deinen Freunden teilen. Das ist live im Internet. Also da hast du's. Also mach weiter und erstelle deine erste App und denke über deine Idee nach. Geben Sie Ihre Idee bei der ersten Aufforderung ein. Vielleicht möchten Sie es mithilfe von KI verbessern und sich dann den ersten Entwurf ansehen und ihn dann einfach wiederholen und dann einsetzen Viel Glück. 7. Unsere zweite App entwickeln – die wohlhabendsten Menschen: Okay, hier ist die Bewerbung für die reichsten Personen der Welt hier. Sie können einige der reichsten Personen sehen, aus welcher Quelle ihr Vermögen stammt, welches Land und welches Unternehmen. Und Sie können hier nach Ländern filtern. In Ordnung. Also hier war die Aufforderung, eine detaillierte Liste der zehn reichsten Personen zu erstellen Und ich verwende wahrscheinlich die erweiterte KI-Eingabeaufforderung. Also habe ich das geschaffen. Und dann funktionierte die App zuerst nicht. Das hat also im Grunde nur den Bolzen bekommen , um Dinge zu reparieren. Und dann hat es es repariert. Ich habe es gebeten, neben dem Namen auch Profilbilder in einen Filter einzufügen . Das habe ich gemacht. Und dann, ja, habe ich die Anwendung bereitgestellt. Deshalb möchte ich Ihnen nur ein Beispiel für eine Iteration zeigen. Sagen wir einfach, ich habe es bereits veröffentlicht, aber ich möchte diese Anwendung verbessern Ich denke, eine gute Möglichkeit, dies zu verbessern, besteht darin, die Liste zu erweitern. Erweitern Sie die Liste um die 50 reichsten Personen Mal sehen, was die erweiterte Eingabeaufforderung sagt. In Ordnung, vollständiger Name, Reinvermögen des Autos. Sicher. Jetzt wird es nach Alter, Land der Staatsbürgerschaft und ein bisschen mehr Informationen fragen. Ich kann sehen, dass es die Sprache der Ratte benutzt. Ordnung. Aber immer noch nur zehn. Aber ich fange einfach klein an und schließe die Top 20 mit ein. Ich glaube, ich habe zu viele Informationen angefordert. Ich kann mir vorstellen, dass es die Liste hier hinzufügt, drei, vier, fünf, sechs. Also bekommt es das Bild von Wikipedia. Okay, jetzt kommen mehr Leute hinzu, neun, zehn, 11, 12, okay, das sieht gut aus. Nummer 16, Jensen Huang. Also wenn man sich den Code lange genug anschaut, man irgendwie versteht man irgendwie, was er hier eigentlich macht. Also los geht's. Jetzt haben wir eine längere Liste, bis zu 20 Personen. Und wir haben einen Filter, Mindestnettovermögen, Land. Und jetzt kann ich das tatsächlich herunterladen und bereitstellen. Da haben wir's. 8. Erstellen eines Mehrwährungsrechners: Okay, hier ist eine praktische App, mit der Sie eine Währung in eine andere umrechnen können Nehmen wir zum Beispiel an, 100 US-Dollar sind 94 Euro. Sie können das Ergebnis dann per E-Mail an sich selbst senden. Und dann können Sie sich auch Ihren Konvertierungsverlauf ansehen. Und hier gibt es auch einen Taschenrechner wenn Sie nur spontan einige Berechnungen durchführen möchten . Da haben wir's. Das ist also von einer anderen App namens X Currency inspiriert. Aber ja, ich möchte dir nur eine andere Art von Anwendung zeigen , um deine Ideen anzuregen. Schauen wir uns also einfach die Eingabeaufforderungen an , mit denen ich das erstelle Also habe ich ursprünglich eine Rechneranwendung für mehrere Währungen erstellt eine Rechneranwendung für mehrere Währungen Aber dann verwende ich die AI-Eingabeaufforderungen, den Konverter für mehrere Währungen Und wenn Sie dann unten links auf die KI-Eingabeaufforderung klicken, wird Ihre Eingabeaufforderung im Grunde so erweitert, dass sie alle Szenarien oder die meisten Szenarien abdeckt Also werde ich nicht weitermachen und das tun, weil ich es bereits getan habe. Aber ja, lassen Sie uns einfach die Aufforderung ändern. So habe ich diese App gestartet, oder? Und dann ging er weiter und machte sein Ding. Also wurde eine umfassende Währungsumrechner-App erstellt. Und dann war meine nächste Aufforderung eine Taschenrechnerfunktion hinzuzufügen , die die aus dem Drop-down-Menü ausgewählte Währung aus dem Drop-down-Menü ausgewählte verwendet, der sie nicht ganz entspricht. Ich wollte einen Taschenrechner in Euro oder USA verwenden können . Aber dann wurde mir klar, dass es nicht wirklich wichtig ist, weil 1$ ist 1$. Also habe ich den losgelassen. Und dann sage ich, kannst du einen Taschenrechner darunter hinzufügen , weil der Taschenrechner nicht hinzugefügt wurde? Aber am Ende wurde es auf die Seite gelegt, was in Ordnung ist. Und dann fügte ich ein weiteres Problem hinzu, fügte eine E-Mail-Funktion hinzu und lasse den Taschenrechner in Dollar rechnen, einen Header-Titel hinzu, schicke Weltwährung für Reisen. Und dann habe ich die Anwendung bereitgestellt. Ich habe meinen Link. Ein letzter Schliff ist, dass ich einen Link zur Website hinzufügen möchte. Also, wenn ich diesen Titel hier verlinken möchte, verlinke den Header hqvoyage mit dieser Seite. Und ja, ich denke, das ist so ziemlich alles. Fügen Sie unten einen Flug genauer hinzu. Lass uns das jetzt nicht tun. Lass uns einfach einen meiner ansehen. Lass uns sehen. Ich versuche es, ich bin sehr ehrgeizig, also habe ich versucht, einer App mehrere Funktionen hinzuzufügen, obwohl sie nichts miteinander zu tun haben. Ich sollte mich einfach auf eine Kernfunktion konzentrieren und es einfach eng halten. Okay, also lass uns einfach darauf klicken. Öffnet es die Seite? Ja. Fantastisch. Also los geht's. So habe ich die Anwendung zum Rechner für mehrere Währungen erstellt . 9. Erstellen eines Kryptowährungs-Dashboards mit APIs: Dies ist ein Beispiel dafür , wie wir eine API oder eine Anwendungsprogrammierschnittstelle verwenden können eine API oder eine Anwendungsprogrammierschnittstelle um eine Verbindung zu einer Datenbank mit Daten herzustellen, die in Ihrer App verwendet werden können. Also werde ich hier einfach meine Aufforderung teilen , damit Sie sehen können, was ich getan habe. In Ordnung. Also habe ich zunächst nur nach einem Kryptowährungs-Dashboard gefragt nach einem Kryptowährungs-Dashboard Ich habe das KI-Symbol verwendet , um es zu verbessern. Und anfangs habe ich eine Website namens Coin Market Cap verwendet, um ihre API zu erhalten. Meine Aufforderung lautete also, ein Kryptowährungs-Dashboard zu erstellen, und als ich es dann durch KI verbesserte, schuf ich all diese verschiedenen Funktionen, was erstaunlich ist. Und ich habe es erstellt, aber es gab einige Probleme. Und ich dachte, es liegt an der API. Was ich damit meine , ist, wenn wir zur eigentlichen Quelle der Daten gehen , also zur Marktkapitalisierung. Sie haben tatsächlich eine Dokumentation für ihre API. Also habe ich mich gerade für ein kostenloses Entwicklerkonto angemeldet, dem Sie Zugriff auf einen API-Schlüssel erhalten, der jedoch sehr begrenzt ist. Also was für ein Problem, ich versuche es zu bitten, den API-Schlüssel zu verwenden. Und ich habe es im Grunde aufgefordert, diesen API-Schlüssel zu verwenden, aber es gab Probleme, ihn zu verwenden. Es hat also eine andere Seite namens Coin Gecko verwendet Sie haben einen kostenlosen API-Schlüssel und dann wurde er hier sogar erklärt Es heißt, dass keine Authentifizierung erforderlich ist, und bietet bessere Ratenlimits für die kostenlose Nutzung. Und jetzt haben wir Echtzeitdaten aus unserem Kryptowährungs-Dashboard oben rechts. Ich werde also nur überprüfen , ob diese Daten aktuell sind , indem ich zur eigentlichen App gehe. Wenn ich also Coin Gecko eintippe, sehe ich, dass die Preise bei 100.000 liegen Arium liegt knapp unter 4.000. XRP 259. Ja, diese Daten sind also ziemlich aktuell. Das ist also ein einfaches Dashboard, und ich passe es gerne an, oder? Fügen Sie also die Möglichkeit hinzu, in eine Krypto zu klicken und die prozentuale Veränderung im Laufe der Zeit anzuzeigen . A zeigt den Top-Gewinner. Mal sehen, wie viele es hier gibt. Eins, zwei, drei, sechs, neun, zehn. Und eine Erklärung für den Anstieg. In Ordnung. Also ein weiteres Beispiel für die Wiederholung Ihrer App. Ich bin wirklich ziemlich beeindruckt von dem, was hier gezeigt wird. Und Sie können sich von der ursprünglichen Website inspirieren lassen und sich ansehen, und sich ansehen welche Art von Verbesserungen ich zeigen möchte? Weil das eine ziemlich gute App ist, so wie sie ist. Ordnung. Auf geht's. Okay, also zeige ich den Top-Gewinner, XRP und den Grund, warum er zulegt Und wir haben die Möglichkeit, auf „Auswählen“ zu klicken , wenn wir eine Kryptowährung auswählen Es wird dieses Dashboard unten angezeigt Es gibt uns einige detailliertere Informationen. Nun, das Diagramm funktioniert nicht, aber es ist okay. Ich bin mir sicher, dass wir das reparieren können. Das ist also eine gute Verbesserung. Also werde ich es bitten, die Diagramme zu verbessern und dann eine Option zum Einrichten von E-Mail-Benachrichtigungen Ordnung. Kehren wir zu unserer Aufforderung zurück. Gehen wir zurück zum Chat. Okay, hier ist unsere letzte Aufforderung. Lassen Sie mich einfach ein besseres Diagramm anzeigen. Zeigen Sie die Diagrammdaten unten an. Und eine anpassbare E-Mail-Benachrichtigung auf einer prozentualen Erhöhung oder einem Kursziel basiert. Oh, tut mir leid, das blockiere ich. Lass uns das rüberbringen. Also hier ist meine neue Aufforderung. Zeigen Sie das Diagrammdatum unten und eine anpassbare E-Mail-Benachrichtigung unten an. Oh, jetzt wird das Diagramm angezeigt. Okay. Ähm, im Laufe der Zeit, einschließlich bis zu einem Jahr und allen Zeiten. Und eine anpassbare E-Mail-Benachrichtigung. In Ordnung, lassen Sie uns sehen, was wir damit machen können. Und ich denke, wenn das funktioniert, wäre dies eine gute Gelegenheit , dies tatsächlich als Release-One-Version bereitzustellen , um sie mit der Welt zu teilen und Feedback zu erhalten Die wichtigsten Erkenntnisse aus der Erstellung dieser App sind also die Verwendung einer API zur Verbesserung der Funktionalität Ihrer App Und wir haben mit einer sehr einfachen Aufforderung begonnen , sie mit KI zu verbessern Und dann haben wir es wiederholt. Also los geht's. Wo ist die Option für die E-Mail-Benachrichtigungen genau hier, damit wir Bitcoin über ein Jahr sehen können? Vor einem Jahr waren es also 41.000. Lassen Sie uns das noch einmal überprüfen. Die Daten sollten also identisch sein, da sie denselben API-Schlüssel verwenden. Und ich sollte in der Lage sein, hier eine Benachrichtigung per E-Mail-Adresse einzustellen. Wenn der Zielpreis okay ist, stimmt hier etwas nicht. Siehst du, die Charts laufen immer noch, obwohl ich auf das Pop-up geklickt Okay, ich würde also die E-Mail-Benachrichtigungsfunktion reparieren und die Schaltfläche über den Diagrammen platzieren Nun, alles sieht gut aus. Es ist nur so, dass die E-Mail-Warnfunktion nicht funktioniert hat. Also musst du deine Operationen testen, testen, testen. Also etwas, das ich in den letzten Jahren gelernt habe , sind Benutzerakzeptanztests. Jedes Mal, wenn Sie eine Version erstellen, sollten Sie auf jeden Fall alle Kernfunktionen der Anwendung testen , um sicherzustellen, dass bei jeder Änderung nichts kaputt geht. Okay, sieht gut aus. Okay, siehst du, der Button ist an einer anderen Stelle platziert. Stellen Sie es auf Dogecoin ein. Wir werden eine E-Mail-Benachrichtigung einrichten, wenn der Wert von Dogecoin bei 0,60$ über der Option „Warnung erstellen“ liegt bei 0,60$ Okay, ich bin mir nicht sicher, was da passiert ist, vielleicht irrtümlich , aber ja, ich denke, du verstehst die Idee, und danach ist es nur eine ständige Wiederholung Ich denke, wir haben in diesem 15-minütigen Video tatsächlich viel erreicht, ein in diesem 15-minütigen Video tatsächlich viel erreicht, ziemlich gutes Kryptowährungs-Dashboard erstellt und einige E-Mail-Benachrichtigungen eingerichtet, in denen die Daten im Laufe der Zeit angezeigt werden Und ja, ich hoffe, du kannst dich davon inspirieren lassen. 10. Eine App erstellen, die Audio transkribieren kann: Hallo, in dieser Lektion, diesem Video, werde ich eine neue Art von App demonstrieren , die tatsächlich Texte aus einer Audiodatei transkribieren kann Texte aus einer Audiodatei transkribieren kann Diese Audiodatei, die ich verwenden werde, wurde also tatsächlich von Googles Notebook LM generiert , einem Audio-Podcast Also hier ist die App. Es wird als Audio-Video-Transkribierer bezeichnet. Wir konzentrieren uns gerade nur auf Audio. Und obwohl es das Feld für eine Video-URL gibt, die noch nicht verfügbar ist, möchte ich zu diesem Schritt übergehen. Aber ich habe es darum gebeten , diese Möglichkeit zum Hochladen von Videos oder Audio einzubauen diese Möglichkeit zum Hochladen von Videos oder Audio damit ich hier klicken und den WayFLE tatsächlich finden kann Also fangen wir hier bei Null und ich werde einen Wayfle Old Coin Summer finden einen Wayfle Old Coin Oh, ich glaube, das ist der hier. Also hier ist ein Wayfle. Sie können sehen, dass es verarbeitet wird. Also verwende ich eine andere Plattform-API. Es heißt Assembly AI. Ich zeige dir schnell die Seite hier. Also Montage ai.com. Ich verwende gerade den kostenlosen Tarif, die Sprache-zu-Text-Funktionalität bietet und es Ihnen ermöglicht, zwischen den Sprechern zu unterscheiden Also los geht's. So können wir zwischen Sprecher A und B unterscheiden, und wir können das Protokoll tatsächlich kopieren, sodass wir den generierten Text an anderer Stelle verwenden können Sagen wir einfach, lassen Sie uns einfach einen Notizblock aufrufen. Und wir fügen es einfach hier ein. Das ist also das Protokoll. Also gut, ich mache einfach Reverse Engineering. Ordnung, also werde ich einige der Highlights dieser App durchgehen und einige der vertraulichen Teile, nämlich die API-Schlüssel, verwischen nämlich die API-Schlüssel, nämlich Also habe ich mit einem ganz einfachen Abschlussball angefangen und eine App erstellt, die YouTube-URLs aufnehmen sie transkribieren und mit Untertiteln versehen kann. Und wie ich dir schon sagte, ich bin noch nicht da. Aber ja, hat mir gesagt, dass es als bewährte Methode keine gute Idee ist, API-Schlüssel in dieses Fenster einzufügen. Sie können das in der ENV-Datei tun, wenn Sie zum Code gehen und dann in den ENV-Bereich Hier können Sie den API-Schlüssel tatsächlich nur als Information einfügen den API-Schlüssel tatsächlich nur als Information Also habe ich hier die erste Benutzeroberfläche mit dem URL-Feld, der Schaltfläche, erstellt hier die erste Benutzeroberfläche mit dem URL-Feld, der Schaltfläche, Und ja, das war der Entwurf. Und dann habe ich eine Weile gebraucht, um einen API-Schlüssel zu finden, einen API-Schlüssel, der tatsächlich Video- oder Audiodateien verarbeiten konnte tatsächlich Video- oder Audiodateien verarbeiten Also bin ich ziemlich viel hin und her gegangen. Und tatsächlich war es erst so, als ich Assembly AI gefunden habe. Ich habe zunächst um ein Update gebeten, ich versuche, einige APIs von Google zu verwenden, und das ist ein fortlaufender Prozess. Aber nur als Version eins verwende ich Assembly AI, und deshalb bieten sie die kostenlose API um Audiodateien aufzunehmen und zu transkribieren, und sie ermöglicht es Ihnen, den Text zu kopieren und einzufügen Also habe ich dem Update im Grunde gesagt, die API von Assembly AI zu verwenden, und das hat es tatsächlich ziemlich reibungslos gemacht Was es aber nicht gab, war dieser Bereich zum Ziehen und Ablegen von Audiovideos. Also habe ich ihm gesagt, dass der Benutzer Audio- oder Videodateien hochladen kann. Also dann habe ich das ziemlich gut verstanden. Und von da an musste ich es noch einmal wiederholen. Und das war die Anwendung es Ihnen ermöglichen sollte, zwischen Sprecher A und Sprecher B zu unterscheiden und den Text zu kopieren Und sieh mal, hier ist die Aufforderung. Und ja, das bringt uns dahin , wo wir heute sind. Also, was sind einige Erkenntnisse hier? Also beide sind ziemlich mächtig. Ich meine, die Fähigkeit, ein Video oder Audio aufzunehmen und es zu transkribieren, aber auch die Benutzeroberfläche zu erstellen Bolt hat das ziemlich gut verstanden. Und ich bin ziemlich beeindruckt von der Drag-and-Drop-Audio-Video-Funktionalität Drag-and-Drop-Audio-Video-Funktionalität und der Möglichkeit, die API von einer anderen Plattform aus zu verwenden. Ich habe das ziemlich gut verstanden und die Fähigkeit , im Protokoll zwischen Sprecher A und B zu unterscheiden Das kommt von der API, aber ich musste Bolt ausdrücklich anweisen , es zu tun und uns zu erlauben, es zu kopieren Das ist also eine gut funktionierende Version dieser App. Hoffentlich kann ich in Zukunft die Transkription der Videofunktionalität zum Laufen bringen Transkription der Videofunktionalität zum Laufen und das mit Ihnen teilen Und ja, das ist also ein anderer Anwendungsfall für die Verwendung von Bolt Dot U zur Erstellung nützlicher Apps Hoffentlich gibt dir das ein paar Ideen. 11. So richtest du die E-Mail-Authentifizierung ein: Okay, in dieser Videolektion werde ich erläutern, wie wir die E-Mail-Authentifizierung mit Firebase erstellen können E-Mail-Authentifizierung mit Firebase erstellen Ich habe hier also eine bestehende Anwendung , die gerade geöffnet ist Es ist ein Multi-LLM-Chat-Bot oder Cloe und Chat GBT. Und du kannst es jetzt einfach offen benutzen, aber ich möchte ein E-Mail-Opt-In eingeben Ich möchte, dass sich die Leute anmelden, bevor sie es benutzen können. Wir werden also zu einem Programm namens Firebase gehen zu einem Programm namens Firebase Es gehört Google. Sie können sich also einfach hier anmelden. Ich werde ein neues Projekt erstellen. Ich nenne es einfach Chatbot. Ich werde auf Weiter klicken. Und ich benutze gerade die kostenlose Version. Ich werde Google Analytics einfach standardmäßig aktivieren. Sie müssen ein Google Analytics-Konto auswählen. Ich werde einfach eines meiner vorhandenen auswählen. Okay, das Projekt ist fertig. Lass uns auf Weiter klicken. Okay. Also das Erste, was wir tun wollen ist, zu Get Started zu gehen, und wir werden uns für eine Web-App entscheiden. Und lass uns diesen Chatbot nennen und ich registriere mich. Okay, wir haben hier einen Code, den wir verwenden können. Wir kopieren das, aber wir haben unsere Authentifizierung noch nicht eingerichtet. Ich meine, unsere E-Mail-Authentifizierung. Also klicken wir einfach auf Nick und fahren mit der Konsole fort. Ordnung. Nachdem wir unser Projekt erstellt haben, klicken wir auf Authentifizierung Ordnung. Klicken wir auf Erste Schritte. Wir werden E-Mail und Passwort auswählen. Lassen Sie uns es aktivieren und Anmeldung ohne E-Mail-Link-Passwort zulassen. Okay, so können Sie einfach auf einen Link in Ihrer E-Mail klicken , ohne ein Passwort zu verwenden. Es ist ein bisschen mehr Konfiguration, also werde ich es vorerst einfach deaktivieren. Klicken Sie auf Speichern. Okay, das ist jetzt aktiviert. In Ordnung. Also ja, wir haben die E-Mail-Authentifizierung aktiviert. Wenn wir also auf Benutzer klicken, sehen wir noch keine. Okay, um das zu implementieren, klicken wir auf Projektübersicht. Klicken wir auf Projekteinstellungen. Und lass uns einfach hier auf das Projekt klicken. In Ordnung, wir haben also diesen Web-API-Schlüssel. Ich bin also in den allgemeinen Projekteinstellungen. Ich werde diesen Code hier kopieren. Du gehst zurück zu Bolt. Richten Sie die E-Mail- und Passwortauthentifizierung mit Firebase und diesem Code In Ordnung. Ja. In Ordnung. Es gibt also ein potenzielles Problem. Ich bin mir nicht sicher, ob das ein Deal Breaker ist. Wir müssen das nur testen , um zu sehen, ob das works@gmail.com ist. In Ordnung, also lass uns anmelden. Und Sie können sehen, dass wir hier diese Abmeldeschaltfläche haben. Das ist also ein gutes Zeichen. Lassen Sie uns versuchen, uns abzumelden. Und jetzt versuchen wir, uns anzumelden. Ich gebe nur zum Testen ein falsches Passwort ein. Okay. Okay. Es heißt Firebase-Fehler Das ist wahrscheinlich ein gutes Zeichen , da das Passwort nicht mit dem in der Datenbank übereinstimmt Versuchen wir es jetzt mit dem richtigen Passwort. Okay, das funktioniert. Gehen wir also zu Firebase, um zu sehen, ob wir unseren Benutzer hier haben. Gehen wir also zur Projektübersicht. Gehen wir zur Authentifizierung und wir können Benutzer sehen. Da ist dieser neue Benutzer, den wir gerade erstellt haben. Okay. Von hier aus können wir das Konto also tatsächlich zurücksetzen, deaktivieren und löschen. Und ja, so implementieren wir Protokollierung der E-Mail-Authentifizierung in Ihrer App. Um es zusammenzufassen Sie sind zu Firebase gegangen Wir haben ein neues Projekt erstellt, und ich habe ein neues Projekt namens Chatbot erstellt und die Authentifizierungs-Anmeldemethode eingerichtet Ich habe E-Mail ausgewählt, aber Sie haben hier andere Optionen. Wir haben uns nur für E-Mail entschieden, um die Dinge einfach zu halten, und Sie haben hier mehr Konfigurationsoptionen , zum Beispiel die Überprüfung der E-Mail-Adresse, die wir nicht eingerichtet haben, aber Sie können Ihre Vorlage zum Zurücksetzen, die Änderung der E-Mail-Adresse usw. übergeben , die Sache wird etwas komplexer Und was wir getan haben, ist zu unserer Projektübersicht gegangen. Und wir haben den Code tatsächlich unter Allgemein gefunden, und wir verwenden diesen Code hier. Wir haben diesen Code kopiert. Wir sind zu Bolt gegangen und haben es gebeten , die E-Mail-Authentifizierung zu implementieren, und wir haben es in den Code eingefügt. Sie können es gleich hier sehen. Richten Sie E-Mail- und Passwortauthentifizierung mit Firebase und diesem Code ein, und ich füge ihn so ziemlich einfach ein Ich habe es getestet und es hat, wie wir sehen können, bei zwei Benutzern in dieser Datenbank funktioniert wie wir sehen können, bei zwei Benutzern in dieser Datenbank Also ja, so können Sie die E-Mail-Authentifizierung einrichten . Ziemlich cool. 12. So richtest du die Gmail-Authentifizierung ein: Wir werden versuchen, die Gmail-Authentifizierung für unsere App einzurichten . Bitte schauen Sie sich das vorherige Video zur Einrichtung des Projekts in Firebase an, falls Sie dies noch nicht getan haben Wir werden einfach weiterhin dasselbe Projekt verwenden , das wir in Firebase für den Chat-Bot erstellt haben , außer dass ich zu dem Projekt gehe Ich werde auf Anmeldemethode klicken. Wir werden einen neuen Anbieter hinzufügen und Google auswählen. Wir klicken auf AB Okay. Wir möchten eine E-Mail-Adresse auswählen , die den Benutzern angezeigt wird. Okay, ich gehe einfach zu Ich wähle einfach meine Gmail-Adresse aus. Okay. Ich klicke auf Alle speichern, also ist das aktiviert. Gehen wir jetzt zurück zum Projekt. Ordnung. Holen wir uns unseren Code. Gehen wir zurück zu Bolt. Bitte implementieren Sie die Google-Authentifizierung mit Firebase und diesem Code. Und ich füge einfach die Codes ein. Lass uns das versuchen. Okay. Also lass uns das testen. Also haben wir diese neue Schaltfläche hier, melden Sie sich bei Google an. Es heißt jedoch, dass diese Anforderungsaktion ungültig ist. Bitten wir ihn, das Problem zu beheben. Ich kann in den Fehlern sehen, dass es eine Art Popup-Block gibt. Vielleicht muss ich ja. Alle Cookies von Drittanbietern. Alles klar, versuchen wir es noch einmal. Firebase-Fehler. Lass mich Pop-Up-Blöcke aussingen. Vielleicht könnte ich nach der Bereitstellung einen anderen Browser ausprobieren. Aber lass uns einfach sehen , was Ball sagt. Lassen Sie uns weitermachen und das einsetzen. Schauen wir uns die Fehler an , dass es zuvor zwei Fehler gab. Es sieht so aus, als ob der Popup-Blockfehler jetzt weg ist. Lass uns einfach alles bereitstellen , lass uns diese App jetzt ausprobieren Okay, versuchen wir es mit der Google-Authentifizierung. Funktioniert nicht. Lass es uns im Brave-Browser versuchen. Nicht autorisierte Domain. Ich werde immer noch nicht autorisiert , okay. Sag mir, wie man es repariert. Ich muss diese Domain zu Firebase hinzufügen. Gehen Sie zu Firebase, wählen Sie das Projekt aus, wählen Sie Authentifizierungseinstellungen und autorisierte Domains aus. Lass uns das versuchen Okay. Klicken Sie auf Authentifizierungseinstellungen, Autorisierte Domains Ich möchte nur sichergehen, dass ich das aufnehme. Klicken Sie auf Domain hinzufügen und geben Sie uns ein. In Ordnung, gehen wir zurück zu Bolt. Möglicherweise möchten Sie auch einen lokalen Host hinzufügen. Es sind keine Codeänderungen erforderlich. Okay, gehen wir zu Lass uns einfach diese IP-Adresse hinzufügen. Sie können also während der Fehlerbehebung tatsächlich Fragen zu Bolt stellen. Los geht's. Versuchen wir es jetzt noch einmal. Lass uns einfach auffrischen. Fahren Sie mit Google fort. Walla. Versuchen wir, uns mit Firebase bei unserer App anzumelden. Und unglaublich Wir haben unserer App gerade die Google-Authentifizierung mithilfe von Firebase hinzugefügt unserer App gerade die Google-Authentifizierung mithilfe von Firebase Und Sie können hier sehen, dass wir diesen Google-Authentifizierungsanbieter anstelle der E-Mail haben diesen Google-Authentifizierungsanbieter anstelle der E-Mail Was wir also nur zur Zusammenfassung getan haben, ist, dass wir für die Signaturmethode einen neuen Anbieter hinzugefügt haben, nämlich Google Wir mussten zu den Einstellungen gehen und Domains autorisieren, und wir haben es bereitgestellt, und wir haben die bereitgestellte Domain hinzugefügt, um sie zu Ich habe auch eine zusätzliche IP-Adresse hinzugefügt. Wir haben beide gebeten, die Google-Authentifizierung zu implementieren. Ich werde nur diese Aufforderung finden. Okay, hier ist eine Aufforderung. Bitte implementieren Sie die Google-Authentifizierung mit Firebase und diesem Code. Also habe ich den Code aus dem das Projekt in Firebase Und dann musste ich anhand der Fehler, die wir bekommen haben, tatsächlich Fehler beheben, und Bolt hat mir tatsächlich geholfen Gehen wir hier zur letzten Eingabeaufforderung. Und ich habe es gesagt, ich erhalte immer noch Fehlermeldung, dass die Domain nicht autorisiert ist. Wie behebe ich das? Es gab mir tatsächlich eine sehr gute Antwort. Tatsächlich gab es mir die Antwort. Ich ging zu Firebase, ging zu den Projekteinstellungen, autorisierten Domains und es funktioniert Also los geht's. So fügen wir die Google-Authentifizierung hinzu. 13. Erstellen der Paypal-Dialogbox: In Ordnung, hier ist eine Beispiel-App mit einer Pay Pal-Paywall. Es beschreibt also die Funktionen , die Sie erhalten, wenn Sie bezahlen, und Sie können den Inhalt dahinter quasi sehen Und wenn wir auf PayPal klicken, sich das vertraute Dialogfeld , in das Sie Informationen eingeben müssen. Lassen Sie uns hier einfach einen Schritt zurücktreten und ich bringe Sie zurück zu Boldt New. Also habe ich es gebeten, eine Miniaturansicht mit Stockvideos in meinem Google Drive zu erstellen eine Miniaturansicht mit Stockvideos in meinem Google Drive Jedes Vorschaubild sollte ein repräsentativer Rahmen sein. Also wollte ich nur eine einfache App erstellen , mit der ich die PayPal-Paywall testen kann Um meine Idee tatsächlich umzusetzen, benötige ich Zugriff auf die Google Drive-API Also wurde gerade eine einfachere Version meiner ursprünglichen Frage erstellt. Am Ende habe ich es gebeten, PayPal zu verwenden. Also bringe ich Sie einfach zurück zu dieser Aufforderung. Ich habe es hier tatsächlich ein paar Mal versucht. Das ist also das PA PL-Entwickler-Dashboard. Sobald Sie sich also in Ihr Konto eingeloggt haben, sollten Sie in den Entwicklermodus wechseln Sie müssen lediglich Ihre Client-ID abrufen. Sobald Sie das eingerichtet haben, Sie die Möglichkeit eine Testzahlung mit gefälschten Anmeldeinformationen auszuprobieren. Und Sie können hier sehen, dass wir uns im Sandbox-Modus befinden. Dies ist der Live-Modus, aber ich möchte im Sandbox-Modus sein , und du wirst es hier sehen Nun, die Informationen, die Sie benötigen, sind hier unten. Sie benötigen Ihre API-Anmeldeinformationen und können eine App erstellen und sie dann einfach beliebig nennen. Und was passiert, nachdem Sie das getan haben, Sie erhalten eine Kunden-ID, die Sie in Bolt Dot N einfügen können , um die PayPal-Zahlungsschaltfläche aufzurufen , die zu Ihrem PayPal-Dashboard führt. Kurz gesagt, wie Sie eine Zahlungsschaltfläche mit PayPal implementieren könnten und wie Sie eine Zahlungsschaltfläche mit PayPal Ihre App im Wesentlichen monetarisieren könnten, indem Sie sie hinter eine Paywall stellen, um Zugriff auf einige Funktionen zu erhalten 14. Erstellen der Deep Search API App: In Ordnung, ich bin auf der Deep Seeks-Website. Dies ist der chinesische KI-Konkurrent von Open EI. Und ich schaue mir nur an, welche Fähigkeiten hier modellübergreifend verfügbar sind. Ich möchte nur, dass du weißt , dass es diese Seite auf deepsk.com gibt, also haben wir Deepsk V drei Und ehrlich gesagt weiß ich nicht, was all diese Statistiken bedeuten, aber sie zeigen, was die Gesamtparameter angeht, im Grunde Gesamtparameter angeht, im Volumen als bei Lama Sie listen keine HGBTs auf, versuchen wir, das zu verwenden. Sie können es tatsächlich auf Ihr Handy herunterladen, und ich habe es ausprobiert und es ist ziemlich gut Manchmal ist es ziemlich langsam. Und ich denke, es gibt gerade viel Verkehr. Also lass uns in den Chat gehen. Also habe ich schon gefragt, wie ich diese API in meiner App verwende? Okay, registriere dich für ein Konto, navigiere zum API-Bereich, generiere einen Schlüssel und es sieht so aus, als ob sie uns den Code gegeben haben. Lass es uns versuchen. Lass es uns versuchen. Lass uns auf die Seite gehen. Lass uns hier aufladen. 2$. Ich benutze einfach mein PayPal Ordnung. Zahlung erfolgreich Okay, ich habe also 2$ aufgestockt. Lassen Sie uns einen neuen API-Schlüssel erstellen. Lass uns ein Video nennen. Also werde ich diesen API-Schlüssel löschen, wenn du dir dieses Video ansiehst, nur aus Sicherheitsgründen. Und, ähm, lassen Sie uns hier mit einer neuen Aufforderung beginnen. Ich möchte dir zeigen, wie das funktioniert. Erstellt einen AI-Chat OG Deep Seeks API mithilfe von Well, mit diesem Code. Ich werde den API-Schlüssel später für Sicherheitspraktiken eingeben. Okay. Verwenden von Python-Code. Und ich werde den API-Schlüssel später eingeben . Okay, mal sehen, was wir daraus haben. Okay, es heißt also, erstelle eine ENV-Datei und füge hier deinen API-Schlüssel Okay, lassen Sie mich einfach meinen API-Schlüssel hinzufügen. Ich muss einen neuen erstellen, weil ich ihn vergessen habe . Nur für Leute. Okay. Gehen wir zum Kodex. Gehen wir zu IV. Nun, ich muss eine Kiste einpacken. Ordnung. Lass mich sichergehen, dass ich etwas geschaffen habe. Okay. Ja. Also hier würdest du es hinstellen. Okay, lass es uns testen. Nun, etwas funktioniert nicht. Was ist eine Bitcoin-Vorhersage? Okay, das sieht vielversprechend aus. Welches Model bist du? Nett. Was ist die beste Programmiersprache? Also werde ich mein Nutzungskonto überprüfen. Okay, Python-Webentwicklung. Solidität. Großartig Lassen Sie mich das auffrischen. Okay. Die Daten können sich um 5 Minuten verzögern. Okay, jetzt, wo es funktioniert, lassen Sie uns einfach eine weitere, visuell ansprechendere Seite rund um den Chat-Assistenten erstellen visuell ansprechendere Seite . Om hm. Also, was wir hier machen, ist, wir machen eine KI-Codierungs-App, aber wir nutzen die API von Deepsek, damit wir, ja, unsere eigene Software als Service erstellen können Okay, nenne es. Okay. Lass es uns einfach testen. Erklären Sie die Quantenphysik. Lass uns expandieren. Ich denke okay, sehr nett. Ich werde weitermachen und das veröffentlichen. Und ja, um es zusammenzufassen, um das zum Laufen zu bringen, ich musste ihm sagen, dass es nicht funktioniert, also hat es den Chat-Assistenten repariert Es wurden mehrere wichtige Korrekturen an der API-Integration vorgenommen. Und genau das hat dazu geführt, dass es funktioniert hat, weil ich ein paar Versuche gebraucht habe. Was das wirklich zeigt, ist, wenn Sie einen Fehler erhalten, geben Sie Bolt genau diesen Fehler und manchmal ist es klug genug, ihn zu beheben. Okay, also werde ich mir das einfach speichern. In Stockblts öffnen, ein Repository erstellen Das ist nur für später. Mama, hm. Das bedeutet also, wenn Sie das Repository erstellen, können Sie es später außerhalb von Bolt verwenden. Also habe ich gerade angefangen, Repositorys für wichtige Apps zu erstellen So könnte ich es später in Zukunft wiederverwenden. Okay, jetzt möchte ich das bereitstellen. Welches ist das beste digitale Nomadenland der Welt? Ordnung, Kolumbien. Interessant Mexiko. Okay, ich höre da auf. Hoffentlich fandest du dieses Video hilfreich. 15. So erstellst du eine LLM-Chat-App mit mehreren KI-Modellen: Hallo da. Ich habe hier einen Multi-Bot-Chat gebaut, der verschiedene KI-Modelle verwenden kann. Wir können sehen, dass wir eine lange Liste haben, und diese ist noch experimentell. Aber ja, ich denke, das hat viel Potenzial, und ich wollte das mit euch teilen weil ich finde, dass es wirklich umwerfend ist. Sie sehen all diese Modelle von Microsoft Anthropic, Medama Google, Google Gemini Fangen wir also einfach mit Google Gemini an und beginnen wir mit Hello. Was sind Ihre vollen Fähigkeiten? Okay, lass uns sehen. Textgenerierung Lernen und Anpassen. Sprachen übersetzen. Okay, also lass es uns fragen. Kannst du deine letzte Antwort ins Spanische übersetzen? Oh, okay. Ich dachte, es würde das wissen. D. Übersetzen Sie das ins Spanische. Dann stelle ich ihm hier eine mathematische Frage. Okay. Stellen wir ihm hier einfach eine einfache mathematische Frage. Wenn ich vom 21. bis 27. Dezember ein Auto miete . Meine täglichen Anrufe. Ist das ein guter Deal? Ordnung. Lass uns zu CHAT EBT wechseln. Version vier. Stell ihm dieselbe Frage. Wie lange hat es gedauert , Open Esa zu trainieren? Ordnung. Wie Sie sehen können, habe ich einen funktionierenden Chat-Bot mit mehrsprachigem Modell, und ich werde Ihnen nur einige der Eingabeaufforderungen zeigen , die ich verwende, um diesen zu erstellen Ja, ich habe ihn gebeten, einen skalierbaren Multi-Chatbot zu entwerfen einen skalierbaren Multi-Chatbot , der die führenden KI-Sprachmodelle verwendet, einige Beispiele gegeben und dann habe ich die erweiterte Eingabeaufforderung verwendet Und dann habe ich eine Plattform namens Open Router benutzt. Ich habe einen API-Schlüssel. Ich habe Credits im Wert von 5$ bezahlt. Ich ging zu Keys und es gab mir einen API-Schlüssel , den ich als API-Schlüssel in meiner Bolt-App verwendet habe Und ich verwende auch ein anderes KI-Programm namens Perplexity. Also habe ich es gebeten, eine offene äußere API zu implementieren. Und es gab mir den Code hier. Also habe ich diesen Code in meine Eingabeaufforderung kopiert. Und was ich gesagt habe, war die Grundkonfiguration, und ich habe den Code genau hier eingefügt Lassen Sie mich das einfach übergehen. Ja, also den hervorgehobenen Teil habe ich da hingestellt und dann die vollständige Implementierung. Ich habe den letzten Teil kopiert. Schritt vier, ich kopiere einfach da drüben rein und los geht's. Und dann habe ich meinen API-Schlüssel eingefügt. Ich habe ihm gesagt, es einzurichten, und jetzt habe ich einen Multi-Bot-Chat-Bot Der letzte Schritt ist also, ich möchte das nur bereitstellen und meinen Fortschritt für später speichern, weil ich damit für jemanden, der nicht codiert, ziemlich zufrieden bin . Okay, sobald ich es bereitgestellt habe, habe ich eine URL, und ich kann sie tatsächlich mit anderen Leuten teilen und sie von dort aus verbessern 16. Eine Ride-Sharing-App mit Stripe-Integration erstellen: Ordnung. Das ist eine interessante App hier. Dies ist eine ziemlich einfache Mitfahr-App , die die Google Maps API verwendet. Es hat auch eine Stripe-Integration. Sie können hier also die Adresse, den Startort und das Ziel eingeben . Es zeigt Ihnen die verfügbaren Fahrer sowie die Anzahl und die Dauer, und dann können Sie Ihre Fahrt bestätigen. Also werde ich das einfach vorführen, ich werde Gramble Islands hinzufügen. Und dann wähle ich die Flughäfen aus. Wir müssen es tatsächlich aktualisieren, also fangen wir bei Null an. Okay, es fängt in New York an, aber ich nehme Granville Islands Ich wähle ein fernes Ziel Stestono, 25$. Es zeigt uns verfügbare Treiber. Dies ist nur eine Basisversion. Es gibt viele Verbesserungen, die ich vornehmen kann. Aber ich habe gerade die bestätigte Fahrt so eingerichtet , dass sie an Stripe geht. Lassen Sie mich das für Stripe verwischen. Ich bin hier gerade im Testmodus und habe meinen veröffentlichbaren Schlüssel zum Testen verwendet Das ist zum Testen dieser bestätigten Fahrt. Es wird jetzt mit dieser Bezahlung und sie ist nicht aktiv, aber Sie können hier sehen, dass die Zahlung erfolgreich war. Ihre Fahrt ist bestätigt. Das ist also eine einfache Mitfahr-App. Ich zeige Ihnen hier nur einige wichtige Eingabeaufforderungen. Also habe ich eine komplette Ridesharing-App erstellt, die Uber ähnelt, und ich habe die erweiterte Eingabeaufforderung verwendet, und sie hat viele zusätzliche Funktionen hinzugefügt , die hier noch nicht Also Benutzerauthentifizierung, Standortverfolgung in Echtzeit, Fahrtbuchungs - und Matching-System, InApp-Zahlungsabwicklung. Aus technischen Gründen gibt es hier diese APIs, also verwende ich die Responsives Design. Ja. Also all das Zeug ist extra und Bolt kam zurück und sagte, es gibt hier einige Einschränkungen. Willst du uns und es wurden zwei Alternativen vorgeschlagen. Willst du nur das Frontend oder eine vereinfachte Version? Also habe ich darum gebeten, eine Basisversion zu erstellen, und es wurde auch gesagt, dass sie eine Google Maps-API benötigen. Und hier gehe ich einfach zu dem Teil, in dem ich den API-Schlüssel tatsächlich eingeben musste. Also bin ich zu Google Maps gegangen, und ja, was Sie tun müssen, ist, dass Sie die Schlüssel tatsächlich von Google Maps abrufen müssen. Und das ist ein bisschen ein Labyrinth, aber Sie gehen zu Schlüssel und Anmeldeinformationen und dann erhalten Sie Ihren API-Schlüssel, den ich nicht zeigen werde Aber hier bekommst du den API-Schlüssel. Das gab also die Mapping-Funktionalität hier drüben. Sonst würde es nicht funktionieren. Und von dort aus habe ich es gebeten, die Schaltfläche zum Bestätigen des Schreibens als Zahlungslink zu Stripe auszutauschen . Und dort habe ich den veröffentlichbaren API-Schlüssel von Also zeige ich dir hier einfach die Eingabeaufforderung. Also habe ich nur gesagt, klicken Sie auf die Schaltfläche „Schreiben bestätigen“ und dann auf „Stripe Pay“. Ich habe das tatsächlich falsch geschrieben. Aber später wurde ich nach dem eigentlichen API-Schlüssel gefragt , den ich später zur Verfügung gestellt habe Und hier kommen wir heute zur App. Es ist also eine einfache App, die jedoch die Verwendung von zwei APIs erfordert , der Google Map-API sowie dem veröffentlichbaren Stripe-API-Schlüssel im Testmodus Und wie gesagt, das ist nur eine sehr frühe Version Es ist ein Modell, an viele Verbesserungen vorgenommen werden können. Aber ich habe tatsächlich gelesen , dass Ridesharing-Apps auch die Google Map-API verwenden. Von dort habe ich also die Idee bekommen. Hoffentlich kann das etwas Kreativität anregen, einige Ideen von Ihnen zum Erstellen einer Mitfahr-App oder jeder Art von App, die einige mathematische Funktionen erfordert. Vielleicht bringt das einige Ideen von dir auf den Weg. 17. So erstellst du Pong mit KI-Programmierung: Ordnung, ich werde ein sehr einfaches Spiel wie Es ist also Zwei-D-Tennis. Aber ich habe eine kleine Wendung hinzugefügt. Sie können die Namen der Spieler hinzufügen und ein Profil auswählen. Fangen wir also einfach hier an. Greg, und ich füge einfach eine Profilauswahl hinzu. Und wir setzen Kasey Wählen Sie eine Auswahl, wählen Sie diese aus Und dann starten wir das Spiel und starten mit der Leertaste. Die Steuerung ist also unten. Also W und S stehen für Spieler eins. Hoch und runter ist für Casey, Spieler zwei. Also werde ich hier einfach gegen mich selbst spielen. Aber wie Sie sehen können, haben wir hier ein sehr einfaches Pong-Spiel und wir haben die Profilauswahl. Es bietet also ein bisschen Anpassungsmöglichkeiten und wir haben da einen Soundeffekt Und das Spiel wird auf etwa 11 steigen. Das ist also das Pong-Spiel. Also werde ich es einfach schließen. Ich sollte wahrscheinlich eine Funktion hinzufügen, um das Spiel zu beenden. Aber ich werde einfach hinter die Kulissen gehen und dir meine Anweisungen zeigen Ordnung, also habe ich mit der Aufforderung angefangen, ein Zwei-D-Tennisspiel wie Pong zu erstellen Und dann habe ich die erweiterte Eingabeaufforderung verwendet, um mir etwas Detaillierteres auszudenken Gehen wir also einfach zur Eingabeaufforderung und ich zeige Ihnen, was ich meine. Erstelle eine Zwei, erstelle ein Spiel, das Pong ähnelt. Und die KI ist intelligent genug, um ein Spiel wie Pong zu erkennen, und dann können Sie hier auf das Symbol klicken, um die Eingabeaufforderung zu verbessern. Sie können also sehen, dass es bei dieser einzeiligen Anfrage wirklich erweitert wird, und das ist genau das Zaubermittel Das war also meine erste Aufforderung. Also machte ich weiter und machte Daten, um mich auf die linke Seite zu konzentrieren. Und dann habe ich die erste Version gesehen, und dort habe ich meine zweite Aufforderung. Erlaube die Möglichkeit, einen und zwei Spielernamen und eine Profilauswahl hinzuzufügen. Dieses Dialogfeld, das Sie hier sehen, ist also das Ergebnis dieser zweiten Aufforderung, und es hat ziemlich gute Arbeit geleistet, genau das, was ich brauchte. Und ja, das ist es. Ich habe die Anwendung unter dieser URL bereitgestellt, und das ist ein einfaches Spiel, das wir haben. Ich meine, du kannst deiner Fantasie freien Lauf lassen, um es komplexer zu machen. Sie könnten ihn wahrscheinlich bitten, einige der Farben zu ändern. Vielleicht möchten Sie das Paddel länger machen oder die Möglichkeit geben, die Größe anzupassen Sie können also Ihre Kreativität einsetzen, um es interessanter zu gestalten. Dies ist jedoch nur ein grundlegendes Beispiel dafür , Dies ist jedoch nur ein grundlegendes Beispiel dafür wie Sie mit Bolt Nu ein Pong-Spiel, ein Zwei-D-Pong-Spiel, erstellen können ein Zwei-D-Pong-Spiel Vielleicht möchten Sie dies als Inspiration verwenden, um ein ähnliches oder sogar ein anderes Spiel zu erstellen ein ähnliches oder sogar ein anderes Spiel indem Sie einige der hier aufgeführten Ideen verwenden Hoffentlich hilft Ihnen diese Videolektion und inspiriert Sie dazu, einige Ihrer eigenen Spiele mithilfe von KI-Codierung zu erstellen Ihrer eigenen Spiele mithilfe von KI-Codierung 18. So erstellst du Space Invaders mit Grok 3: Okay, so habe ich das Space Invaders-Spiel mit Grock und Bolt gemacht Space Invaders-Spiel mit Grock Es ist nicht perfekt. Es gibt ein paar Bugs. Raus. Ich habe einen Musik-Slider. In Ordnung. Lass mich dir den Code von BoltoTU Okay, Space Invaders Spiel zeigen Okay, Space Invaders Das ist also ein HTML-Five-Spiel, und ich habe den Code von Grock bekommen Also habe ich darum gebeten, HTML-Code für ein Spiel vom Typ Space Invaders zu erstellen HTML-Code für ein Spiel vom Typ Space Invaders Und so gab ich mir diesen Code hier. Und dann habe ich dieses Spiel einfach zu Bolt gebracht. Mach hier einfach die Lautstärke an. Also habe ich gefragt, ob es ein Spiel vom Typ HML Space Invaders mit diesem Code erstellt hat, und ich habe den Code quasi eingefügt Und dann habe ich einige zusätzliche Eingabeaufforderungen eingegeben. Ich habe es gebeten, ein paar Sounds zu erzeugen. Also bin ich auf die Seite opengamear.org gegangen und habe dann Musik und habe dann Ich habe Geräusche zum Schießen gefunden. Und wenn du triffst, wenn du ein Alien triffst. Also habe ich diesen Prompt Stuhl aufgestellt. Benutze den Sound der Musik. Benutze den Ton zum Schießen. Und dann habe ich darum gebeten, einen Musik-Slider anzubringen. Stellen Sie die Lautstärke der Musik ein und verwenden Sie dann den Ton, der die Aliens trifft Und dann habe ich die Anwendung bereitgestellt. Lass es uns größer machen. Da haben wir's. Jetzt funktioniert es. Es ist ein bisschen fehlerhaft. Da hast du's. Du hast die Idee. Ich denke, hier gibt es ein gewisses Potenzial. So verwenden wir Grock in Verbindung mit Bolton U, um ein HTML-Five-in-Spiel Space Invaders zu erstellen 19. Benutzerfreundliche URL: Okay, jetzt, wo Sie Ihre App bereitgestellt haben, möchte ich Ihnen einige Hinweise zur Bereitstellung mit einer benutzerfreundlichen URL geben. In diesem Beispiel habe ich also einen Klon einer AirBME-App bereitgestellt und verwende Go Daddy als Domain-Manager Also werde ich Ihnen zeigen, wie ich es mithilfe meiner eigenen Subdomain auf die URL verweise , die Ihnen NetLFI gibt Gehen wir also zu NetFIG zur AirBnB-Seite . also im Index Wenn Sie also im Index zum Code gehen, steht er in Zeile sieben Sie möchten diesen Titel in das ändern , was Sie anzeigen wollten. Andernfalls wird VIT plus React angezeigt, oder? Das willst du wahrscheinlich nicht, also willst du den Code ändern. Sobald Sie auf den Trick gestoßen sind, werden Sie auf die Net Loofy-Seite gehen wollen. Und von dort aus können Sie zu Ihren Websites gehen. Also gehe ich zum BNB-Restaurant. Klicken Sie einfach dort. Sie konzentrieren sich also auf Schritt zwei. Sie benötigen also eine bestehende Domain. Wenn Sie dies nicht tun, können Sie es einfach direkt von hier aus kaufen. Aber ich habe eine bestehende, also gehen wir zur Konfiguration der Site über. Hier können Sie den Namen der Site also nach Belieben ändern . Das ist also der einfachste Weg, dies zu tun. Du bekommst so etwas wie zum Beispiel B & B Six Oh Four Dot Netloofy Dot App, und es wird sofort eine Tatsache berücksichtigt Sie werden also sofort eine bessere URL haben als die, die sie Ihnen ursprünglich gegeben Okay, sobald Sie diese URL als Spukmarke haben, speichern Sie sie irgendwo Ich gehe zu Go Daddy, Domainverwaltung. Also das ist die Domain, die ich verwenden werde. Ich habe eine Weiterleitungs-Subdomain erstellt. Sie können also Fording hinzufügen und ich könnte ein beliebiges B & B eingeben. Und hier würde ich die Net-Lafe-URL einfügen Wenn wir also zur Seite zurückkehren, würde ich diesen Namen hier einfügen Genau da drin. Und dann würden wir auf Speichern klicken. Das würde dann im Endeffekt bedeuten, dass Airbnb und Creative Academy.com dann zu dieser App weiterleiten würden Ihr könnt also sehen, dass ich es mit B & B gemacht habe. Und wenn ich dann BNB creative academy.com eintippe creative Okay. Sollte uns dann direkt zu unserer Seite führen. Oh, da haben wir's. Also BnB auf Creative Academy.com und leitet dann automatisch zum B & B Six Oh Fourntloofe Punkt leitet dann automatisch zum B & B Six Oh Fourntloofe Das ist also Ihr erster Schritt zur Verwendung Ihrer eigenen Domain, die automatisch zu einem Neto Und ich denke, das ist der beste Weg, um Ihre App bereitzustellen und zu teilen 20. Domain-Namen an netlify weiterleiten: Aber ja, lass mich dich zu Net Lafe mitnehmen. Nachdem wir es bereitgestellt haben, geht es standardmäßig an diesen Anbieter , wie Sie sehen können, und das sind meine verschiedenen Websites Also klicke ich hier rein. Am einfachsten ist es, auf Site-Konfiguration zu klicken. Sie können den Namen der Site ändern. Also habe ich es in Trump und Melanin geändert. Also ich möchte das nicht ändern, weil Sie sehen werden, dass ich einen Domainnamen von Go Daddy gekauft habe , der auf diese Seite verweist In Ordnung, also werde ich dir die Domain zeigen, die ich bekommen habe. Also Trump und Milania coin.com. Das ist eigentlich die richtige Schreibweise. Also habe ich diese Domain von Go Daddy gekauft und verwende einfach den Ford-Domainlink und leite sie zu einer beliebigen Seite unten weiter. Dort habe ich die Netfy-URL eingefügt . 21. Die Trumpcoin-Landing-Page: Hallo und willkommen zu einem Tutorial, das Ihnen zeigt, wie ich diese Liningpage Trump, eine Jahrtausendmünze, erstellt habe diese Liningpage Trump, eine Jahrtausendmünze, erstellt , auf der sich oben eine E-Mail-Marketing-Plattform namens Und wir haben hier ein Bild, das ich mit KI erstellt habe Und wir haben einen Kauf-Button, der, sagen wir , auf eine Krypto-Börse verweist. Wir haben Live-Preise für den Token, auch die prozentuale Veränderung, die Marktkapitalisierung. Und wir haben auch Preise für die Münze von Trumps Frau, die Milania-Münze Also ja, ich werde Sie hinter die Kulissen mitnehmen , wie das entstanden Also fangen wir einfach mit der Spitze an. Ich verwende Software von ConvertKit, jetzt auch bekannt als Kit Sie haben also die Möglichkeit , ein Anmeldeformular zu erstellen. Und wenn Sie linierte Seiten vergrößern möchten, können Sie eine linierte Seite erstellen. Sie können verschiedene Stile wählen. Das ist also nur einer , der ganz oben steht. Es ist nicht zu aufdringlich. Aber ich kann hier Berichte bekommen. Ich habe das erst gestern Abend eingerichtet, es ist so neu. Und ja, das wird mir ermöglichen, E-Mail-Adressen von Leuten zu erfassen E-Mail-Adressen von Leuten zu das hier drüben eingeben. Also würde ich mich zum Beispiel hier anmelden. Ich würde eine E-Mail zur Bestätigung in meinem Posteingang erhalten. Okay, und dann führt dieser Kauf-Button tatsächlich zu der Website hier, auf der Sie die Krypto kaufen können. Und jetzt, diese Preisgestaltung, das kommt tatsächlich über eine API von Coin Gecko Sie bieten also eine kostenlose API an , mit der Sie Preise abrufen können . Wenn Sie also hier 50,56$ sehen, sollten die Preise hier ziemlich ähnlich sein Ordnung? Also, von dort kommen die Preisinformationen, all die Zahlen. Und jetzt möchte ich Sie kurz hinter die eigentliche KI-Codierung führen. Also habe ich mit dieser Aufforderung angefangen, eine Lining-Seite erstellt und sie ist falsch geschrieben, ich weiß Zeigen Sie den Preis von Tromcin unter Verwendung dieser URL mit Also habe ich tatsächlich diese URL genommen und sie dann an beide weitergegeben. Ich habe es verstanden, trotz des Rechtschreibfehlers. Also hat es die Lining-Seite erstellt. Ordnung, die nächste Aufforderung war also das Formular hier zu integrieren Also habe ich es mit JavaScript versucht. Das ist also von meiner E-Mail-Marketing-Plattform. Also geben sie dir diesen Code hier, um ihn zu kopieren und auf eine Website zu stellen. Aber für Bolt habe ich gerade gesagt, integriere dieses Anmeldeformular, und dann habe ich den Code eingefügt Es hieß, es lief tatsächlich. Ich habe es implementiert, aber ich habe anfangs nicht funktioniert. Also habe ich versucht, den HTML-Code zu verwenden , dann habe ich ihm im Grunde dieselbe Aufforderung gegeben und ihn dann in den HTML-Code eingefügt Es zeigt dir also nur, dass du manchmal einfach hartnäckig sein und ein paar verschiedene Optionen ausprobieren musst hartnäckig sein und ein paar verschiedene Optionen ausprobieren Irgendwann hat das Formular funktioniert und es ist ganz oben. Und dann habe ich ihm ein Bild gegeben. Also habe ich dieses Bild mit Wix erstellt. Wix hat einen KI-Bildersteller. So konnte ich tatsächlich einen Blogbeitrag erstellen. Ordnung, das ist also meine Blogseite, und ich habe tatsächlich die Adresse des direkten Links zum Kopieren des Bildes denn wenn Sie einfach ein Bild hochladen, scheint es beiden nicht zu gefallen, also habe ich das Header-Bild hinzugefügt. Also habe ich ihr die Aufforderung gegeben, dieses Bild zur Kopfzeile hinzuzufügen und die URL, die Bildadresse, eingefügt Okay, das fing an, unserem Projekt eine gewisse Form zu geben. Ich musste ein bisschen hin und her gehen, und irgendwann bin ich zu einem anderen Projekt übergegangen Und das kannst du hier auf der geforkten Landingpage des Projekts Trump Coin Price Tracker In Ordnung, also was ich getan habe, ist es einfach bereitzustellen. Ich habe es auf der Netfi UL bereitgestellt. Und selbst wenn Sie es einmal bereitgestellt haben, können Sie immer noch Änderungen vornehmen Aber manchmal müssen Sie es bereitstellen, um es tatsächlich zu testen. Also wollte ich Dinge tun wie ein Video hinzufügen. Ich wollte das E-Mail-Opt-In testen. Was übrigens noch in Arbeit ist. Und dann wollte ich noch eine zweite Münze hinzufügen , die Milania-Münze Und ich bin mir nicht sicher, ob die Aufforderung hier angezeigt wird. Aber ich habe ihm dieselbe URL von der Website gegeben. Also sagte ich, zeige Live-Preise für Milania-Münzen an, und dann habe ich ihr die URL gegeben Also das wird hier nicht angezeigt. So haben wir die Preise hier bekommen. Dieses Video-Tutorial ist in Arbeit, aber da ich diese Fork-Version noch nicht bereitgestellt habe, wird sie in der veröffentlichten App nicht angezeigt Die veröffentlichte App befindet sich also auf Netflix. Dies ist die zugrunde liegende Site Trump und ManicinnTLAF Dot die zugrunde liegende Site Trump und ManicinnTLAF Stellen Sie tatsächlich fest, dass die Domain-URL falsch geschrieben ist . Aber ja, also lass mich dich zu Net Lafe mitnehmen. Nachdem wir es bereitgestellt haben, geht es standardmäßig an diesen Anbieter , wie Sie sehen können, und das sind meine verschiedenen Websites Also klicke ich hier rein. Am einfachsten ist es, auf Site-Konfiguration zu klicken. Sie können den Namen der Site ändern. Also habe ich es in Trump und Melancin geändert. Ich möchte das also nicht ändern, weil Sie sehen werden, dass ich einen Domainnamen von Go Daddy gekauft habe, auf diese Seite verweist In Ordnung, also werde ich dir die Domain zeigen, die ich bekommen habe. Also Trump und Milania coin.com. Das ist eigentlich die richtige Schreibweise. Also habe ich diese Domain von Go Daddy gekauft und verwende einfach den Ford-Domainlink. Und vorwärts zu einer beliebigen Seite unten. Dort habe ich die Net Liffe-URL eingefügt . Also ja, das ist kurz gesagt der gesamte Workflow für diese Site hier Also haben wir ein E-Mail-Opt-In implementiert. Wir haben ein benutzerdefiniertes Bild hinzugefügt. Wir haben eine Schaltfläche zum Aufrufen von Aktionen. Das war also eigentlich eine Aufforderung. Ich bin nicht rübergegangen. Also habe ich im Grunde gesagt, füge einen Kauf-Button mit dieser URL hinzu und gib ihm diesen Wortlaut, kaufe bei crypto.com Deshalb habe ich es für den Button getan. Und die Preisgestaltung habe ich von der Coin Gecko-Seite anhand der URL für dieses spezielle Asset bekommen, die ich Ihnen für Straßenbahn-Münzen und Millennium-Münzen gezeigt habe Und dann zeige ich Ihnen, wie wir es mit einer richtigen URL, die von Netlify weitergeleitet wird, der Standardplattform, die auch BalotN veröffentlicht , besser präsentieren können mit einer richtigen URL, die von Netlify weitergeleitet wird, der Standardplattform, die auch BalotN veröffentlicht , besser Das sollte also einen voll funktionsfähigen Arbeitsablauf abdecken. Dies ist eine Seite zur Ausrichtung , auf der Preisinformationen und Kaufinformationen bereitgestellt und auch einige E-Mail-Adressen erfasst werden sollen . und auch einige E-Mail-Adressen erfasst 22. Fasse die gelernten Lektionen zusammen: Ordnung, ich habe Ihnen einige Beispiele gezeigt , wie wir verschiedene Apps entwickelt haben Wir haben eine App entwickelt, die die reichsten Personen zeigt. Wir haben eine Golf-Scoring-App entwickelt. Sie können also sehen, wie wichtig es ist, sicherzustellen, dass Ihre Aufforderung oder Ihre Eingabe so spezifisch wie möglich ist, oder Sie können einfach loslegen und sie bitten, eine einfache App zu erstellen. Und wiederholen Sie das, was im Grunde bedeutet , dass Sie Ihre App verbessern müssen, sobald Sie sie tatsächlich sehen Ich habe dir gezeigt, wie wir ein PDF mit einer Art Referenz anhängen können , um loszulegen Wenn Sie eine bestehende Anwendung kopieren oder ihr etwas zeigen möchten. Ich habe Ihnen auch gezeigt, wie Sie das KI-Symbol verwenden können , um Ihre Eingabeaufforderung zu verbessern, was sehr mächtig ist. Sie können sehen, wie meine einfachen Eingabeaufforderungen dadurch viel detaillierter wurden meine einfachen Eingabeaufforderungen dadurch viel detaillierter Und ich habe auch gezeigt, wie Sie Ihre App mithilfe von APIs mit vorhandenen Datenbanken verbinden können Ihre App mithilfe von APIs mit vorhandenen Datenbanken verbinden Ich habe Ihnen auch gezeigt, wie Sie es in der Aufforderung wiederholen können, indem Sie einfach sehen wiederholen können, indem Sie einfach sehen, was damit erstellt wird, und dann mögliche Verbesserungen sehen und dann einfach in einfachem Englisch die App bitten, zusätzliche Funktionen hinzuzufügen Ich habe Ihnen auch gezeigt, wie Sie Ihre Aufforderung rückgängig machen können, wenn Sie es irgendwie schaffen, etwas kaputt zu machen und Sie zur vorherigen Version zurückkehren möchten zur vorherigen Version Abschließend habe ich Ihnen gezeigt, ob Sie mit Ihrer App zufrieden sind und eine Version erstellen möchten, wie Sie sie bereitstellen können, indem Sie auf die Schaltfläche Bereitstellen klicken. Dadurch wird ein öffentlicher Link erstellt, den Sie mit Freunden oder Kollegen teilen können, um Feedback zu erhalten 23. KI Programmierung Zusammenfassung hd: Damit ist unser Crashkurs zum Thema KI-Codierung für Anfänger abgeschlossen. Das ist erst der Anfang, und ich setze auch meine Reise fort. Wir haben gelernt, wie wir Bol Dog New verwenden können , um unsere Aufforderungen, unsere Ideen und unsere Kreativität zu nutzen , um verschiedene Arten von Anwendungen zu erstellen Und ich empfehle dir, einfach zu spielen und deine Apps mit deinen Freunden zu teilen, Feedback einzuholen und zu sehen, welche Art von Anwendungen du erstellen kannst Als ich mir das ansah, war ich erstaunt, dass ich eine Golfwerter-App und eine App erstellen konnte eine Golfwerter-App und eine App erstellen , die ein Dashboard mit verschiedenen Fremdwährungen erstellt und so anpassbar macht. Jeder, der das verwendet, könnte also Dashboard an die zehn lebenswertesten Städte anpassen, sein Dashboard an die zehn lebenswertesten Städte anpassen, zum Beispiel, indem er es für verschiedene Städte oder für verschiedene Städte oder für eine Golfwertungs-App für verschiedene Spieler Und ich denke, die Grenze liegt wirklich in Ihrer Kreativität. Diese App ist jedoch nur ein Ausgangspunkt. Wenn Sie komplexe Apps erstellen möchten, können Sie sich verschiedene Plattformen wie Cursor ansehen. Und denken Sie daran, das ist erst der Anfang Ich gehe davon aus, dass es mehr Verbesserungen, verschiedene Plattformen und mehr Wettbewerb geben wird . Die Kernkompetenzen werden jedoch darin bestehen, dass Sie Ihre Kreativität unter Beweis stellen können, indem Sie verschiedene Anwendungen verwenden, um Kreativität unter Beweis stellen können, indem Sie verschiedene Anwendungen verwenden, mit bestehenden Ideen zu beginnen und Verbindungen zu verschiedenen Datenbanken oder APIs herstellen zu können verschiedenen Datenbanken oder APIs herstellen zu Ich hoffe, Ihnen hat dieser Kurs gefallen und Sie werden sich einige meiner anderen Angebote ansehen meiner anderen Angebote Vielen Dank, dass Sie den Kurs besucht haben. Ich hoffe, du hast viel gelernt.