Laravel-API: KI-Dokumentenanalysator mit Laravel+Gemini-API | Shaa Web | Skillshare

Playback-Geschwindigkeit


1.0x


  • 0.5x
  • 0.75x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Laravel-API: KI-Dokumentenanalysator mit Laravel+Gemini-API

teacher avatar Shaa Web, Passionate Educator | Online Instructor

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

    • 1.

      Willkommen

      1:38

    • 2.

      Klassenprojektdemo

      2:57

    • 3.

      4 Installieren von Laravel

      8:09

    • 4.

      API-Route installieren

      4:12

    • 5.

      Gemini API-Schlüssel abrufen

      3:48

    • 6.

      Laravel 12 Abhängigkeitsmodule und Routeneinrichtung

      4:22

    • 7.

      Dokumentenanalyse-API

      24:30

    • 8.

      API-Tests POSTMAN

      2:41

    • 9.

      React-Einrichtung

      4:22

    • 10.

      Abhängigkeiten von React

      4:54

    • 11.

      12 React API-Aufruf

      11:27

    • 12.

      13 React Stil auf Ergebnis anwenden

      6:58

    • 13.

      14 Schaltflächenstatus ändern

      1:31

    • 14.

      15 Vielen Dank

      1:52

  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Jedes Niveau

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

11

Teilnehmer:innen

--

Projekte

Über diesen Kurs

In diesem Kurs entwickeln wir einen intelligenten KI-Dokumentenanalysator, der hochgeladene Dokumente (PDF, DOCX, TXT) lesen und mithilfe künstlicher Intelligenz automatisch eine aussagekräftige, strukturierte Zusammenfassung erstellen kann.

Dieser Kurs eignet sich perfekt für PHP-Entwickler, Laravel-Lernende und alle, die KI in reale Anwendungen integrieren möchten.

⭐ Was Sie lernen werden

Am Ende dieses Kurses werden Sie in der Lage sein:

  • Installieren und Konfigurieren eines Laravel-Projekts von Grund auf neu

  • Abrufen und Konfigurieren des Google Gemini-API-Schlüssels

  • Erstellen eines API-Endpunkts zum Analysieren hochgeladener Dokumente

  • Extrahieren von Text aus PDF-, Word- (DOC/DOCX) und TXT-Dateien

  • Extrahierte Inhalte zur KI-gestützten Zusammenfassung an Gemini senden

  • Erstellen einer benutzerfreundlichen Front-End-Oberfläche zum Testen Ihres Modells

  • Strukturierte und formatierte KI-Antworten an Benutzer zurückgeben

? Tools und Technologien

  • Laravel 12

  • Google Gemini KI-API

  • PHPWord

  • PDF-Parserbibliotheken

  • React (optionale Benutzeroberflächendemonstration)

  • Axios/API abrufen

Triff deine:n Kursleiter:in

Teacher Profile Image

Shaa Web

Passionate Educator | Online Instructor

Kursleiter:in

Software developer with 14 years of experience in web development. Over the years, I've worked with a diverse range of technologies, including HTML, PHP, JavaScript, MySQL, Node.js, React, Angular, and E-Commerce development. My passion lies in building efficient, scalable, and user-friendly applications while continuously exploring new advancements in the tech world.

As an instructor, I focus on simplifying complex concepts and making learning an engaging experience. Whether you're a beginner or an experienced developer looking to sharpen your skills, my courses are designed to provide practical, real-world knowledge that you can apply right away.

Let's build, innovate, and grow together!

Vollständiges Profil ansehen

Level: Beginner

Kursbewertung

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen auf Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Willkommen: Jeder. Willkommen zu diesem Kurs. AI Document Analyzer, der die API und das Google Gemini-Modell Ich, ich werde während des gesamten Kurses dein Lehrer sein. In diesem Kurs werden wir ein Projekt aus der realen Welt erstellen, in dem Sie lernen , wie Sie mithilfe des Gemini-Modells von Google PDF - und Word-Dokumente hochladen generieren , aussagekräftigen Text extrahieren und KI-gestützte Zusammenfassungen Dieser Kurs richtet sich sowohl an Anfänger als auch an erfahrene Entwickler , die sich mit der praktischen KI-Integration in moderne Webanwendungen befassen möchten praktischen KI-Integration in moderne Webanwendungen befassen In diesem Kurs lernen Sie, wie Sie Al mit der Semini-API verbinden , Datei-Uploads und zusätzliche Dokumenteninhalte handhaben , dynamische Antworten generieren und eine übersichtlichere Benutzeroberfläche für die Reserven erstellen können Sie werden auch bewährte Methoden wie Validierung, Fehlerbehandlung und Verbesserung der Antwortinformation für Leser kennenlernen Fehlerbehandlung und Verbesserung der Antwortinformation für Leser Am Ende dieses Kurses verfügen Sie über ein voll funktionsfähiges AI Power-Dokument, verfügen Sie über ein voll funktionsfähiges AI Power-Dokument Sie um erweiterte Funktionen wie die Analyse von Lebensläufen, die Zusammenfassung von Rechtstexten, die Erstellung von Berichten oder sogar die Chatbot-Automatisierung erweitern können erweiterte Funktionen wie die Analyse von Lebensläufen, die Zusammenfassung von Rechtstexten, die Erstellung von Berichten oder sogar die Chatbot-Automatisierung Dies ist eine praktische Lernerfahrung, und ich freue mich darauf , Sie durch die einzelnen Schritte zu führen , während Sie einen kompletten Koffer oder die KI-Anwendung von Grund auf neu erstellen einen kompletten Koffer oder die KI-Anwendung von Lass uns anfangen. 2. Klassenprojektdemo: Ich erlaube dir einen. Willkommen zu dieser Vorlesung. Und hier ist die letzte Demo der AI Document Analyzer-Anwendung. Für AI Document Analyzer werden wir La UL Towel als Backend, React Plus White als Print-In und Google Gemini für API Park verwenden React Plus White als Print-In und Google Gemini für API Mit diesem AI Dcment Analyzer können wir Dokumente vom Typ PDF, Dokument vom Typ DOCX sowie Textdateidokumente analysieren vom Typ DOCX sowie Textdateidokumente sowie Also hier ist unser AI Analyzer-Formular. Hier haben wir Eingaben zur Auswahl der Datei. Dann wählen wir eine Datei aus, und das ist der Dateityp PDF. Und wenn ich auf Dokument analysieren klicke, verwandelt sich die Schaltfläche in Analysieren und der API-Aufruf erfolgt im Hintergrund. Innerhalb weniger Sekunden erhalten Sie eine KI-Zusammenfassung. Hier ist die KI-Zusammenfassung für das jeweilige Dokument Diese KI-Zusammenfassung wird vier Hauptthemen wie eine kurze Zusammenfassung, drei wichtigsten Erkenntnisse , den Schreibstil sowie die vorgeschlagenen Verbesserungen oder nächsten Schritte enthalten. Okay, lassen Sie mich es Ihnen zeigen, indem ich das DOCX-Dokument auswähle. Klicken Sie auf Dokument analysieren. Wenn Sie also auf die Schaltfläche klicken, wird die Al-API von Lavell aus aufgerufen. Wir rufen die Google Gemini-API und geben die Antwort an den React-Pendent zurück die Antwort an den React-Pendent zurück Hier ist also unsere KI-Zusammenfassung für einen bestimmten DivoCX-Dokumenttyp Okay. Und lassen Sie uns sehen, indem Textformatdatei auswählen und auf Analysieren klicken. Und Sie werden den gleichen Ausgabestil von der KI erhalten. Also hier ist die Zusammenfassung der KI. Okay. In Ordnung. Ab der nächsten Vorlesung werden wir also den voll funktionsfähigen KI-Dokumentenanalysator implementieren den voll funktionsfähigen KI-Dokumentenanalysator , indem wir Latel für das Backend, React plus T für das Frontend verwenden und uns mit Google Gemini AI verbinden , um eine KI-Zusammenfassung zu erhalten Danke. Wir sehen uns bei der nächsten Vorlesung. 3. 4 Installieren von Laravel: Stufe eins, willkommen zu dieser Vorlesung. In dieser Vorlesung werden wir Owl also in einer lokalen Umgebung installieren . Lass uns anfangen Rufen Sie Ihren Browser auf und geben Sie in der Google-Suche Lavel ein. Okay, gehe auf die offizielle Website larawl.com und Klicken Sie also in der Seitenleiste auf Installation und scrollen Sie ein wenig nach unten Dort finden Sie die Installation im Abschnitt. Um Lau auf Ihren lokalen Computern zu installieren, müssen PHP und Compose installiert sein. Wir haben es bereits in der vorherigen Klasse Write installiert, Wir haben es bereits in der vorherigen Klasse Write installiert um eine Anwendung zu erstellen, wir müssen diesen Befehl ausführen Law new ist unser Projektname, diesen Befehl kopieren und agam, das wir in der vorherigen Klasse LagAg installiert haben, auf das Terminal öffnen der vorherigen Klasse LagAg installiert haben, auf das Okay. Okay. Gehe zum Terminal. Moment sind wir also in WW D. Also füge einfach diesen Befehl ein und statt der Beispiel-App sage ich es ai API. Also, welches Startergate würdest du gerne einbauen? Also wird es dir Fragen stellen. Wählen Sie dann ab sofort aus und welches Test-Framework bevorzugen Sie? Lass es am besten sein Okay. Das Projektprojekt ist im Gange. Okay. In Ordnung. Also fügt es den Abhängigkeitsmodus Okay. Welche Datenbank Ihre Anwendung verwenden wird, wählen Sie als MSPL-Standarddatenbank-Update Möchten Sie vorerst den Standard-Migrationssatz Nein ausführen , werden wir ihn später migrieren Ein Okay. Also fast fertig. Die Isolierung dauert bis zu zwei bis 3 Minuten, nicht länger. Laden von Composer-Repositorys mit Paketinformationen, Einfügen von Abhängigkeiten aus Log Five, Generieren optimierter Ato-Loading-Dateien Okay. Möchten Sie NPM install ausführen Wählen Sie. Geben Sie einfach Ps ein und drücken Sie die Eingabetaste. Es wird also das gesamte Abhängigkeitsmodul installieren. Keine Module. Okay, also richtig, unser Projekt wurde erfolgreich erstellt. Jetzt müssen wir uns in unser Projektverzeichnis bewegen, dem es sich um AI API handelt Geben Sie einfach CD space AI API in Ihr Terminal ein und geben Sie ein. Im Moment befinden wir uns in unserem Projektverzeichnis. Lassen Sie mich das jetzt mit meinem VS-Code öffnen, indem ich einfach den Codespace-Punkt eintippe. Okay, es wird also das Projekt in unserem Visual Studio öffnen und sie codieren. Okay, lassen Sie mich die Ordnerstruktur durchgehen und hier haben wir einen Ordner. Ein Ordner. Er enthält die gesamte Anwendungslogik , einschließlich Controller und Module. Der Controller befindet sich also normalerweise im HDB-Ordner und Modelle im Modellordner. Und hier haben wir den Route-Ordner. Also werden wir im Route-Ordner eine neue Routendatei erstellen , die API BHB heißt Ich werde es dir in der nächsten Vorlesung zeigen. Und dann haben wir die Punkt-ENV-Datei, die für die gesamte Konfigurationsdatei verantwortlich ist Und die Artisan-Datei. Also diese Dateien wird Lara online gehen , um Ihre Anwendungen auszuführen und zu verwalten Das ist die schnelle Lösung für Sie, und machen Sie sich keine Sorgen, wir werden sowohl DEPA als auch unser effektiver Jahreszins sein. Okay? Also müssen wir jetzt eine Datenbank für unser Projekt erstellen. Öffnen Sie Lara GM, gehen Sie zur Datenbank und klicken Sie auf Öffnen und hier korrigieren Sie es und erstellen Sie eine neue Datenbank Okay. Also setzen wir unseren Datenbanknamen auf AI Underscore API, To Jetzt müssen wir diese Datenbankinformationen in unserer Punkt-EMV-Datei konfigurieren diese Datenbankinformationen in unserer Punkt-EMV-Datei Unter dem Punkt EMV finden Sie also diesen Abschnitt DB-Verbindung MySQL, Hostname Dies ist eine Portnummer, die Standardcodenummer 3306. Und das ist unsere neu erstellte Datenbank, AI Underscore Verwenden Sie den Namen für den lokalen Host Ro und es gibt kein Passwort, speichern Sie einfach. Okay. Jetzt Terminal öffnen, neues Terminal. Und jetzt werden Sie unsere Datenbanktabellen migrieren. Um zu migrieren, müssen wir diesen Befehl PHP, artisan Migrate Dadurch werden also alle Datenbanktabellen migriert. Normalerweise finden Sie diese Informationen im Migrationsordner unter Datenbankmigrationen Also hier haben wir drei Tabellen. Wir werden dieses PHP migrieren, Artisan migrieren, Enter drücken Ordnung. Die gesamte Tabelle wurde also erfolgreich migriert Sie können sie anhand unserer Datenbank überprüfen und Ihre Datenbank öffnen Wie Sie sehen können, wurden hier also nur wenige Tabellen migriert, nur wenige Tabellen migriert wenn wir diesen Befehl in unserem Terminal Alight ausführen Jetzt haben wir das lokale System für die Anwendung LA 12 erfolgreich installiert, und ab der nächsten Klasse werden wir es integrieren Wir werden eine API-Route erstellen, und Sie werden auch eine Controller-Methode erstellen Ich werde es dir in den nächsten Kursen zeigen. Ich danke dir. 4. API-Route installieren: Hallo, alle zusammen. Willkommen zu dieser Vorlesung. In diesem Vortrag zeige ich Ihnen, wie Sie API Route im Lara V 12-Projekt installieren Wie Sie jetzt sehen können, können Sie in einem Route-Ordner nur Console PHB und Web Dot PHB sehen Dieser Webpunkt PHB ist für den Frontend-URS verantwortlich. Im Moment gibt es in unserer 12-Installation keinen Stapel namens apt PHB Das apt-PHB ist für alle Backend-APIs verantwortlich. Gehen Sie nun zum Browser und suchen Sie nach Laval Dort können Sie die Option Routing sehen Klicken Sie auf Routing. Unter diesem Abschnitt ziehen Sie ein wenig nach unten. Los geht's. Also APR-Strecken. Wenn Ihre Anwendungen auch eine State-API anbieten, können Sie ApOut mit dem Befehl Install AP Artisan aktivieren mit dem Befehl Install AP Artisan Um APR Out zu installieren, müssen wir also diesen Befehl ausführen, diesen Befehl kopieren und zum VS-Code zurückkehren und vom Terminal aus einfach den Befehl hinter sich lassen, den Sie von der offiziellen La-Website kopiert haben . Also PHP Autison Space Installieren Sie die Doppelpunkt-API. Dadurch wird eine neue Datei in unseren Routen Bolton erstellt. Dann drücken wir Enter Okay, eine neue Datenbankmigration war Bobist. Möchten Sie alle ausstehenden Datenbankmigrationen ausführen, einfach eingeben und auf Ausschreibung klicken? Okay. In Ordnung. Wie Sie sehen können, gibt es einen neuen Stapel in unserem Routenordner , der API-Punkt PHB ist Lassen Sie uns vor dem Abschluss eine schnelle API-Route testen. Und hier werde ich eine neue Route erstellen, die eine gute Route ist, Polen, Polon Gate und Endpunkt, sagen wir mal als Test Der erste Parameter, den wir angeben, ist also unser APY-Endpunkt. Und hier brauchen wir die Callback-Funktion und innerhalb der Callback-Funktion werde ich einfach die Antwort in einem JSM-Format zurückgeben Ich habe eine R-Nachricht, sagen wir mal, Lab ist bereit für AR Wir müssen Semi-Pooling auch hier einrichten. Speichern Sie die Datei Um unser Projekt auszuführen, gehen Sie zu Lagan unter dem PB. Lassen Sie mich das schließen. Ich verwende eine kostenlose Lizenz, daher erhalte ich häufig diese Meldung Gehen Sie also ins Internet WW PC AI APR. Dies ist die URL unseres Freundes. Jetzt haben wir eine neue APR-Testroute erstellt , testen Sie diese Route. Wir müssen die Projekt-URL, die Slash-API und unsere NPine ausführen Slash-API und unsere NPine Hier ist Hurts Test unser API-NPI. Wie Sie sehen können, ist dies unsere Antwort. Nachricht l ist bereit für KI. Das ist es. Jetzt ist unser l vollständig eingerichtet und bereit für die Integration mit der Gul Gemini API in unserer nächsten Lektion Okay, wir sehen uns weiter. Nächste Klasse. Danke. 5. Gemini API-Schlüssel abrufen: Hallo alle zusammen. Willkommen zu dieser Vorlesung. In der vergangenen Saison haben wir unser Owl 12-Projekt erfolgreich eingerichtet und unsere erste API-Zeile getestet Jetzt ist es an der Zeit, die Magie von Google Gemini , AR, einzubringen Google Gemini , AR, In dieser Lektion zeige ich Ihnen, wie Sie Ihren eigenen API-Schlüssel erhalten, dem wir Laral mit dem leistungsstarken KI-System von Google verbinden Laral mit dem leistungsstarken KI-System von Google Öffnen Sie zunächst Ihren Browser. Und geben Sie aitudiotgogle.com ein. Ich trete ein. Okay. Dies ist also offizielle Plattform von Google, auf der Sie Gemini-Modelle ausprobieren, Eingabeaufforderungen testen und APIs erstellen Wenn Sie noch nicht angemeldet sind, melden Sie sich mit Ihrem Google-Konto und einem beliebigen Gmail- oder Space-Konto an. Bei Ihrem ersten Besuch müssen Sie die Allgemeinen Geschäftsbedingungen akzeptieren Sobald Sie fertig sind, landen Sie genau auf dieser Seite im AI Studio-Dashboard. Okay? Lassen Sie uns nun einen KI-API-Schlüssel erstellen, wir in Lara verwenden werden. Klicken Sie auf das Profilsymbol Und hier siehst du die Ups und bekommst ABI. Klicke auf create AbiKey setName owl well, A API und wähle das Cloud-Projekt aus, wähle Projekt erstellen und nenne es Erstellen Sie ein neues Projekt als erstellt und als erstellt und geben Sie einen konkreten Schlüssel ein. Okay. In Ordnung. Also hier haben wir unseren APIKey. Kopieren Sie diesen API-Schlüssel und kehren Sie zum Wiz Word Studio-Code zurück und öffnen Sie Ihre Punkt-ENV-Datei am Ende der Datei. Lassen Sie uns eine neue Variable erstellen und sie so benennen, wie Jeni API-Underscoe gleich ist, und Jeni API-Underscoe gleich phasenweise den Schlüssel, den Sie von Google kopiert haben. So werden wir uns sektiv mit dem Go GeminiEPI verbinden, ohne dass Kunst in unseren Kern codiert wird sektiv mit dem Go Sie Ihre Punkt-ENV-Datei am Ende der Datei. Lassen Sie uns eine neue Variable erstellen und sie so benennen, wie Jeni API-Underscoe gleich ist, und phasenweise den Schlüssel, den Sie von Google kopiert haben. So werden wir uns sektiv mit dem Go GeminiEPI verbinden, ohne dass Kunst in unseren Kern codiert wird. Bevor wir es in Ravel verwenden, wollen wir schnell testen, ob der Schlüssel funktioniert. Ich zeige es dir auf der nächsten Liste. 6. Laravel 12 Abhängigkeitsmodule und Routeneinrichtung: Spiele einen. Willkommen zu dieser Vorlesung. In der vorherigen Vorlesung haben wir unseren Laval 12 erfolgreich installiert, und wir haben auch die Lawltwelve APA-Route installiert Und in dieser Vorlesung werden wir unseren AP-Endpunkt für den Dokumentenanalysator erstellen unseren AP-Endpunkt für den Dokumentenanalysator werden wir unseren AP-Endpunkt für den Dokumentenanalysator erstellen. Lassen Sie uns also anfangen. Öffnen Sie apt PHB. Und hier werde ich eine neue Route erstellen, die Postroute sein wird, Doppelpunkt Polen Und hier müssen wir unseren Methodennamen angeben, egal ob es sich um einen Beitrag oder ein Spiel handelt In unserem Fall wird es also eine Post-Methode sein, und der Endpunkt wird ein Analysedokument sein. Und dann müssen wir unseren Controller laden, AI-Controller, die Doppelpunktklasse, und dann müssen wir unseren Methodennamen angeben. Hier werde ich unseren Methodennamen als Analysedokument erwähnen . Okay? In Ordnung. Also ist unser Endpunkt bereit. Als Nächstes müssen wir diese Methode in unserer KI-Steuerung erstellen. Öffnen Sie unseren KI-Controller, und hier werde ich eine neue Methode erstellen. Okay. In Ordnung. Also ist unsere Methode fertig. Vorher müssen wir in A ein Abhängigkeitsmodul für die Dokumentzeile zum Hochladen und Extrahieren von Dokumenten installieren . Öffnen Sie also zuerst das Terminal und geben Sie Composer ein benötigen SMLTPDParser Geben Sie ein, unser Abhängigkeitsmodul wurde erfolgreich gestartet und das nächste für Word-Argument Wir müssen dieses Modul verwenden. Composer benötigen PHB unser Abhängigkeitsmodul wurde erfolgreich gestartet und das nächste für Word-Argument. Wir müssen dieses Modul verwenden. Composer benötigen PHB Office PHB Word. Es tritt ein. Der erste wird für PDF dc Man verwendet. Das nächste, von dem es PHB gibt, ist PHB, das für Dokumente vom Typ Word und LOC funktioniert . Okay? Ordnung. Also war unser Abhängigkeitsmodell selbst erfolgreich, und dann müssen wir einen Speicherlink erstellen. Um einen Speicherlink zu erstellen, müssen wir diesen Befehl ausführen PHB Artisan, Storage, Len Okay, der Speicherlink wurde in unserem öffentlichen Ordner Publicic erstellt, wie Sie sehen können, wurde ein neuer Ordner Z. Als Nächstes, bevor wir beginnen, öffnen Sie das Laragan-Terminal und gehen Sie zu Root und gehen Sie zu PHB und öffnen Sie phb.n5 und suchen Sie Als Nächstes, bevor wir beginnen, öffnen Sie das Laragan-Terminal und gehen Sie zu Root und gehen Sie zu PHB und öffnen Sie phb.n5 und suchen Sie nach Z. Okay. Vergewissern Sie sich, dass es aktiviert wurde Wenn vor der Erweiterung ein Semikolon steht, entfernen Sie das Semikolon und speichern Sie die Datei. Okay? Wir müssen das Zip-Modul aktivieren. Okay, hier haben wir unseren APN-Punkt oder unsere AI-Controller-Methode erstellt , und wir haben auch Abhängigkeitsmodule installiert und auch einen Speicherlink erstellt In der nächsten Vorlesung werden wir unsere Methode A AI Analyzed Document Controller implementieren unsere Methode A AI Analyzed Document Controller Danke. Wir sehen uns bei der nächsten Vorlesung. 7. Dokumentenanalyse-API: Hallo, alle zusammen. Willkommen zu dieser Vorlesung. In der vorherigen Vorlesung haben wir Abhängigkeitsmodule und Speicherlinks in einem a installiert und in dieser Vorlesung werden wir unsere analysierte Document-Controller-Methode implementieren . Lass uns anfangen. Hier, das analysierte Dokument, wir müssen dem Benutzer einen Frühstücks-Dollar geben. Und benutze Illuminate ein CT. Stellen Sie sicher, dass es in die Wanne importiert wurde. Verwenden Sie dann Illuminate Support Pads plus S GTB, fügen Sie dies ebenfalls hinzu und verwenden Sie die Ausnahme für die Fehlerbehandlung und importieren Sie unser PDF-Modul Der Parser von Mart PDO. Und verwenden Sie unser Office-Paket, verwenden Sie auch PHP Office, Schrägstrich, Klasseneingabe nach Faktorisierung und Nutzung Speichers der Support-Pakete Okay. Hier haben wir alle Abhängigkeitsbibliotheken erfolgreich importiert. Und als Nächstes werden wir unsere Controller-Methode implementieren . Analysieren Sie also im Inneren die Document-Methode und erstellen Sie den TryCatch-Block Okay. Sei Bargeld. Verwenden Sie eine Ausnahme für jeden Fehler im Catch-Block, geschriebene Antwort im JSON-Format. Stellen Sie im JSON-Array den Status als Fehlermeldung ein, sagen wir, etwas ist schief gelaufen. Und die Details Dollar E der Nachricht, Nachricht abrufen. Und erwähnte den Status cool, ein 500 interner Server hier. Okay, unser Cache-Fehler-Pod ist also fertig. Und als Nächstes werden wir unser Hauptstativ implementieren. Okay. Zuerst müssen wir unsere Eingabe validieren. Bestätigen Sie die hochgeladene Datei. Bei Anfrage, Validierung und interner Validierungsmethode müssen wir unsere Validierungsregeln im Array angeben. Datei, hochgeladene Datei, es ist erforderlich. Und ME muss in Pi von Dargan, vom Typ DvoCX des DarkNexDPAN-Dokuments , sein und die maximale Upload-Größe ist pmD. Okay. In Ordnung. Also, wenn die Validierung bestanden ist, müssen wir als Nächstes die fünf speichern. Ein Dollar von p entspricht einem Dollar einer Anfrage von fünf und einem Dollar von fünf Im Inneren eine Platine, fünf erwähnt. Fünf Paare . Uploads speichern. Als nächstes, falls nicht p existiert. Okay. Vorher werden wir den absoluten Pfad finden. Vollständiger Pfad entspricht Speicherdoppelpunkt , Doppelpunktpfad und feiner Pfad Okay. Okay, also hier, nicht die Datei, sondern den vollständigen Pfad. Dann schriftliche Antwort. Jason, im RA-Status. Fehlermeldung wie Uploader Pi wurde nicht im Speicher gefunden Dann bleib eine Schulserie von Full Path for no. I Pile wurde erfolgreich hochgeladen und wenn er im Pfad zum Upload des Stapels vorhanden ist, werden wir die Erweiterung validieren. Zuerst benötigen wir die Erweiterung der hochgeladenen Datei. Erweiterung entspricht einer Zeichenfolge zum Loga Dollar pi h, ursprüngliche Erweiterung des Clients wird abgerufen Daro Text ist hier gleich leer, ich habe eine neue Variable erstellt und den leeren Wert zugewiesen Extrahieren Sie dann basierend auf dem Dateityp. Und hier werden wir die Switch-Anweisung verwenden. Schalten Sie die Dal-Erweiterung aus. Und hier, wenn die Datei im PDF-Format ist, dann entspricht der Parser dem neuen Dann entspricht Pdf dem Dollar-Parser der Parse-Datei im vollen Pot. Also zuerst werden wir den hochgeladenen Stapel mit der Pass-Pile-Methode übergeben. Dann Text, Sie werden PDF oder J-Text zuweisen. Also hier verwenden wir den Pf-Parser, wir übergeben die hochgeladene Datei und wir übertragen den Text aus der Pause an PO Dann mach Pause. Als Nächstes geben Sie DOC ein. Das PHB-Wort steht für Eingabe, Ausgabe, Fabrik, Doppelpunkt, Doppelpunkt, Laden, vollständiger Pfadname, vollständiger Pfad Für jedes Dar PHP-Wort erhalte ich sechs Sekunden Auch hier entsprechen sechs der G-Elemente Dollar eines Elements Innen für jeden. Meine Mutter unterstreicht Dollar an Element existiert Komm schon, hol dir eine SMS. Im Inneren von Dar of Text. Es entspricht dem Element des Textes. Und dann füge einen Zeilenumbruch hinzu. Okay. Sag die Datei und füge eine Pause hinzu. Wenn die Uploader-Datei nicht vom Typ PDF oder DVD ist, verwenden wir default für tx Standardeinstellung entspricht Dollar-Text Stapel und dem quadratischen Tor und dem quadratischen Inhalt. Dies ist die Standard-PHB-Methode, um den Inhalt der Upload-Datei abzurufen Zieh doch einen. Okay. Okay, mit der Switch-Methode, wenn die hochgeladene Datei niedriger ist als früher, verwenden wir den P-Parser, um die Datei zu analysieren, und von dort holen wir uns den Text und weisen der Textvariablen den Wert zu Wenn die hochgeladene Datei im DOCX-Format ist, wir die PHP-Worterweiterung Und dann übergeben wir hier den Text und weisen den Wert der Textvariablen Do zu Wenn die hochgeladene Datei im Textformat vorliegt, verwenden wir File Gate Pentents die Standard-PHP-Methode, um den Inhalt aus der Datei abzurufen. Okay? In Ordnung. Als Nächstes werden wir Dauerwelle aufräumen. Aufräumen erlaubt, ist ein Dollar an Text gleich, ein Pine-Unterstrich, ermittelt den Unterstrich-Inhalt voller Pots . Tut mir leid. Nein, in diesem Fall entspricht Text dem Kürzeren. Ersetzen Sie es durch Schrägstrich, Rückwärtsschrägstrich und Vorwärtsschrägstrich Komm schon, ersetze es durch drei Leerzeichen und lösche den Text ab. Ordnung. Länge der Zeichenfolge im Dollar des Textes. Weniger als Dann gehen wir zu schriftlichen Antworten über. Statusfehlermeldung Der Inhalt des Dokuments zu kurz oder nicht lesbar Die Mindesttextgröße für Upload-Dokumente beträgt also mehr als 15 Zeichen Der Status wird mit W zwei bewertet. Okay. In Ordnung. Dann werden wir den Inhalt auf den effektiven Jahreszins beschränken, okay? Wenn der Text zu groß ist, besteht die Gefahr , dass unser APA-Auto kaputt geht. Wir werden unsere Inhaltslänge begrenzen, Teilzeichenfolge mithilfe der Teilstring-Methode abschneiden, Text und dann die Länge 06000 In Ordnung. Dann ist Prompt gleich siehe hier, ich habe einen Abschlussball gegeben, als ob Sie auf KI ein Dokument analysiert Analysieren Sie das Dokument und geben Sie die Nummer eins an, sortieren Sie die Zusammenfassung, fünf Stichpunkte Nummer zwei, die drei wichtigsten Erkenntnisse. Nummer drei, der Schreibstil, ob es sich um eine formelle Marketingausbildung wie diese handelt. Schlagen Sie abschließend Verbesserungen oder nächste Schritte vor. Und schließlich stimmen Sie sich mit unserem Dokumententext ab. Das ist einer. Okay. Als Nächstes rufen wir unseren APA-Hauptanruf nach Gemini an und senden ihn an Geminal Eine Antwort entspricht dem BIP, einem Doppelpunkt und einer Zeitüberschreitung Lass uns 60 Sekunden lang sein. Nach dem BIP, Doppelpunkt. Generieren Sie Long Wage gobi.com Slash-Beta-Slash-Modelle, und wir werden Gemini, 2.5 Flash Colon verwenden Slash-Beta-Slash-Modelle, und wir werden Gemini, 2.5 Flash Colon verwenden. Generieren Sie zehn Schlüssel. Panten, dann müssen wir unseren Schlüsselwert angeben, den wir aus unserem Google-Konto generiert haben, oder? Wir haben bereits in unserem Punkt NV im Namen des Google Gemini APA-Schlüssels konfiguriert unserem Punkt NV im Namen des Google Gemini APA-Schlüssels Kopieren Sie diesen und fügen Sie ihn hier ein. Dann innerhalb des Arrays, Inhalt. Öffnen Sie erneut das Array. Und darin haben wir ein neues Array für Text. Es wird falsch sein. Okay. Beweg sie und sie kühlen sich ab. Hier. Halb nachmittags. Post-Methode mit einer Zeit von 60 Sekunden auf, und hier ist unsere APN-generative Sprache googolpis.com slash V one beta slash-Modelle hier Modell, wir verwenden Gemini 2.5 plus und Doppelpunkt generieren Inhalt, und im Schlüsselparameter müssen wir den Gemini APA-Schlüssel und die Inhaltsteile übergeben, wir Hier rufen wir die CDP-Methode, die Post-Methode mit einer Zeit von 60 Sekunden auf, und hier ist unsere APN-generative Sprache googolpis.com slash V one beta slash-Modelle hier Modell, wir verwenden Gemini 2.5 plus und Doppelpunkt generieren Inhalt, und im Schlüsselparameter müssen wir den Gemini APA-Schlüssel und die Inhaltsteile übergeben, wir übergeben unsere Textaufforderung. Okay. Und als Nächstes holen wir uns das Ergebnis und speichern es in einer Variablen namens Dollar off result, Dollar of response of Jason. Der Dollar der Zusammenfassung entspricht dem Dollar des Ergebnisses. Kandidaten mit einem Inhalt von Null und einem Wert von Null mit einem festen Andernfalls gehen wir zu schriftlichen Antworten KI hat keine Antwort zurückgegeben. Okay. Schließlich geben wir die Antwortantwort im JSON-Format und innerhalb des Status Success die Meldung, dass das Dokument erfolgreich analysiert wurde. Und der Pi Pi erhält den ursprünglichen Namen des Kunden. Und zum Schluss werden wir die Zusammenfassung zurückgeben. Zusammenfassungsbeschwörung mit dem Status q 200. Okay, sag den Pi. Hier erstellen wir also die APA namens Google Gemini mit unserem n und basierend auf dem Pro-Modell von Google Gemini analysieren wir unser Dokument und geben die Antwort zurück Aus der Antwort extrahieren wir unsere Antwortzusammenfassung und hier kehren wir „Antwort auf jetzt“ an die API zurück Ordnung. Hier die Datei. In diesem Lippenbekenntnis haben wir einen API-Endpunkt erstellt, und hier haben wir eine Methode für ein anderes Dokument erstellt, und hier validieren wir unsere Eingabedatei, und hier laden wir unsere Datei hoch, und hier überprüfen wir, ob die Datei in unser Verzeichnis hochgeladen wurde oder Wenn dies der Fall ist, wenn sie nicht hochgeladen wird, geben wir die Antwort zurück, dass die Upload-Datei nicht im Speicher gefunden wurde Und dann bekommen wir hier die Erweiterung der Upload-Datei. Wenn es PDF ist, laden wir unser PDF-Parser-Modul und übergeben den Text Okay? Und wenn es vom Typ DOC ist, verwenden wir das PHB-Word-Modul und extrahieren den Text Und wenn es sich um einen Textformer handelt, verwenden wir die Standard-File-Gate-Inhaltsmethode , um den Text zu extrahieren Basierend auf dem extrahierten Test formatieren wir hier unsere PM so, dass sie uns eine Zusammenfassung, drei besten innen, den Schreibstil und die Verbesserungsvorschläge gibt, und zwar mit einem anspruchsvollen Test Hier rufen wir die API Gemini API Basierend auf der Antwort formatieren wir die Zusammenfassung und schreiben zurück die Antwort an unseren APN. In Ordnung Die Methode zur Dokumentenanalyse ist fertig und nächstes Jahr werden wir sie mit unserem Postboten testen Danke. Wir sehen uns beim nächsten Pitch. 8. API-Tests POSTMAN: Plural eins. Willkommen auf diesem Bild. In der vorherigen Literatur haben wir unsere Docan Analyzer-API mit Laura vl 12 und dem Google Gemini-Modell implementiert unsere Docan Analyzer-API mit Laura vl 12 und dem Google Jetzt ist es an der Zeit, unser Document Analyzer-Modell mit Postman zu testen unser Document Analyzer-Modell Hier habe ich eine neue Methode erstellt und als Post-Methode ausgewählt Und hier müssen wir unseren APNPIO ABI-Endpunkt erwähnen, nämlich den AI-Slash Document Annyze , den wir in unserer AppHBO erwähnt haben Wählen Sie also im Hauptteil Sexon als Formulardaten und den Schlüssel als Datei aus und wählen Sie Typ als Datei aus, und im Wert Sexon wählen Sie aus neuer Datei und im Wert Sexon aus lokaler Nachricht. Und hier habe ich eine Beispieldatei, p-Datei und wähle diese Datei aus und ich werde auf Constant klicken wenn ich auf Zustimmung klicke, wird basierend auf unserer Aufforderung ein APA-Anruf getätigt , und innerhalb weniger Sekunden erhalten wir eine Antwort von Logal Gemini. Okay. Also richtig. Wir haben Erfolgsstatus Erfolg mit dem Status Quo 200 und Nachrichten Dokument analysiert erfolgreich Dateimusterbericht pedia , die wir hochgeladen haben und hier ist eine Zusammenfassung. Okay. Lassen Sie mich auch mit dem Word-Dokument testen. Und hier habe ich ein Dokument vom Typ DOCX und klicke auf Consent. Okay. In Ordnung. Also hier, der Dateiname lautet Testdaten und DOCX, und hier ist unsere Zusammenfassung. Es funktioniert gut Lassen Sie mich das entfernen und lassen Sie mich Wörter testen, die Art des Dokuments nehmen und auf Senden klicken. Okay. Ordnung. Dieser AB funktioniert auch gut. Unser Dokumentenanalysator funktioniert auch mit den Dateiformaten Dot PDF, DivCx und TXT einwandfrei . In Ordnung Unser AB ist stabil und wir haben erfolgreich mit Postman getestet und in der nächsten Vorlesung werden wir unseren Friend End Path mit React Plus White plus Delvin Cs implementieren React Plus White plus Delvin Danke. Sehen Sie sich Ihre nächste Vorlesung an. 9. React-Einrichtung: Hallo, alle zusammen. Willkommen zu dieser Vorlesung. In der vorherigen Vorlesung haben wir unsere Bend-API implementiert, um Doc Min mit La 12 und dem Gemini-Modell zu analysieren Jetzt ist es an der Zeit, unseren Frendn-Teil zu implementieren. Für die Freundschaftsseite werden wir Rang plus t Fortalin verwenden , wir werden das CSS verwenden. Lass uns anfangen Also hier bin ich in meinem Kursordner, und von dort aus im Terminal werde ich ein neues weißes Projekt erstellen, indem ich NPM eintippe, spätestens aber Space White Es wird also das neueste weiße Projekt erstellt, und wenn Sie möchten, können Sie dann Ihren Projektnamen angeben Let bedeutet das als KI-Dokumentenanalysator. Okay, drücken Sie die Eingabetaste. Sie müssen die folgenden Pakete installieren, Y auswählen und ein Framework als React und Typ als JavaScript auswählen. Wir rollen Y herunter, wählen Nein und installieren mit NPM und starten nein, wählen Ja Abhängigkeiten mit PM installieren. Okay. Also ist unser weißes Projekt fertig. Sie können den Status hier überprüfen, indem Sie auf diesen Link klicken. Es wird der Browser geöffnet. Dies ist die Standardseite, wenn Sie das Press White-Projekt installieren . Okay, alles klar. Als Nächstes werden wir Tailwind CSS installieren. Um Tailwind CSS zu installieren, rufen Sie Ihren Browser auf und geben Sie White Plus in Gehe zur offiziellen Website. Das ist tailwnss.com. Von dort aus finden Sie die Anweisungen zur Installation von Talen Cs IBEpject Installation von Talen Cs IBEpject Um Talen CSS zu installieren, müssen wir diesen Befehl ausführen, ihn kopieren und zum ihn kopieren Lassen Sie mich vorher diesen Dv Sava beenden, indem ich Strg+C drücke und innerhalb unseres Projektverzeichnisses, dem AI Document Analyzer , zu Inside Move gehe unseres Projektverzeichnisses, dem AI Document Analyzer , zu Inside Move AI Document Analyzer , CD Space PI Dartman Analyzer. Im Moment bin ich direkt in meinem Projekt. Von dort aus können Sie den Befehl aufrufen, Sie von der offiziellen Telvin CS-Website kopiert haben NPM installiere Telvin CSS bei Telvin CSS und drücke die Eingabetaste. Gehen Sie im Fernsehen zum Ordner Dargan Analysis, öffnen Sie White Conflicts, und hier müssen wir einige Änderungen vornehmen Gehen Sie zur offiziellen Website des Telvin CSS. Aus dieser Konfiguration der weißen Blockierung müssen wir dieses Telvin-CSS importieren Kopiere das und kehre zu den weißen Konflikt-Gs zurück und füge es hier ein. Im Block im Abschnitt, innerhalb des Blocks in RA, müssen wir unsere Telvin-CSS-Methoden aufrufen Kopieren Sie das und fügen Okay. Rettet den Stapel. Dann kopiere dieses, importiere Telen-CSS, gehe zur Quelle, indiziere das CSS und lösche alles und füge die Zeile ein, die du von der offiziellen Website kopiert hast. Das ist es. In dieser Vorlesung haben wir unser neues React-White-Projekt installiert und auch Tell CSS installiert. In der nächsten Vorlesung werden wir die Module Differences und unseren Frontend-Teil installieren. Danke. Wir sehen uns bei der nächsten Vorlesung. 10. Abhängigkeiten von React: Spiele jeden einzelnen ab. Willkommen zu dieser Vorlesung. Im vorherigen Bild haben wir unser React-White-Projekt installiert, und außerdem haben wir Telvin CSS installiert. In dieser Vorlesung werden wir das Abhängigkeitsmodul installieren, nämlich Axial wird für APA-Aufrufe verwendet, und wir werden auch eine Komponente erstellen und wir werden auch . Lass uns anfangen. Öffnen Sie das Terminal und geben Sie von dort aus das neue Terminal NPM install Axiuse Treten Sie ein. Okay. Unser Axios-Modell wurde also erfolgreich installiert, und als Nächstes werde ich eine neue Komponente im Quellordner erstellen eine neue Komponente im Quellordner Ich werde einen neuen Ordner namens Components erstellen. Und innerhalb der Komponente werde ich einen neuen Stapel erstellen und ihn Document Analyzer Dot JS nennen . Und hier exportiere die Standardfunktion im Namen des Dokumentenanalysators. Und drinnen gebe ich einfach Inside dim zurück. Dann wir auf einmal. KI-Dokumentenanalysator. Speichern Sie die Datei. Und als Nächstes werden wir das mit unserem Abdu Öffnen Sie Abd JSS und entfernen Sie den Code und geben Sie unsere Dokumentenanalyse-Komponenten Document Analyzer ein Dokumentenanalyse-Komponenten geben Sie unsere Dokumentenanalyse-Komponenten Document Analyzer ein. Okay. Okay, hier ist ein Tippfehler, Dokumentenexport mit Standardfunktion Document Analyzer Und hier in einem geschriebenen Text geben Sie einfach ein Telefon-Tag ein, bei dem es sich um einen KI-Dokumentenanalysator handelt. Okay? Gia Import, Dokumentenanalysator. Aus Komponenten. Komponenten und interne Komponenten sind nicht hier, Funktion geschrieben und innerhalb fällig, über Dokument eingehängt, nein. Okay. Eine Semikolalpflege. Und hier müssen wir die Standard-Export-App verwenden. Okay, speichere die Datei. Lassen Sie mich jetzt Front-End-NPM ausführen, starten Sie Okay. Ordnung. Also das ist unser Ausblick. In Ordnung. In dieser Vorlesung haben wir unser Axios-Modul installiert und auch eine Komponente für unseren Dahman-Analyzer erstellt Im nächsten Video werden wir ein Formular erstellen, ein Reaktionsformular erstellen und uns im APA-Auto den Rücken fressen Danke. Schau dir dein nächstes Bild an. 11. 12 React API-Aufruf: Hallo, alle zusammen. Willkommen zu dieser Vorlesung. In den Komponenten ist der Dokumentenanalysator Dot JS enthalten. Hier habe ich ein neues Formular mit dem Dateityp Datei und hier der Schaltfläche zum Absenden unseres Dokuments erstellt Dateityp Datei und hier der Schaltfläche zum Absenden unseres Dokuments Okay. Also hier ist unser UI, AI Document Analyzer mit der Überschrift und hier die Eingabedatei zur Auswahl unseres Dokuments. Und hier haben wir die Schaltfläche „ Dokument analysiert“. Okay. Lassen Sie mich also in Dcan Analyser ein paar Zustandsvariablen erstellen Laden der Dateiergebnisse ist ein Fehler aufgetreten und es wurde zunächst der Dateiwert auf Null gesetzt, der Ergebniswert auf leer gesetzt und das Laden auf falsch gesetzt und der Fehler, Anfangswert Okay. Also in der Eingabedatei. Immer wenn der Benutzer die Datei in der Szene auswählt , legen wir den Stapelwert als E-Punkt-Zielpunkthaufen Okay? In Ordnung. Also auf Button, Button on Click. Sie werden beim Laden Handle, Upload-Funktion und Deaktivierung aufrufen beim Laden Handle, Upload-Funktion und Deaktivierung Okay. Also für den statischen Text, statt für statischen Text, werden wir ihn beim Laden wie bei der Analyse ändern. Ja, ändere es, um doc com zu analysieren. Okay. Sag den Stapel. Jetzt werde ich eine neue Methode erstellen, eine neue Konstantenvariable im Namen des Handle-Uploads Const, der Upload wird mit der Funktion konfrontiert. Hier müssen wir zuerst unsere Eingabe validieren, falls nicht die Datei, Fehler löschen und zuerst eine Datei hochladen Einfach geschrieben. Und wenn diese Datei ausgewählt ist, setzen wir das Laden auf true. Okay. Geben Sie Err Empty ein und geben Sie ein Ergebnis ein, das leer ist. Okay. Und nach dem Absenden-Button werde ich noch ein paar Blöcke hinzufügen. Erstens, bei Irrtum, Error, wenn es einen Fehler gibt, müssen wir den Fehler anzeigen, richtig. Also den Fehler hier werden wir hier drüben anzeigen. Okay. Im nächsten Abschnitt müssen wir Ergebnis, Ergebnis und Inside Due anzeigen . Lassen Sie mich das hier anzeigen. Entschuldigung, das Ergebnis, oder? Lassen Sie mich das Ergebnis hier anzeigen. Okay. Speichern Sie die Datei. Lassen Sie mich das zuerst ausführen. Also, wann immer ich auf den analysierten Dagon klicke, ohne die Schaltfläche auszuwählen, erhalte ich das gleiche. Bitte lade es zuerst in eine Datei Okay. Lassen Sie mich also eine Beispieldatei auswählen und auf Analyzed Daguon klicken Die Schaltfläche wird zur Analyse. Okay. In Ordnung. Als Nächstes werden wir unsere ABA-Karte erstellen. Okay, lassen Sie mich in unserem Dokumentenanalysator nachdem der eingestellte Ergebniswert leer ist, , nachdem der eingestellte Ergebniswert leer ist, einen Try-Catch-Block hinzufügen. In Cash wurde ein Fehler gesetzt, weil etwas schief gelaufen ist. Okay. Innerhalb des Blocks Rant entsprechen Formulardaten also neuen Formulardaten Formulardaten, die passiert sind. Haufen. Pi, für die Dateivariable, den Namen Pi, weisen wir den Wert Pi Okay, konstante Antwort. Ein weißer Axios-Punktpfosten. Hier müssen wir unseren AP-Endpunkt erwähnen, bei dem es sich um ein CTP-, Schrägstrich-, AIS-API-Test- und API-Slash-AIM Analyze-Dokument handelt. Das ist unser APN-Punkt, ist unser APN-Punkt, Komm schon. Wir müssen unsere Formulardaten weitergeben. Formulardaten. Und dann müssen wir Header erwähnen. Heads, Polonyp Inhaltstyp Mehrteilige Formulardaten. Okay. In Ordnung. Also hier rufen wir unsere APA Axios an. Stellen Sie sicher, dass die Achse oben importiert wird, Accuse Dot Post, und das ist unser AP-Endpunkt Und hier übergeben wir unsere Formulardaten, Formulardaten. Und hier stellen wir HeadSS Contenti mehrere Formulardaten ein. Okay? Sag den Pi. Formulardaten, okay? Unsere Variable können Sie hier löschen, Formulardaten. Okay. In Ordnung. Schließlich werden wir, basierend auf der Antwort, eine Punktzusammenfassung der Ergebnis-Antwort-Daten festlegen. Speichern Sie die Datei. L Wir führen das Frontend durch. Dann wählen wir zuerst eine PDF-Datei aus und klicken auf Dokument aufheben. Sie können den Netzwerkstatus überprüfen. Okay, es ist nicht lizenziert. Lass mich das Tempo anfragen. Okay. Wählen Sie also den Nero-Tab. Wählen Sie zuerst die fünf aus und analysieren Sie das Dokument. Ich rufe Ap in unser Backend auf, ich teste APA, schräg, Ap AI analysierte Dokument Die Daten verbiegen sich. Wir haben Erfolg bekommen, wir haben Erfolg, ist die Zusammenfassung. Wir haben eine Erfolgsantwort erhalten, aber die Erfolgsantwort ist für uns nicht bindend. Lassen Sie mich hier testen , dass wir das Ergebnis, die Antwortdaten auf den Punkt Zusammenfassung setzen. Da ist ein Tippfehler, lassen Sie mich ihn in Zusammenfassung ändern und ihn erneut testen Das ist die Seite. Hier steht unser APA-Anruf noch aus. Okay. In Ordnung. Hier ist unsere API-Antwort. Alle Daten kommen mit einer Zusammenfassung und hier sind die drei wichtigsten. Und hier sind die nächsten Schritte, und hier ist der Schreibstil. Okay? Unser ABA funktioniert, und wir haben unser Ergebnis erfolgreich montiert und unser Ergebnis in React Benton gebunden Und in der nächsten Vorlesung werden wir bei unserer Antwort bleiben Okay. Danke. Sehen Sie sich Ihre nächste Vorlesung an. 12. 13 React Stil auf Ergebnis anwenden: Hallo, alle zusammen. Willkommen zu dieser Vorlesung. In der vorherigen Vorlesung haben wir mithilfe von Axios unseren Ben-APA-Aufruf getätigt und auf der Grundlage der Bend-Antwort unser Ergebnis mit unserem React-Freund und Antrieb verknüpft Jetzt werden wir einige CSS-Änderungen vornehmen, um unser Ausgabeergebnis zu bereinigen Okay? Also, in den Ergebnissen sechs, lassen Sie mich noch ein paar Beiträge hinzufügen In der ersten hatten wir einen Klassennamen. Rand oben fünf Pixel und paarweise vier PG-Grau, Hellgrau, 400, runderer Beim nächsten Punkt geben wir einen Klassennamen ein, Dateien stehen zwischen den Elementen Center und MV Okay und MV Okay Lassen Sie mich in diesem Dossier drei Tags wie KI Summer hinzufügen. Lassen Sie mich hier einen Klassennamen hinzufügen. Klassenname wie Pont SemiBoldText Lodge. Gehen Sie nach der Überschrift über den Abschnitt. Okay, hier ist unser Nachher, dann erstellen wir ein neues De und schließen die Taube hier. In diesem Dossier fügen wir einen Klassennamen wie Leading Text Gray, Seven Okay. Dann wurde hier gefährlich inneres HTML gesagt, HTML unterstreichen Lassen Sie mich das Ergebnis im Format erstellen. Lassen Sie mich ein Formatergebnis erstellen. Zwei. Okay, lassen Sie mich hier eine neue Konstantenvariable erstellen, das Format const, und hier erhalten wir einen Parameterwert, der unser Ergebnistext ist , unser Ergebnistext ist , und ersetzen ihn durch einen so geschriebenen Okay. Und hier, der Output-Sexon stellt sicher, dass er sich selbst geschlossen hat, so wie hier Gefährliches Setzen eines Ergebnisses im HTML-Polen-Format. Und hier übergeben wir unserem tatsächlichen Ergebnis einen Su-Parameter. Okay? Sag die Fünf. Gehen Sie jetzt zum Frontend. Lassen Sie mich die fünf Beispiele auswählen und auf Online-Dokument klicken. Unsere Ben-APA-Anrufe werden geladen, und innerhalb weniger Sekunden sollten wir eine Antwort wie diese erhalten. Okay. Hier finden Sie also unsere Antwort auf KI, eine Zusammenfassung, drei wichtigsten Erkenntnisse und den Schreibstil sowie die Vorschläge für die nächsten Schritte. Okay. Als Nächstes fügen wir der Cipod-Schaltfläche eine Kopie hinzu nach der KI-Zusammenfassung Lassen Sie mich nach der KI-Zusammenfassung eine weitere Schaltfläche hinzufügen Der Name Hawkins. Lassen Sie mich die CSS-Klassennamen von Tlvin, Text Small, Border, PX Three und PY One drum herum hinzufügen Text Small, Border, PX Three und PY One drum herum Wann immer du gehst, wird PG Grad 200 und mache einen leichteren Übergang Okay. Immer wenn ein Benutzer auf die Schaltfläche klickt, rufen wir mit einem Klick Methode „In die Zwischenablage kopieren“ auf Danach tauschen wir Kangs Kopie in die Zwischenablage ein. Navigator-Tastatur, Text schreiben. Und hier ist unser Ergebnis. Und sie können den Benutzer benachrichtigen wie Copy two Clipboard. Speichern Sie die Datei Gehen Sie jetzt zum Frontend. Sie sollten die Schaltfläche „Zwei Zwischenablage kopieren“ sehen In die Zwischenablage kopieren, Sie können das Ergebnis auf einer Seite ablegen und dann abspeichern. Hier ist unsere KI-Antwort. Okay. In Ordnung. Wir haben unseren KI-Dokan-Analysator erfolgreich implementiert, indem wir das Semini-Modell von La Val plus Google mit React-Frontend verwendet 13. 14 Schaltflächenstatus ändern: Hallo, alle zusammen. Willkommen zu dieser Vorlesung. Wir haben unseren KI-Analyzer mit fähiger API, Google Gemini-Modell und React erfolgreich implementiert unseren KI-Analyzer mit fähiger API, Google Gemini-Modell und React Bevor wir zum Schluss kommen, müssen wir einen bestehenden Fehler beheben. Immer wenn Sie eine Datei auswählen und auf Dokument analysieren klicken , werden B und APR angezeigt. Basierend auf der Rückseite und der Antwort zeigen wir das Ergebnis im React-Light an. Nachdem wir die Ergebnisse erhalten haben, analysiert unser Button-Essay immer noch. Es geht in den ursprünglichen Zustand über, oder? Also werden wir das reparieren. Und nach dem Versuch, Schwarz zu fangen, stellen Sie das Laden auf Herbst ein. Okay, wir müssen den Zustand der Tasten ändern. Also verweise auf die Seite. Geben Sie nun ein Beispiel für Pi ein und klicken Sie auf Analysieren. Nachdem Sie das Ergebnis erhalten haben, sollte die Schaltfläche in den Status „Großzügig“ wechseln , z. B. Dokument analysieren. Okay? Warten wir, bis wir das Ergebnis haben. Okay, nachdem ich das Ergebnis erhalten habe, wechselt die Schaltfläche in den allgemeinen Status, ich renne. Sie haben das bestehende Problem behoben. Jetzt haben wir unseren KI-Analyzer mit URL-API und Google Gemini-Modell mit React-Druck offiziell fertiggestellt URL-API und Google Gemini-Modell . 14. 15 Vielen Dank: Hallo, alle zusammen. Zunächst möchte ich allen zum Abschluss dieses Kurses gratulieren. Ich hoffe, Sie sind stolz darauf, wie weit Sie gekommen , denn der Aufbau einer KI-gestützten Zukunft gehört nur zur Schule. Es ist eine Fähigkeit, die Sie wieder in die moderne Entwicklung versetzt. Sie haben gelernt, Dokumente hochzuladen, zu verarbeiten, Text zu schreiben und Gemini AI zu integrieren und aussagekräftige Ergebnisse anzuzeigen Etwas, mit dem viele Entwickler zu kämpfen haben, und Sie haben es geschafft. Bevor du gehst, habe ich drei einfache Berührungen. Reichen Sie Ihr Klassenprojekt ein, nehmen Sie die Bildschirme, dort eine Art Video Ihrer Bewerbung und laden Sie es in den Projektbereich hoch. Das hilft dir, deine Fortschritte zu dokumentieren und zukünftige Schüler zu inspirieren. Die zweite, hinterlasse eine Bewertung. Wenn dieser Kurs Ihnen geholfen hat etwas Neues zu lernen oder etwas Nützliches zu entwickeln, nehmen Sie sich bitte einen Moment Zeit, um eine Bewertung abzugeben. Ihr Feedback hilft mehr Teilnehmern, den Kurs zu entdecken , und motiviert mich auch , immer mehr Inhalte zu erstellen. Nummer drei, folge mir. Vergewissern Sie sich, dass Sie in meinem Profil auf Folgen klicken, damit Sie benachrichtigt werden, wenn ich neue Kurse, Updates oder Bonusinhalte veröffentliche, insbesondere wenn Sie daran interessiert sind , weitere KI-Tools, SAS-Anwendungen oder Full-Stack-Entwicklungsprojekte zu entwickeln . Danke, dass du mit mir gelernt hast. Ich freue mich darauf, das tolle Ding zu sehen, das Sie als Nächstes bauen werden. Wir sehen uns in der nächsten Klasse.