[KI] Erstelle eine Objekterkennungs-Web-App mit Python und Reagiere

1. Einführung: Hallo, alle zusammen. Ich bin Alex Baker und freue mich, Sie zu diesem Kurs begrüßen zu dürfen. Als Full-Stack-Entwickler, Mobile Engineer, Dozent und KI-Enthusiast habe ich das Privileg , mit mehreren großen Technologieunternehmen zusammenzuarbeiten , wenn ich mich auf Technologien wie React, React Native, Engler und Biton spezialisiere React Native, Engler Heute begeben wir uns gemeinsam auf eine spannende Reise. Wir werden eine Objekterkennungsanwendung von Grund auf neu entwickeln und dabei die Leistungsfähigkeit von React für unser Frontend mit FAS PI und PTN für unser Backend kombinieren unser Frontend mit FAS PI und PTN für unser Dies ist jedoch nicht nur ein weiterer Webentwicklungskurs. Wir werden tief in die faszinierende Welt der KI und des maschinellen Lernens eintauchen die faszinierende Welt der KI und des maschinellen Lernens dieses Konzept in realen Szenarien anwenden. ob Sie ein Enthusiast sind, Ihre erste intelligente Anwendung entwickeln möchten, ein aufstrebender Entwickler, der in die Technologie einsteigen möchte , oder ein erfahrener Programmierer, der Ihre Fähigkeiten durch React- oder KI-Integration erweitern möchte Ihre Fähigkeiten durch React- oder KI-Integration Dieser Kurs ist für Sie konzipiert. Wir werden mit Messtechniktechnologien wie Fast API, PTN und Tensor Flow arbeiten , sodass Sie umfangreiche Erfahrung in der Entwicklung moderner KI-gestützter Machen Sie sich bereit, sich vom Zuschauer zum Entwickler von KI-Technologie zu Am Ende dieses Kurses verfügen Sie über die erforderlichen Fähigkeiten, um Anwendungen zu erstellen , die nicht nur Daten verarbeiten Sie sehen und verstehen die Welt um sie herum. Lassen Sie uns Ihre KI-Inspirationen in die Realität umsetzen. 2. 02. KI, Machine Learning und Deep Learning: Willkommen, alle zusammen. Bevor wir also mit dem praktischen Programmieren beginnen, werden wir ein wenig Theorie zu KI, maschinellem Lernen und Deep Learning haben. Heute begeben wir uns auf eine spannende Reise durch die Welt der künstlichen Intelligenz, des maschinellen Lernens und des tiefen Lernens Dabei handelt es sich um transformative Technologien , die die Welt , wie wir sie heute sehen, neu gestalten , und es entstehen neue Technologien, neue Funktionen in Bezug auf die Technologien rund um unsere Geräte, die unser Leben verändern Und was ist damit KI oder künstliche Intelligenz? Offizielle Intelligenz oder KI ist ein Zweig der Informatik, der sich auf die Entwicklung intelligenter Maschinen konzentriert, die Aufgaben ausführen können , für die normalerweise menschliche Intelligenz erforderlich ist. Aber was bedeutet das wirklich? Stellen Sie sich ein Computersystem das natürliche Sprache versteht, Objekte und Bilder erkennt, Entscheidungen trifft und sogar aus seinen Erfahrungen lernt. Das ist also die Essenz von KI im Allgemeinen. Es geht darum , Maschinen zu entwickeln , die kognitive Funktionen nachahmen, wir mit dem menschlichen Verstand verbinden, wie zum Beispiel das Lernen und das Lösen unseres Problems KI-Systeme können von einfachen, regelbasierten Programmen bis hin zu kompletten Systemen reichen regelbasierten Programmen bis hin zu kompletten , die sich anpassen und weiterentwickeln können Ziel ist es, Maschinen zu entwickeln , die die Umwelt wahrnehmen, ihre Wahrnehmung nachvollziehen und Maßnahmen ergreifen können ihre Wahrnehmung nachvollziehen , die ihre Erfolgschancen bei dem Ziel, das wir in diesem Fall wollen, maximieren ihre Erfolgschancen . Was sind nun die Arten von KI oder was können wir als solche Arten von KI finden? Wenn wir über KI sprechen, ist es wichtig zu verstehen, dass es verschiedene Arten oder Ebenen von KI gibt . Lassen Sie uns also die beiden Hauptkategorien untersuchen. Wir haben also eine schwache oder enge KI, eine starke oder allgemeine KI. Also schwache KI oder enge KI, das ist eine Art von KI, mit der wir in unserem täglichen Leben interagieren. Sie ist so konzipiert, dass sie eine bestimmte Aufgabe oder eine bestimmte Gruppe von Aufgaben ausführt, die wir in diesem Fall einbeziehen können, etwa Sprachassistenz wie City Alex - oder Bullet-Assistenz, Empfehlungssysteme, wie wir sie bei Netflix oder Amazon sehen, Bilderkennungssoftware und Spa-Filter in E-Mails. Diese Systeme sind ausgezeichnet und es handelt sich um spezifische Aufgaben, die jedoch auch außerhalb ihrer Programmdomänen ausgeführt werden können . Sie haben weder allgemeine Intelligenz noch Bewusstsein. In diesem Fall kommen wir zur starken KI oder allgemeinen KI. Das ist derzeit eher ein theoretisches Konzept. Starke KI bezieht sich auf eine Maschine, die über Bewusstsein, Empfindungsvermögen und Verstand verfügt und die Fähigkeit besitzt, Intelligenz auf jedes Problem anzuwenden, anstatt nur auf eine bestimmte diesen Arten von KI gehören beispielsweise Argumentation, das Lösen von Rätseln, das Treffen Urteilen mit Gewissheit, das Planen, Lernen, Kommunizieren mit natürlicher Sprache und die Integration aller Fähigkeiten, um ein gemeinsames Ziel Sie sind zwar noch nicht da, aber das ist das ultimative Ziel der KI-Forscher Es ist die Art von KI, die wir in Filmen wie Terminator, Matrix usw. sehen , Matrix usw. Wir werden jetzt lernen, was maschinelles Lernen ist. Maschinelles Lernen ist eine Untergruppe von KI. Beim maschinellen Lernen werden die Dinge aus unserer Sicht wirklich interessant Bei der traditionellen Programmierung geben wir dem Computer eine Reihe von expliziten Anweisungen zur Lösung eines Problems. Beim maschinellen Lernen verfolgen wir jedoch einen anderen Ansatz. Anstatt explizite Anweisungen zu schreiben, geben wir der Maschine eine große Menge an Daten und lassen sie lernen , unsere Probleme zu lösen. Und wie funktioniert das? Also füttern wir die Maschine mit großen Datensätzen. Die Maschine analysiert und identifiziert Muster. Basierend auf diesen Mustern kann die Maschine ihre eigenen Regeln oder Algorithmen erstellen. Die Maschine kann die Regeln dann auf neue Sündendaten anwenden , um Vorhersagen zu treffen. Anstatt beispielsweise einen Computer mit all diesen Regeln zu programmieren , was eine E-Mail zu Spam macht, können wir das anhand tausender Beispiele für Spam- und Nicht-Spam-E-Mails zeigen . Der Algorithmus für maschinelles Lernen lernt dann , die Merkmale von Spam-E-Mails zu identifizieren , und kann dieses Wissen dann auf neue E-Mails anwenden , die noch nie zuvor gesehen wurden. Der Schlüssel dazu ist, dass Systeme für maschinelles Lernen ihre Leistung mit zunehmender Erfahrung verbessern . Je mehr Daten sie verarbeiten, desto besser werden sie zu einer besseren Aufgabe. Diese Fähigkeit, aus Erfahrung zu lernen und sich zu verbessern , ohne explizit programmiert zu werden, zeichnet maschinelles Lernen aus. Und was maschinelles Lernen angeht, gibt es verschiedene Arten des Lernens. Wir haben das unbeaufsichtigte Lernen bei dem die Daten unbeschriftet werden, oder Datencluster ohne Kennzeichnung, und es ist Aufgabe der Maschine, diese Datensätze zu identifizieren und zu kennzeichnen Dann haben wir das überwachte Lernen, bei dem wir die Maschine mit bereits beschrifteten Daten gefüttert haben Maschine mit bereits beschrifteten Daten gefüttert wird es für die Maschine einfacher Mit diesen Datensätzen wird es für die Maschine einfacher, zu lernen. Dann haben wir das verstärkte Lernen bei dem die Maschine lernt, indem sie belohnt oder bestraft wird indem sie belohnt oder bestraft genauso wie sie mit diesen Daten lernt und uns das Ergebnis liefert. Jetzt können wir also zum dritten Teil unseres KI-Kontextes übergehen , dem Deep Learning Ein tiefes Lernen bringt das maschinelle Lernen auf die nächste Stufe. Es ist ein Teil dieses Teils des maschinellen Lernens , der von der Struktur und Funktion des Gehirns inspiriert ist, insbesondere von der Vernetzung vieler Neuronen Beim Deep Learning werden Strukturen verwendet, die als künstliche neuronale Netze bezeichnet werden. Dabei um Softwaresysteme, die die Art und Weise nachahmen unsere Neuronen in unserem Gehirn verbinden So wie unser Gehirn Muster erkennen und komplexe Daten verstehen kann , können Deep-Learning-Algorithmen ähnliche Funktionen ausführen Deep Learning und Deep Learning beziehen sich auf die Anzahl der Schichten in diesen neuronalen Netzwerken, während ein einfaches neuronales Netzwerk nur aus einer oder zwei Schichten bestehen kann und Deep-Learning-Systeme aus Hunderten bestehen können. Jede Schicht im neuronalen Netzwerk von Depo verarbeitet die empfangenen Daten, extrahiert Merkmale und leitet die verarbeiteten Informationen an die nächste Schicht weiter Während sich die Daten durch diese Schichten bewegen, kann das Netzwerk immer abstraktere und komplexere Merkmale von Daten erlernen immer abstraktere und komplexere Merkmale von Daten Das macht Deep Learning besonders gut in den Bereichen Bild- und Spracherkennung, Verarbeitung natürlicher Sprache, Übersetzungen zwischen den Sprachen, Generierung realistischer Bilder und Videos und sogar Musikkunst Wie wir jetzt hier auf dem Bildschirm sehen, haben wir auch Teile neuronaler Netze Lassen Sie uns also etwas tiefer in die neuronalen Netze eintauchen , da sie die Grundlage für die Erschöpfung Es gibt verschiedene Arten von neuronalen Netzwerken, jeweils für bestimmte Aufgaben konzipiert Sie haben also das neuronale Feed-Forward-Netzwerk. Dies sind die einfachsten Arten künstlicher neuronaler Netze. Die Informationen bewegen sich nur in eine Richtung von der Eingabeschicht durch die verborgenen Schichten, und dann erhalten wir das Ergebnis auf der Ausgabeschicht. Sie werden für einfache Aufgaben wie Klassifizierung und Regression verwendet wie Klassifizierung und Regression Wir haben auch das rekurrente neuronale Netzwerk. Diese Netzwerke verfügen über Verbindungen, die Zyklen bilden, sodass Informationen erhalten bleiben Sie eignen sich besonders gut für die Verarbeitung sequentieller Daten wie Text - oder Zeitreihendaten Und sie werden für Aufgaben wie Sprachübersetzung und Spracherkennung eingesetzt Sprachübersetzung und Spracherkennung Wir sehen uns dann die neuronalen Faltungsnetzwerke an. Diese sind so konzipiert , dass sie Daten mit Rastertopologie verarbeiten , Sie verwenden eine mathematische Operation Faltung bezeichnet wird, anstelle einer allgemeinen Matrixmultiplikation in mindestens einer dieser Schichten Dort stehen sie für jede Art von Bildanalyseaufgabe zur Wahl für jede Art von Bildanalyseaufgabe Jedes dieser Netzwerke hat seine Stärken und Schwächen, und wir haben uns auf der Grundlage des jeweiligen Problems entschieden. Und wie fügen wir nun all diese Teile zusammen, um eine Anwendung zu erstellen? wir nun die einzelnen Komponenten verstanden haben, wollen wir uns ansehen, wie KI, maschinelles Lernen und Deep Learning im realen Szenario zusammenarbeiten. Nehmen wir das Beispiel eines Objekterkennungssystems in einem selbstfahrenden Auto. Der KI-Teil, das umfassende System das es dem Auto ermöglicht, seine Umgebung wahrzunehmen, Entscheidungen zu treffen und seine Bewegung zu kontrollieren Dazu gehört nicht nur die Objekterkennung, sondern auch die Routenplanung, Einhaltung der Verkehrsregeln und die Interaktion mit anderen Fahrzeugen und Fußgängern Wir gehen dann zum Teil des maschinellen Lernens über, der zugrunde liegenden Engine , die es der KI ermöglicht aus riesigen Mengen an Fahrdaten zu lernen Dazu gehört das Erlernen der Erkennung verschiedener Arten von Objekten wie Autos, Fußgängern und Verkehrsschildern, Verständnis der Straßenverhältnisse und Anpassung an unterschiedliche Fahrszenarien Die Deep-Learning-Architektur , in diesem Fall die CNNs oder die konvolutionalen neuronalen Netze verwendet die komplexe Aufgabe der Objekterkennung in Das CNN verarbeitet die visuellen Eingaben von der Kamera des Autos und identifiziert und lokalisiert In diesem Szenario bietet die KI den Gesamtrahmen und den Entscheidungsprozess Das maschinelle Lernen wird es uns dann ermöglichen, die Leistung des Systems im Laufe der Zeit zu verbessern , da es auf mehr Szenarien und Komplexitätsszenarien trifft . In diesem Fall bietet uns das Deep Learning ein leistungsstarkes Muster, bietet uns das Deep Learning um Funktionen zu erkennen , die für die Objekterkennung und -klassifizierung in Echtzeit erforderlich sind. Was sind also die realen Anwendungen dieser Art von Technologien, denen wir begegnen können oder die wir in naher Zukunft haben werden? In KI-Anwendungen können wir Chat-Bots, Spracherkennung, selbstfahrende Autos, virtuelle Assistenten wie City, Alexa und Google, Smart-Home-Geräte vorausschauende Wartung auch in der Fertigung einsetzen Wir können dann zum maschinellen Lernen übergehen wo wir die E-Mail-Filterung, die Betrugserkennung, Empfehlungssysteme wie Netflix, Amazon, Spotify und auch Wettervorhersagen Im Bereich Deep Learning können wir Technologien wie Gesichtserkennung, autonomes Fahren, medizinische Diagnose, Verarbeitung natürlicher Sprache usw. einsetzen Die Vorteile dieser Technologie für die Welt können große Auswirkungen auf das Gesundheitswesen, den Umweltschutz, die Bildung, die Barrierefreiheit, die wissenschaftliche Forschung, die Wirtschaft und den Verkehr haben Umweltschutz, die Bildung, die Barrierefreiheit, wissenschaftliche Forschung, die Wirtschaft . Wie wir gesehen haben, prägen KI, maschinelles Lernen und Deep Learning nicht nur unsere Zukunft. Sie verbessern auch aktiv unsere Gegenwart. Diese Technologien lösen Probleme und eröffnen Möglichkeiten , die noch vor wenigen Jahren unvorstellbar waren wenigen Jahren unvorstellbar Es ist jedoch wichtig, sich daran zu erinnern, dass große Macht mit großer Verantwortung einhergeht Da diese Technologien immer mehr in unser Leben integriert werden , müssen wir auch ihre ethischen Implikationen berücksichtigen. Und sicherstellen, dass sie so entwickelt und eingesetzt werden, dass sie der gesamten Menschheit zugute kommen. Die Zukunft ist mit Sicherheit aufregend, und sie besteht aus Ziellinien, neuronalen Netzwerken und Daten. ob Sie ein Student, ein Profi oder einfach eine neugierige Person sind , ich ermutige Sie, weiter über diese faszinierenden Bereiche zu lernen über diese faszinierenden Bereiche , denn wer weiß, vielleicht wird Ihnen der nächste Durchbruch beschert. Vielen Dank, dass Sie mich auf dieser Reise durch KI, maschinelles Lernen und Deep Learning begleiten . Und jetzt können wir zu den interessantesten Teilen übergehen , nämlich der Endzonencodierung 3. 03.Neuronale Konvulkative Netze: Wir kommen nun zu dem Teil des neuronalen Netzwerks, den wir in diesem Kurs verwenden werden, um die Bilder zu erkennen, und wir werden das konvolutionelle neuronale Netzwerk verwenden , das wir zuvor gelernt haben, und wir werden ein tieferes Verständnis dafür haben, und wir werden ein tieferes Verständnis dafür haben Wir können also mit der Definition eines Faltungsnetzes beginnen . Dabei handelt es sich um spezielle Typen neuronaler Netze, die speziell für die Verarbeitung visueller entwickelt wurden Sie sind zum Rückgrat zahlreicher Anwendungen geworden spielen eine entscheidende Rolle bei Aufgaben wie Objekterkennung, Bildklassifizierung, Gesichtserkennung und Aber was macht die CNNs so besonders? Nun, sie sind von biologischen Prozessen im visuellen Kortex von Tieren inspiriert biologischen Prozessen im visuellen Kortex von Tieren So wie unser Gehirn Muster und Objekte in dem, was wir sehen, schnell erkennen kann , können CNNs darauf trainiert werden, genau dasselbe mit digitalen Bildern und Videos zu tun dasselbe mit digitalen Bildern und Videos Die neuronalen Faltungsnetzwerke bieten uns einige wichtige Funktionen Lassen Sie uns sie jetzt aufschlüsseln. Also zuerst haben wir die Faltungsschichten. Sie sind der Kern der Bausteine von CNN. Sie wenden eine Reihe von Filtern auf das Eingabebild an, jeweils darauf ausgelegt sind, bestimmte Merkmale wie Kanten, Texturen oder komplexere Muster zu erkennen , Texturen oder komplexere Muster Je tiefer wir in das Netzwerk eindringen, desto abstrakter und ausgefeilter werden diese Merkmale . Wir haben dann auch einige Zugschichten. Nach der Faltung verwenden wir oft diese Ziehschichten. Sie reduzieren die räumliche Dimension der Daten, machen das Netzwerk recheneffizienter und helfen ihm sich auf die wichtigsten Merkmale zu konzentrieren Zu den gängigen Typen gehören die maximale Zugkraft und die durchschnittliche Zugkraft. Wir gehen dann zu den vollständig verbundenen Schichten über , die sich normalerweise am Ende des Netzwerks befinden. Diese Schichten verbinden jedes Neuron aus der vorherigen Schicht mit jedem Neuron in der nächsten. Sie werden verwendet, um die endgültige Klassifizierung oder Vorhersage auf der Grundlage der Merkmale, Extrakte der vorherigen Schichten, vorzunehmen die endgültige Klassifizierung oder Vorhersage auf der Grundlage der Merkmale, Extrakte der vorherigen Schichten, Extrakte der vorherigen Schichten All das funktioniert, ist die Mathematik, die hinter all dem steckt. Hier haben wir also ein Beispiel für ein neuronales Netzwerk in diesem Bild. Eine entscheidende Komponente ist die Aktivierungsfunktion. In vielen CNNs haben wir die sogenannte Lu-Funktion verwendet, wie Sie dort sehen können, was die sogenannte Lu-Funktion verwendet, wie Sie dort sehen können, für rektifizierte lineare Einheit steht, und die Form ist einfach, und die Form ist einfach diese mathematische Formel in diesem Fall unsere Aktivierungsfunktion ist in diesem Fall unsere Aktivierungsfunktion Das bedeutet, dass für jede Eingabe X, wenn X negativ ist, die Funktion Null zurückgibt Wenn X positiv ist, gibt sie X selbst zurück. Diese einfache Funktion trägt dazu bei, Nichtlinearität in unser Netzwerk einzuführen , sodass es komplexere Muster lernen Das Schöne an dieser Lu ist, dass sie recheneffizient ist und dazu beiträgt, Verschwindungsgradienten zu minimieren , die in tiefen Was nun die Struktur und den Grund dieses tiefen neuronalen Netzes angeht, verstehen wir die Komponenten. Schauen wir uns also an, wie sie in einem typischen CNN für Echtzeiterkennung zusammenkommen , das wir in unserer Anwendung verwenden Für unsere Objekterkennung in Echtzeit haben wir also die Eingaben Hier geben wir unsere Daten ein. In diesem Fall haben wir ein Prane-Trend-Modell. Dann die Faltung, die erste Faltungsschicht, die die Filter anwendet, um Merkmale auf niedriger Ebene zu erkennen In diesem Fall verwenden wir das Paket Tensor Flow Wir verwenden dann die Ziehschicht , um die spezielle Dimension zu reduzieren Wir verwenden auch Convolution, eine weitere Faltungsschicht, die Merkmale Augenhöhe erkennt Dann verwenden wir wieder das Ziehen, so wie wir es auf dem Bild sehen, und wir reduzieren die Abmessungen und konzentrieren Am Ende haben wir dann auch die vollständig verbundene Ebene , die unsere Klassifizierung und Erkennung ermöglicht. Dann sehen wir das Ergebnis auf der Ausgabeschicht, solche Objektklassen und Zuordnungen im Bild Diese Struktur ermöglicht es dem Netzwerk, schrittweise komplexere Merkmale zu erlernen von einfachen Kanten bis hin zu komplexen Objekten Wenn es um die Implementierung der CNNs-Objekterkennung in Dateizeit geht , verwenden wir häufig vorab trainierte Modelle Dies sind CNNs, die bereits mit großen Datensätzen trainiert wurden und eine Vielzahl von Objekten erkennen können eine Vielzahl von Objekten erkennen Wir können sie dann verfeinern , um unseren speziellen Fall zu finden, was uns viel Zeit und Rechenressourcen spart Zeit und Rechenressourcen Ein beliebtes Framework dafür ist wie wir bereits erwähnt haben, der Tensorfluss Es bietet eine API auf hoher Ebene , die den Aufbau, das Training und den Einsatz neuronaler Netzwerke, einschließlich unseres neuronalen Faltungsnetzes, erleichtert Training und den Einsatz neuronaler Netzwerke, einschließlich unseres neuronalen Faltungsnetzes Die Einsatzmöglichkeiten dieser CNNs sind umfangreich, sodass wir diese Netzwerke auch für autonome Fahrzeuge, medizinische Bildgebung, Gesichtserkennung, Inhaltsmoderation und Zusammenfassend lässt sich sagen, dass neuronale Faltungsnetzwerke den Bereich der Computer Vision revolutioniert haben und es Maschinen ermöglichen, die Welt auf eine Weise zu sehen und zu verstehen , wie wir es in Science-Fiction getan haben Während wir diese Modelle weiter verfeinern und neue Architekturen entwickeln, die ob Sie ein Forscher, ein Entwickler oder einfach jemand sind , der sich für dieses Gebiet interessiert, CNNs sind definitiv eine Technologie, die man Sie prägen lediglich das maschinelle Sehen und verbessern die Funktion selbst Damit haben wir ein besseres Verständnis dafür, wie wir unsere Anwendung erstellen werden. 4. 04.Installieren von VSCode: In diesem Kurs werde ich Visual Studio-Code verwenden , um Text zu bearbeiten Es wird also unsere ID sein. Fühlen Sie sich frei, den zu verwenden, an den Sie eher gewöhnt sind. Wenn Sie keine haben, rate ich Ihnen, diesen zu installieren , um zusammen mit mir in diesem Fall zu programmieren. Und falls Sie es nicht wissen, Visual Studio-Code ist ID, Texteditor oder Code-Editor. Er ist Teil der Microsoft-Umgebung und ermöglicht es uns, viele Erweiterungen zu haben die von der Community und auch von großen Unternehmen unterstützt werden. Und diese ID unterstützt viele Sprachen. Auch hier sind die Erweiterungen ein wichtiger Bestandteil dieser ID- und Softwareentwicklung, auch als integriertes Terminal, was sehr cool ist, und GIT-Unterstützung. Um Visual Studio-Code zu installieren, klicken Sie einfach hier auf diese Schaltfläche. In meinem Fall scheint ich für Mac zu wechseln , weil ich eine Mac-Umgebung betreibe. Aber je nachdem, welches Betriebssystem Sie haben, wird es für Sie anders aussehen. Also klicken Sie einfach darauf. Und sobald es heruntergeladen ist, werden wir weitermachen. Sobald der Download abgeschlossen ist, gehst du einfach zum Con-Download. Ich meine, eine Zip-Datei, Sie müssen sie nur entpacken und je nach Betriebssystem haben Sie eine ausführbare Datei oder eine DMG-Datei Also drücken wir es einfach zweimal und fahren mit der Installation fort Eine Sache, die Sie beachten sollten, ist, dass wir ein kleines Häkchen haben , das wir zu Path hinzufügen können. Bitte tun Sie dies, da Sie damit den Editor mit einem einfachen Befehl über das Terminal öffnen können damit den Editor mit einem einfachen Befehl über das Terminal öffnen . Sobald es installiert ist, ist es geöffnet, Sie können die ID hier sehen, und wir werden als Nächstes näher darauf eingehen. Aber im Moment haben wir unsere ID installiert und können weitermachen. 5. 05.VSCode-Erweiterungen: Jetzt, wo wir unseren Editor haben, werden wir einige Erweiterungen installieren Erweiterungen ermöglichen uns also grundsätzlich einen besseren Arbeitsablauf. Hat uns bei einigen Fehlern geholfen, einige Teile zu erkennen, mit GID und sogar mit farblichem Text Es liegt also wirklich an dir. In diesem Fall werden wir jedoch einen Teil von PyTon und der FAST-API verwenden und Erweiterungen installieren , die darauf basieren In unserer Erweiterungsbasis werden wir also all diese Byton-Pakete benötigen, um besser und einfacher zu programmieren und zu unterstützen besser und einfacher zu programmieren und Es gibt Pylonen, die im Grunde genommen über die Intelligenz verfügen, die vorhersagen kann , was wir an der Küste haben wollen , und sie können auch einige Fehler an der Küste melden oder einige Optionen angeben, um es besser zu machen Wir brauchen auch Biton, also die Sprache, den Debugger zum Debuggen unseres Systems, die verwaltete Umgebung, also werden wir virtuelles Management haben oder wir werden virtuelle Umgebungen haben , um unsere Python-Umgebung auszuführen Also brauchen sie auch die Verknüpfung, also den Pylon, um unseren Code zu blenden, um zu sehen, wo wir unseren Code formatieren wollen, und ihn in diesem Fall für alle Teams gleich zu halten ihn in diesem Fall für alle Teams gleich Und das sind die Pakete, die wir benötigen, und wir können all dieses Paket mit nur einem installieren Wir haben also dieses Python-Erweiterungspaket, mit dem wir alle Pakete installieren werden, die wir zuvor gesehen haben. Fahren Sie also einfach mit der Installation dieses Programms fort. Es wird die anderen damit installieren, und wir werden Sie bitten, neu zu starten. Laden Sie dann einfach den Visual Studio-Code neu und wir haben die benötigten Pakete 6. Beste Möglichkeit, einen Kurs zu besuchen: In dieser Vorlesung werden wir lernen, wie wir das Beste aus diesem Kurs herausholen und davon profitieren können. Wenn es um Software geht, werden wir vor allem beim Lernen auf viele Hindernisse stoßen, selbst wenn wir den Codes zusammen mit den Videos folgen. Dies geschah aufgrund von Tippfehlern, Fehlern der Dozenten oder häufiger aufgrund von Software und Paketen , die sich ständig ändern. Was sollten Sie also tun, wenn Sie nicht weiterkommen und dann nicht mehr mit dem Kurs fortfahren können Zuallererst: Machen Sie keinen Cent, das ist normal. Das passiert jedem. Da ich nicht alle Fragen beantworten kann, stelle sicher, dass du den Diskussions-Tab „Skill Shares“ verwendest Dort findest du Schüler, die das gleiche Problem haben wie du, und du kannst einen Thread mit all deinen Fragen und Antworten erstellen. So können wir dir helfen, mit dem Kurs fortzufahren. Da sich die Software ständig ändert, werde ich sicherstellen, dass die Ressourcen in den Ressourcenbereichen in Skill Share verbleiben die Ressourcen in den Ressourcenbereichen in Skill Share Dort können Sie die Anforderungen, das Jason-Paket und die richtigen Versionen aller Pakete, die Sie für diesen Kurs benötigen, herunterladen Jason-Paket und die richtigen Versionen aller . Wir hinterlassen auch die Bilder, sodass Sie die Bilder, die wir in diesem Kurs verwenden werden, herunterladen können . Wenn Sie weiterhin nicht weiterkommen, verwenden Sie Google. Google gibt in der Lösung oft viele Ergebnisse zurück, und Sie können auch aus dieser Suche lernen. Viele Schüler werden den gleichen Fehler haben. Viele Softwareanwender werden denselben Fehler haben, und das kann Ihnen helfen, ihn zu lösen. Lesen Sie die Dokumentation. Viele Plattformen und Pakete oder Programmiersprachen bieten uns umfassende Dokumentationen oder Anleitungen zur Installation und Vorgehensweise. Wenn Sie also überfordert sind, gehen Sie bitte die Dokumentation durch und befolgen Sie die darin enthaltenen Schritte, da dies Ihnen helfen könnte, mit dem Kurs fortzufahren und sich einzudecken. Du kannst auch KI fragen. Diese Tools helfen Ihnen gerne weiter, und wir können Ihnen mit weiteren Erklärungen eine schnelle Lösung für das Problem bieten. Es wird Ihnen helfen, das Problem zu lösen zu erklären, was passiert ist und was Sie falsch gemacht haben. Wenn Sie diese Empfehlungen befolgen, wird Ihr Erlebnis reibungsloser und die allgemeine Qualität verbessert Nachdem all dies geklärt ist, können wir alle weitermachen 7. Ressourcen: In diesem Kurs werden wir einige Ressourcen verwenden, und um die Ressourcen zu finden, müssen Sie einfach den Kurs aufrufen und sie hier finden. Der ZIP-Ordner wird also Links, Bilder und andere benötigte Ressourcen enthalten , die wir im Laufe des Kurses einfügen werden. Also zögern Sie nicht, dies herunterzuladen und dem Video zu folgen. 8. 08. FastAPI und Python-Setup: In diesem Vortrag werden wir also einige spannende Technologien untersuchen , die die Grundlage unserer KI-Objekterkennungs-App bilden die Grundlage unserer KI-Objekterkennungs-App Insbesondere werden wir über BTN und Fast API sprechen und darüber, wie wir mit diesen leistungsstarken Tools ein robustes und effizientes Backend in unserer KI-Anwendung aufbauen ein robustes und effizientes Backend in unserer KI-Anwendung Fangen wir also mit BTN an. Viele von Ihnen kennen diese vielseitige Programmiersprache bereits , aber lassen Sie uns zusammenfassen, warum sie für unser Projekt so wichtig ist PyTon wird aus guten Gründen oft als die Sprache der KI bezeichnet guten Gründen oft als die Sprache der KI Erstens ist die Syntax klar und intuitiv, was es einfacher macht, komplexe Algorithmen zu schreiben und zu verstehen Dies ist besonders wichtig , wenn wir es mit KI- und maschinellen Lernkonzepten zu tun haben . PyTN verfügt auch über ein reichhaltiges Ökosystem von Bibliotheken und Frameworks, die speziell für KI und maschinelles Lernen Das bedeutet, dass uns eine Fülle von Tools Erstellung anspruchsvoller KI-Anwendungen zur Verfügung steht Darüber hinaus stellt die große und aktive Community von Python sicher, dass uns bei der Entwicklung unserer App zahlreiche Ressourcen, Tutorials und Ressourcen, Tutorials und Support zur Verfügung stehen. PTN ist aber nicht nur für KI da. Aufgrund seiner Vielseitigkeit können wir es auch für die Webentwicklung verwenden Datenanalyse, Automatisierung und vieles mehr. Dies macht viele unserer Entwicklungsanforderungen aus einer Hand , einschließlich des Endes unserer KI-Objekterkennungs-App. Lassen Sie uns nun ein bisschen mehr über FASTEPI sprechen. FASTEPI ist also ein modernes Hochleistungs-Web-Framework zum Erstellen Aber was bedeutet das und warum ist es wichtig für In erster Linie macht FAST API seinem Namen alle Ehre. Es ist schnell. Tatsächlich ist es eines der schnellsten verfügbaren PyTN-Frameworks. Diese Geschwindigkeit ist entscheidend , wenn wir es mit Objekterkennung in Echtzeit zu tun haben, da unsere App schnell auf Benutzereingaben reagieren muss Die schnelle API ist auch unglaublich einfach zu bedienen. Wenn Sie mit PyTon vertraut sind, werden Sie feststellen, dass Sie sich schnell mit Fast API vertraut machen können sich schnell mit Fast API Es verwendet standardmäßige Hinweise vom Typ PTN, die nicht nur das Verständnis Ihres Codes erleichtern, sondern auch eine automatische Datenvalidierung ermöglichen Ein weiteres großartiges Feature der FAST-API ist die automatische Dokumentationsgenerierung Das bedeutet, dass FAST API beim Aufbau unserer API automatisch eine interaktive Dokumentation dafür erstellt . Das werden wir in unserem Kurs weiter sehen. Und das ist unglaublich hilfreich, um unsere API für zukünftige Entwickler zu testen , die möglicherweise an unserem Projekt arbeiten. FASTEPI unterstützt auch synchrone Programmierung , sodass unsere Anwendung mehrere Anfragen effizient bearbeiten Und dies ist entscheidend für die Erstellung einer responsiven KI-Anwendung, die mehrere Benutzer gleichzeitig bedienen kann Wie kommen also PyTon und FASEPI in unserer Anwendung zusammen , die wir aus niemandem erstellen werden ? Lassen Sie uns das also aufschlüsseln Wir verwenden Python, um die Kernlogik unserer Anwendung zu handhaben , um die Kernlogik unserer Anwendung Dazu gehören Prozessbilder, Ausführung unseres KI-Modells für die Objekterkennung und die Verwaltung des gesamten Datenflusses durch unser System. FAS-API am anderen Ende bietet ein Framework für unsere Web-API Es ermöglicht uns, Endpunkte zu erstellen denen unser Frontend kommunizieren kann Zum Beispiel könnten wir einen Endpunkt haben, der ein Bild akzeptiert und eine Liste der erkannten Objekte in diesem Bild zurückgibt eine Liste der erkannten Objekte in diesem Bild schnelle API hilft uns, all diese eingehenden Anfragen und ausgehenden Antworten irgendwann zu beenden . Es kümmert sich um Dinge wie Analysieren der eingehenden Bilder und Daten und die Formatierung unserer KI-Modelle, was zu einer Antwort führt , die unser Frontend verstehen kann Die Einfachheit von PTN und die intuitive Natur der FAST-API ermöglichen es uns auch, schnell zu entwickeln und zu interagieren, was in der schnelllebigen Welt der KI-Entwicklung von entscheidender Bedeutung ist von Zusammenfassend lässt sich sagen, dass PTN und FASEPI ein leistungsstarkes Duo bilden , das es uns ermöglicht, ein robustes, effizientes und skalierbares Backend für unsere KI-Objekterkennungs-App aufzubauen effizientes und skalierbares Backend für unsere KI-Objekterkennungs-App für unsere PTN stellt uns Tools und Bibliotheken zur Verfügung, die wir für die KI-Entwicklung benötigen, während FASEPI ein leistungsstarkes Framework bietet, während FASEPI ein leistungsstarkes Framework bietet zugänglich zu machen Im weiteren Verlauf dieses Kurses werden Sie viele Erfahrungen mit PyTON und FAST API sammeln PyTON Sehen Sie sich zunächst an, dass all diese Technologien zusammenkommen , um etwas wirklich Aufregendes zu schaffen Denken Sie daran, dass die Fähigkeiten, die Sie hier erlernen nur für unser spezielles Projekt gelten. Die Kombination aus PyTon und schneller API verwendet verschiedene KI- und maschinelles branchenübergreifend verschiedene KI- und maschinelles Lernen Sie bauen sich grundlegende Fähigkeiten auf, die Ihnen bei vielen Feature-Projekten In unseren nächsten Sessions werden wir damit beginnen, Code zu schreiben und diese Konzepte in der Praxis zu erleben. Machen Sie sich bereit, Ihr KI-Gesetz zur objektiven Anerkennung zum Leben zu erwecken. 9. 09. Installiere Python auf MacOS: Jetzt werden wir PyTon in einer Mac OS-Umgebung installieren Wenn Sie kein Mac OS haben, können Sie diese Vorlesung überspringen und zur Windows-Vorlesung gehen, in der wir PyTon auf Windows Machine installieren Unter macOS haben wir also mehrere Möglichkeiten, PTN zu installieren Die erste, die wir verwenden werden, ist die Installation von PyTon über Brew Brew ist also ein Paketmanager oder Paketinstallationsprogramm in macOS Wir müssen zuerst unser Terminal öffnen und diesen Befehl eingeben. Mach dir keine Sorgen. Ich werde all diese Befehle in den Ressourcen belassen diese Befehle in den Ressourcen damit Sie sie einfach kopieren können. Nachdem wir diesen Befehl haben, fügen Sie ihn einfach hier ein und drücken die Eingabetaste. Ich werde Ihre Passwörter anfordern. Also gib einfach die Passwörter ein. Und wir drücken die Eingabetaste , um das Gebräu zu installieren. Nachdem wir unseren Brew installiert haben, können wir mit der Installation von PyTon fortfahren In diesem Fall werde ich einfach mein Terminal löschen. Wir müssen nur Brew Install PytnPressEnter eingeben und danach wird PyTon A Also, wenn alles gut gegangen ist, solltest du so etwas sehen Eine weitere Möglichkeit, PTN zu installieren, ist die gängigste und empfehlenswerteste Methode zur Installation der PyTon-Sprache, indem die offizielle Website benutzt und dann Teile herunterlädt Also einfach hier, du hast Downloads, mach dir keine Sorgen, ich werde all diese Links in den Ressourcen belassen all diese Links in den Sie finden einfach die Version, die Sie benötigen. Wenn Sie also in diesem Fall diese Taste drücken, wird die neueste Version für Ihr Betriebssystem entladen für Ihr Betriebssystem Es wird nur ein Paket sein, das installiert werden muss. Sie werden es herunterladen, installieren und PTN und das Paket erledigen alles für Sie. Die dritte Möglichkeit, PTN zu installieren, ist über BM. PM ermöglicht uns also, bestimmte Versionen von PTN zu installieren, und wir installieren es auch über Brew, sodass wir einfach Brew sagen können Installiere Pi M. Also klicken wir einfach drauf. Nach der Installation können wir die PyM-Installationsliste überprüfen Wenn wir darauf klicken, erhalten wir eine Liste der zur Installation verfügbaren Pytes und Versionen. Wir drücken also einfach die Eingabetaste Und wie Sie sehen können, müssen wir viele Python-Versionen installieren. Aber wie dem auch sei, du wählst immer die neueste . Wir haben es installiert. Und nachdem wir Python installiert haben, können wir einfach mein Terminal löschen. Wir können das Python sehen, das wir installiert haben, und wenn alles in Ordnung ist, sollten Sie Python drei eingeben können, da Python drei das neueste ist und das ist, das wir in diesem Kurs verwenden werden. Und wir machen einfach das Versions-Tag und wir sehen das, das wir installiert haben. Drücken Sie also die Eingabetaste. Und wie Sie sehen können, habe ich derzeit in meinem System Python 3.12 0.0 installiert Also sollten wir auch etwas rund um diese Version haben. Und damit sehen wir, dass alles gut gelaufen ist und auf unserem System PyTon installiert ist 10. 10. Installiere Python unter Windows: Jetzt fahren wir mit der Installation von BTN auf dem Windows-Computer Wenn er auf unserem Windows-Computer ist, können Sie diese Vorlesung überspringen und zum MacBook-Teil gehen, in dem wir das Pytnon MacBook installieren werden Aber wie dem auch sei, wenn Sie einen Windows-Computer haben und diesen Kurs unter Windows absolvieren werden , können Sie mit diesem Video fortfahren Die am meisten empfohlene Methode zur Installation von PyTon auf dem Windows-Computer ist daher PyTon auf dem Windows-Computer ist die offizielle Website Ich werde den direkten Link zur Website in den Ressourcen hinterlassen zur Website in den Ressourcen Im Grunde müssen Sie nur auf die PyTon-Website gehen und Teile herunterladen Und hier haben Sie die richtige Version für Ihren Computer Sie drücken einfach die Download-Schaltfläche, laden das Paket herunter und fahren dann mit der Installation fort. Nach den Downloads klicken Sie auf das Symbol, das heruntergeladen wird, und es wird ein Fenster wie dieses angezeigt. Es ist so wichtig zu beachten, dass wir dieses Kästchen hier ankreuzen müssen, also bitten wir PTN, den Vorgang zu bestehen Nachdem das Häkchen gesetzt ist, können Sie es einfach jetzt installieren Auch hier können wir das Pfadlängenlimit deaktivieren, da einige Systeme nicht viele Zeichen innerhalb des Limits zulassen, aber das kann zu Problemen in unserem System führen, sodass wir es einfach deaktivieren können Und dann haben wir ein erfolgreiches Setup. Nach der Installation können wir dann unsere Eingabeaufforderung öffnen, um die Version zu überprüfen Wir machen einfach Python und dann das Versions-Flag. Wie wir sehen können, haben wir PTN erfolgreich auf unserem Windows-Computer installiert Eine andere Möglichkeit, PyTon zu installieren, besteht darin, unseren Microsoft Store zu öffnen und im Suchkrieg machen wir einfach PyTon und dann können wir PyTon drei sehen und wir haben all diese Python-Versionen der neuesten stabilen Version, und dann drücken wir einfach G, und es wird die PTN für uns installieren Beachten Sie, dass dies der einfachste Weg ist, PTN zu installieren, aber der weniger anpassbare. 11. 11. Installation und Ausführung von FastAPI: Jetzt werden wir unseren schnellen API-Server erstellen. Als Erstes erstellen wir einen neuen Ordner, in dem wir unsere Anwendungen aufbewahren werden. Also kann ich hier einfach einen neuen Ordner erstellen. Sie können Ihre Ordner so erstellen, wie Sie möchten. Es spielt keine Rolle und was auch immer Sie wollen, es spielt auch keine Rolle. Und jetzt nenne ich es meine Lern-App. Jetzt, wo Sie unseren Ordner haben, können wir unseren Ordner öffnen und erneut einen neuen Ordner erstellen, in dem wir ihn Server nennen. Und wir haben unsere Ordner erstellt. Also nochmal, wir müssen das mit Visual Studio-Code öffnen. Wenn Sie Ihren Visual Studio-Code im Beitrag haben , können Sie ihn einfach so öffnen. Wenn nicht, werden wir es über das Terminal öffnen. Also lass uns ein Terminal öffnen. Jetzt habe ich mein Terminal und werde zu meinem Desktop navigieren. Und auf meinem Desktop habe ich meinen Ordner, der meine Lern-App genannt wird. Und in diesem Ordner habe ich wieder einen anderen Ordner namens Server. Jetzt kann ich es mit Visual Studio-Code mit diesem einfachen Code, Leerzeichen und dann Punkt öffnen Visual Studio-Code mit diesem einfachen Code, . Und dann haben wir unseren Visual Studio-Code und wir befinden uns hier im richtigen Ordner. Wenn der Befehl cos dot aus irgendeinem Grund Ihr Visual Studio nicht öffnet, können wir das sehr einfach beheben. Öffnen Sie also Ihren Visual Studio-Code auf andere Weise. Klicken Sie also einfach auf die Anwendung , in der Sie sie auf Ihrem System haben, und dann wird sie geöffnet, und dann können Sie hier den Befehl sehen. Also und dann kannst du den Befehl sehen. Auf Macs sollten Shift-Befehl und B in Windows Control, Shift B lauten Öffnen Sie ihn also bitte, und dann können Sie nach Shell suchen Befehl, und da kannst du es schon sehen. Installieren Sie also den Code im Befehlspfad. Also klicken Sie einfach hier und Sie müssen möglicherweise Ihr Terminal neu starten, und dann haben wir diesen Befehl für Sie verfügbar. Jetzt werden wir hier auf unserem Server eine Datei erstellen, und unsere Datei wird Main Dot Pi oder PY Four PyTon heißen In unserem Hauptpunkt Pi werden wir also die erste Route für die FastAPI hinzufügen Wir werden die ersten Pakete aufrufen, die für die FAST-API benötigt werden, sodass wir einfach sagen können, dass wir von der FAST-API aus das schnelle API-Paket importieren Dann müssen wir es benutzen und dann starten wir es in der Konstante, also oben stehen die also oben stehen schnelle API und die geschweiften Klammern, weil es eine Klasse ist Okay, jetzt haben wir die erste Route. Unsere erste Route wird also zum Beispiel eine Get-Route und eine Demo der schnellen API sein. Also sagen wir hinzufügen. Weil wir eine FastAPI-Klasse aufrufen und dann G sagen, haben wir unsere Routen oder Root-Route, haben wir unsere Routen oder die nur ein Schrägstrich sein wird Und dann werden wir innerhalb unserer Get-Methoden eine Sync-Funktion haben Eine Senke ist also eine synchrone Funktion, die in beide Richtungen ausgeführt wird , ohne auf den Rest des Codes zu warten Und dann ist Df das, was wir in Python eine Funktion nennen, und wir sagen deroot Also der Name unserer Funktion, offene Klammern und dann Semikolon, und dann haben wir die Rückgabe und wir geben einfach Nachricht wird also direkt in den Anführungszeichen stehen, und dann kehren wir zur unteren Welt zurück Also, was hier in Byton wichtig ist, wir brauchen immer diese Identifikation, damit der Code ausgeführt werden Wenn wir das so machen, wird es einen Fehler verursachen weil dieser identifizierte Block wirklich notwendig ist Damit unsere App jetzt ausgeführt werden kann, müssen wir eine virtuelle Umgebung erstellen Die virtuelle Umgebung ermöglicht es uns, Python in einer geschlossenen Umgebung auszuführen . Und dafür müssen wir einfach wieder in unser Projekt einsteigen. Ich kann einfach ein Terminal im Sal Studio-Code öffnen. Also hier und dann werde ich nur PyTon oder Python drei sagen. VM für virtuelle Umgebung und dann Dot VM Und warum erstellen wir eine virtuelle Umgebung? In einer virtuellen Umgebung können wir also Versionen von PyTon und sogar unsere Pakete ausführen , ohne vom externen System beeinflusst zu werden Also erstellen wir einfach eine Art Kapselung, also eine Umgebung, in der diese Version von PyTon ausgeführt werden kann , ohne unser System außerhalb zu Version von PyTon ausgeführt werden kann , stören oder zu Konflikten Also hier drücke ich einfach die Eingabetaste. Und da können Sie sehen, dass zwei Ordner erstellt werden. Also die Cache-Cache-Python-Codes und die virtuelle Umgebung, in der die Anwendung ausgeführt wird, und dann in Zukunft die Pakete. Aber dann müssen wir immer noch unsere virtuelle Umgebung ausführen. Um es auszuführen, können wir einfach Source Dot VM BMF Mac sagen. Wenn Sie auf einem Mac sind, ist BM wenn Sie auf Windows sind, sind es Skripte Da wir also einen BM-Ordner haben, kannst du das hier nachschauen. Wir sagen Bin und dann aktivieren wir die virtuelle Umgebung. Drücken Sie also einfach die Eingabetaste. Und wie Sie sehen können, laufen wir jetzt in der virtuellen Umgebung. In dieser virtuellen Umgebung wird also immer dieselbe Version von Python ausgeführt und das Paket wird installiert, ohne dass Sie es bei jeder Änderung in unserem System ändern müssen , was für das, was Sie hier tun möchten, ausreicht. Jetzt können wir endlich unsere Anwendung ausführen. In diesem Fall sagen wir einfach Fast API, Dev und dann die Datei, die wir ausführen möchten. Also wollen wir den Hauptpunkt PI ausführen, wir wollen nur den Hauptpunkt Py ausführen. Also PY für Python, und dann drücken wir einfach die Eingabetaste und die Anwendung läuft. Hier können Sie also zu dieser Route navigieren, und genau das ist es, was unsere Route zurückgibt. Also der Schrägstrich in diesem Fall. Wenn Sie es dann bemerken, haben wir hier auch diese API-Dokumente. FAST-API wird also sofort als Dokument erstellt, und wir können alle unsere Routen überprüfen und unsere Routen sowie die Dokumentation testen, indem wir einfach hier zu dieser URL gehen Also nochmal, wenn ich zu demselben und dann zu einem Dokument gehe, haben wir eine prahlerische FastAPI mit unserer Fäulnis Moment haben wir nur die Wurzel, aber am Ende, im weiteren Verlauf, werden wir hier mehr Routen haben Also hier in den Docks kannst du sehen, du kannst die Route ausprobieren Also, wenn ich es einfach ausführe, werden wir Tests haben , die wir hier einrichten 12. 12. Eine andere Beispiel-Route: Wir können nach einer komplexeren Route suchen , die wir in unserer Anwendung verwenden können. Zuallererst werde ich hier nur ein einfaches Objekt einfügen. diesem Objekt können Sie sehen, dass wir drei Elemente mit Namen und Beschreibung haben. Das wird also quasi unser Artikel-Assistent zur Beschreibung sein , mit dem wir zu einer Seite mit diesen Informationen navigieren können . Ich belasse dieses Objekt in den Ressourcen, sodass Sie es einfach kopieren und in Ihr Projekt einfügen können, sodass Sie nicht alles eingeben müssen. Jetzt müssen wir als Erstes ein weiteres Grow erstellen, wie wir es zuvor getan haben Wir werden es einfach in der App tun. Also nochmal, unsere Fast API-App, und dann sagen wir G und öffnen dann geschweifte Klammern, und wir wollen, dass unsere Route Items heißt Dann Schrägstrich, und dann haben wir für jeden Artikel den Also werden wir diesem ein Argument übergeben, um jedes dieser Elemente zu erhalten Also wiederum müssen wir unsere Funktion und diese Funktion definieren, wir können sie get item nennen und dann werden wir unsere IM-ID übergeben, die in diesem Fall eine Ganzzahl sein wird . Also nehmen wir hier einfach den Typ an. Wir sind immer eine Ganzzahl. Dann schließen wir einfach hier, dann können wir eine Variable mit dem Namen item erstellen, das wären die Itens Also bekommt unser Objekt die ID get und wird es auch bekommen. Also werden wir diese Ian-ID in unserer Funktion übergeben und dann werden wir genau dieselbe Ganzzahl von unserem Objekt erhalten genau dieselbe Ganzzahl von unserem Objekt Und dann machen wir einfach ein bisschen Fehlerbehandlung. Wenn ITN also nicht ist, also wenn wir nicht existieren, können wir einfach einen einfachen Fehler zurückgeben Und dann sagen wir, ITN wurde nicht gefunden. Und das Set wird Fehler 04 sein. 404 ist also normalerweise der nicht gefundene Fehler bei der App-Entwicklung. Aber wenn alles wie erwartet läuft, werden wir den Artikel einfach zurücksenden. Also senden wir einfach den richtigen Artikel zurück. Jetzt können wir speichern und zu unserem Browser zurückkehren. Und wie wir hier sehen, haben wir unsere erste Route, die wir erstellt haben, und dann müssen wir nur noch durch zwei Elemente navigieren. Und wenn wir Ions drücken, nicht gefunden, weil wir die Ganzzahl so einstellen müssen , wie wir es in unserer Funktion gesehen haben. Also nochmal, noch ein Schrägstrich, nehmen wir Punkt Nummer zwei, und das macht keinen Spaß, weil ich vergessen habe, hier ein Stück hinzuzufügen Also sollte es ein Schrägstrich in S und dann der Eintrag 80 sein. Wenn Sie also zu unserem Browser zurückkehren, müssen wir ihn nur aktualisieren und hier haben wir ihn Also nochmal unser zweiter Punkt aus unserer Liste. Wir können die anderen beiden sehen. Also Punkt eins, Punkt eins ist richtig und dann Punkt drei. Also kohosten Sie 800 und dann Slash DGS. Wir haben wieder unseren schnelleren PI Swagger, und hier haben wir Also können wir es einfach hier öffnen. Wir haben unsere Parameter so, dass unsere Route nur die Element-ID verwendet, und dann wird die Element-ID eins, zwei oder drei sein, wie wir sie zuvor festgelegt haben, und wir können es versuchen. Die Box wird geöffnet, damit wir sie testen können, und wir können noch einmal Punkt zwei sagen. Und wenn wir „Ausführen“ sagen, bekommen wir Elemente auf unsere Route und dann das richtige Objekt. Also versuchen wir es noch einmal. Also klar und dann sag Punkt eins, führe aus und ich bin einer, der Richtige. Wenn wir nun Punkt vier setzen, wie wir es zuvor in unserer Rousa getestet haben, können wir es einfach erneut ausführen und wir erhalten die Fehlermeldung 13. 13. Lauf-App mit Uvicorn: Jetzt werden wir UVCorn in unserer Anwendung installieren. UVCorn ist ASGI, also eine synchrone Server-Gateway-Schnittstelle, die so konzipiert ist, dass sie sehr schnell ist, um Anwendungen so zu installieren, dass sie mit optimaler Leistung ausgeführt werden Anwendungen so zu installieren, dass sie mit optimaler Leistung Aber jetzt fragst du mich, warum brauchen wir das? Wir haben unseren Server bereits mit einer normalen schnellen API laufen lassen. Nun, UVCorn bot uns aufgrund der Geschwindigkeit mehr Vorteile Fast API basiert auf ASGI-Standards, und UVCorn unterstützt die Standards vollständig und gewährleistet so eine nahtlose Außerdem bietet UVCorn eine synchrone Unterstützung. Python hat synchrone Funktionen, die eine effiziente Bearbeitung und gleichzeitige Anfragen ermöglichen effiziente Bearbeitung und gleichzeitige Anfragen UVCorn ist auch produktionsbereit und kann E-Loads verarbeiten , sodass es sowohl für die Entwicklung als auch für den Einsatz geeignet sowohl für die Entwicklung als auch Ermöglicht uns auch die einfache Konfiguration der UVCorn-Einstellungen. Die Vorteile für Webanwendungen mit UVCorn liegen also in der Verbesserung der Reaktionszeiten, Skalierbarkeit und der Fähigkeit, mit modernem Python verwendet zu werden Um UVCorn nun in unserer Anwendung zu installieren, wir einfach zu den Hysal Studio-Codes zurück Wir können unseren Server mit Control C stoppen, wir haben unseren Server gestoppt, und dann kann ich unseren Server löschen , damit ihr ihn besser sehen könnt Und dann können wir einfach PIP sagen. PIP ist also der Paketmanager von PyTon, wir installieren unsere Pakete in PyTon install Jetzt können wir einfach die Eingabetaste drücken und das Paket installieren lassen. Nachdem wir also unseren UVCorn installiert haben, können wir die Anwendung damit ausführen In diesem Fall sagen wir einfach UVCorn-Hauptspalte und dann rauf und dann neu laden Dieses Reload-Flag ermöglicht es der Anwendung also , jedes Mal neu zu laden, wenn Wir können dem UVCord auch weitere Optionen hinzufügen. Nehmen wir an, wir wollen es auf einem anderen Port veröffentlichen. Also sagen wir einfach UVCorn-Haupt-App und dann können wir Port sagen Derzeit verwenden wir also den Port 8.000 und wir können einfach 80, 80 sagen, und dann läuft unsere Anwendung auf diesem Aber vorerst werden wir es einfach normal mit einem Reloads-Flag ausführen . Okay. Okay, jetzt läuft unsere Anwendung mit UVCorn. Lass es uns in einem Browser sehen. Und wir haben unsere Dokumente und unsere normale Anwendung laufen. Und lass uns Ins Punkt eins ausprobieren. Und es scheint, dass alles reibungslos gelaufen ist, und jetzt läuft unsere Anwendung mit UVCorn 14. 14. Installieren von Paketen mit Anforderungen: In der vorherigen Vorlesung haben wir das Twinstyle-Paket mit PIP gesehen das Twinstyle-Paket mit PIP Verwenden Sie also BIP Twinstyle-Pakete und Byton. Aber stell dir Folgendes vor. Stellen Sie sich vor, wir haben ein großes Team und das gesamte Team sollte dieselben Pakete verwenden , ohne dass sie einzeln manuell installiert werden. Außerdem werden dieselben Versionen bevorzugt, sodass die Anwendung für alle gleich ausgeführt werden kann. Wie können wir das also tun? In der FAST API können wir also den Anforderungstext hinzufügen, und dann installiert die Anwendung alle Anforderungen über diese Datei. Also hier, in unserer Seitenleiste, erstellen wir eine neue Datei und nennen sie Anforderungstext. Also speichern wir es und dann haben wir eine Textdatei. Und dafür können wir die Pakete hier hinzufügen. Nehmen wir zum Beispiel unsere schnelle API und dann die Paketversion. In diesem Fall haben wir also 0,1, 15 und Null. Mach dir keine Sorgen. Ich werde diese Datei in den Ressourcen belassen. Und bitte, die bevorzugte Methode ist, den Inhalt dieser Datei zu kopieren und hier einzufügen , da die Versionen für Sie zum Zeitpunkt, zu dem Sie sich diesen Kurs ansehen, möglicherweise anders sein könnten für Sie zum Zeitpunkt, zu dem Sie sich diesen Kurs ansehen, möglicherweise anders . Auf diese Weise stellen wir sicher , dass Sie die Anwendung genauso ausführen wie ich. Hier haben wir also die Versionsnummer, aber nehmen wir an, wir wollen die neueste Version verwenden. In diesem Fall brauchen wir nur eine schnelle API, und dann bekommen die Leute das neueste Paket. Also werden wir jetzt die aktuellen Versionen verwenden. Also werde ich sagen, FAST NPI ist Null Punkt 115 Punkt Null. Dann werden wir auch Tensor Flow verwenden , das ist die Version 2.16 Sie können diesen Teil überspringen und einfach die zuvor erwähnten Dateien kopieren Wir brauchen auch einen NPi 1.26 Punkt Vier. Wir werden auch den offenen CV Piton 410, Punkt Null Punkt 84 verwenden Punkt Null Punkt Und dann die UVCorn-Version , die wir zuvor installiert haben. Aber nochmal, also Null Punkt 30 Punkt Sechs, und dann speichern wir die Datei Also, wie installieren wir alles auf einmal? Also nochmal, in unserem Terminal stoppen wir einfach den Server mit Control C, und dann können wir einfach PP Install Air Four Requirements sagen PP Install Air Four Requirements und dann unsere Anforderungen mit Punkttext. Wenn wir jetzt die Eingabetaste drücken , werden alle Pakete installiert. Drücken wir also einfach die Eingabetaste. Und dann hast du es. Also sind alle Pakete installiert, und dann können wir einfach wieder das UviCorn-Hauptmenü starten und dann Wie Sie sehen können, lief alles reibungslos und jetzt sind alle unsere Pakete installiert 15. 15. Was ist React und TypeScript: Stellen Sie sich vor, Sie bauen Ihr Haus. Sie möchten, dass es robust, effizient und einfach zu ändern ist, wenn Sie einen Raum hinzufügen oder ein Layout ändern müssen. In der Welt der Webentwicklung sind React und Typoskript wie die fortschrittlichen Tools und das Blueprint-Set, die Ihnen helfen, dieses Haus zu bauen Fangen wir also mit React an. Stellen Sie sich React als einen Schreinermeister , der sich auf die Herstellung wiederverwendbarer Komponenten spezialisiert hat Anstatt den Raum jedes Mal von Grund auf neu zu bauen, können Sie mit React modulare Teile wie vorgefertigte Wände, Fenster oder sogar ganze Räume erstellen modulare Teile wie vorgefertigte Wände, Fenster oder sogar ganze Das kannst du immer wieder verwenden. Das spart nicht nur Zeit, sondern sorgt auch für Konsistenz in Ihren Haus - oder Webanwendungen. React macht Ihre Website interaktiv und dynamisch. Es ist wie in einem Haus, in dem das Licht automatisch einschaltet wenn Sie Ihr Zimmer betreten, oder dem sich die Temperatur von selbst anpasst in einer React-Anwendung Wenn Sie in einer React-Anwendung auf eine Schaltfläche klicken oder Text eingeben, kann die Seite sofort aktualisiert ohne dass sie komplett neu geladen werden muss Dies sorgt für ein reibungsloses App-Erlebnis für Benutzer. Lassen Sie uns nun über Typoskript sprechen. Wenn React unser Schreinermeister ist, ist Typoskript wie ein superintelligenter Assistent , der alles überprüft, bevor es gebaut TypeScript ist eine Programmiersprache , die auf Javascript aufbaut und Ihrem Code eine zusätzliche Ebene an Sicherheit und Klarheit Stellen Sie sich vor, Sie versuchen, einen quadratischen Stift in ein rundes Loch zu stecken Es funktioniert einfach nicht, oder? Typescript verhindert solche Fehler in Ihrem Code, bevor sie auftreten Es ist, als hätten Sie einen Mann , der sicherstellt, dass Sie für jeden Teil Ihres Hauses das richtige Material verwenden für jeden Teil Ihres Hauses das richtige Material Wenn Sie versehentlich versucht haben, ein Fenster an der Stelle zu benutzen , an der sich eine Tür befinden sollte, informiert Sie Typoskript darüber, bevor Sie überhaupt mit dem Bauen beginnen Das mag kompliziert klingen, macht Ihnen aber auf lange Sicht das Leben leichter Mit Typoskript entdecken Sie Fehler früher, Ihr Kurs wird selbsterklärender und die Arbeit in Teams wird reibungsloser, weil jeder den Bauplan klarer verstehen kann Wenn Sie React Typescript kombinieren, Sie Sie haben die Möglichkeit, dynamische interaktive Webanwendungen mit wiederverwendbaren Komponenten zu erstellen dynamische interaktive Webanwendungen mit wiederverwendbaren Komponenten gleichzeitig über ein Sicherheitsnetz, das potenzielle Fehler auffängt und Ihren Code robuster macht Als Schüler, die in die Webentwicklung eintauchen, stellen Sie sich das Erlernen von React und Typoskript als React gibt Ihnen die Möglichkeit, flexible, effiziente Benutzeroberflächen zu erstellen flexible, effiziente Wild TypeScript bietet Ihnen Röntgensicht, um Probleme zu erkennen und zu verhindern, bevor sie Zusammen stellen sie Ihnen die Tools zur Verfügung, mit denen Sie moderne, zuverlässige Webanwendungen erstellen können, die den Test der Zeit bestehen und das Wachstum Ihrer Projekte skalieren In diesem Kurs werden wir also sowohl React als auch Typoskript verwenden , um unsere Frontend-Anwendung zu erstellen 16. 16. Installieren von Nodejs: Also werden wir jetzt Nojs installieren. Aber was ist kein JS? NoJS ist also eine Open-Source-Close-Plattform, die es Entwicklern ermöglicht, JavaScript-Laufzeitumgebungen zu JavaScript-Laufzeitumgebungen zu verwenden und auszuführen NoJs zu installieren ist also sehr einfach Sie können einfach auf tonjs.org gehen und es wird Ihnen auf der Abwärtsschaltfläche angezeigt Und das hat schon die Version Ihres Systems. Wenn Sie also eine Windows-Umgebung verwenden, sind die Downloads für das Windows-System bestimmt. Wenn Sie einen MAC verwenden, ist dieser auch für macOS verfügbar. Sie müssen nur herunterladen, sicherstellen, dass Sie LTS verwenden, und für unser Projekt hier werden wir immer die Version verwenden, die größer als 20 Zum Zeitpunkt dieses Kurses sollte es also in Ordnung sein Laden Sie also einfach no Js dorthin herunter, wo es Ihnen besser passt, und führen Sie einfach die Datei aus und installieren Sie no Js. Nachdem Sie die Installation von NGS abgeschlossen haben, können Sie ein Terminal öffnen, um die Installation zu überprüfen Möglicherweise müssen Sie Ihr System neu starten, aber das passiert selten In unserem Terminal können wir also die Version von NGS überprüfen, indem wir einfach eine Notiz schreiben Dash-Dash-Version und hier können Sie sehen, dass ich die neueste Version verwende, aber als erweiterte Funktionen brauchen wir sie nicht wirklich, Sie verwenden sie hier oder wir brauchen sie hier nicht wirklich In diesem Fall können Sie also einfach die 20 verwenden, das LTS, das üblich und für den normalen Benutzer besser ist Lassen Sie uns also Ihre Version überprüfen. Sie können Ihre Version auch überprüfen, indem Sie die Tastenkombination verwenden, also kein V. Das Gleiche. Sie können also Ihre Version von no Js hier sehen. 17. 17. Erstelle die erste React-App mit Vite: Jetzt können wir mit der Erstellung unseres Frontends beginnen. Und um unser Frontend zu erstellen, werden wir VT verwenden. T ist also ein Tool, mit dem wir auf einfache Weise Anwendungen mit React, View usw. erstellen können. Sogar Vanille-JavaScript-Anwendungen. Das Framework ermöglicht uns ein schnelles Gerüst die Anwendungen sowie ein schnelles Erstellen und Um also eine Anwendung zu erstellen, also gehen wir zurück zu unserem Terminal in unserem Terminal, wir befinden uns in unserem Also gehen wir einfach eine Ebene runter, also CD Punkt Punkt. Und dann sind wir in unserem Projektordner, und dann können wir einfach NPM machen, t erstellen und dann sagen wir einfach spätestens, damit wir die neueste Version installieren können Also drückst du einfach die Eingabetaste und dann sagen wir ja Der Projektname, wir werden ihn aus Gründen der Objekterkennung nennen , ein Packers-Name kann derselbe bleiben. Und dann haben wir alle Optionen , mit denen wir unsere Anwendung erstellen können. In diesem Fall wählen Sie einfach die Option „Reaktion“ aus, verwenden die Pfeiltasten, um zu navigieren, zu reagieren, und dann verwenden wir auch Typoskript, und unsere Anwendung ist installiert Jetzt können wir zum Anwendungsordner navigieren. Sehen Sie sich also die Objekterkennungs-App an. Geben Sie ein, und dann öffnen wir es mit unserem Visual Studio-Code, also Code und dann Punkt. Und jetzt, wo wir unsere Anwendung mit Visual Studio-Code öffnen , müssen wir unsere Pakete installieren. Jetzt werden wir unser Terminal in unserem Visual Studio-Code öffnen . Und wenn aus irgendeinem Grund die Option zum Öffnen des Terminals in Ihren Einstellungen dort nicht angezeigt wird, können Sie einfach Shift Control P unter Windows oder Command, Shift P auf Mac sagen . Und dann hast du ein Drop-down-Menü und kannst einfach Toggle schreiben. Terminal. Und hier haben wir die Möglichkeit, das Terminal zu öffnen, und Sie drücken einfach die Eingabetaste, und das neue Terminal wird für Sie angezeigt. Und wir befinden uns in unserem Projektordner. Wir können einfach NPM install sagen , um das Paket zu installieren, oder kurz NPMI Also lasst uns das Paket installieren und es laufen lassen. Jetzt sind die Pakete installiert. Wir können unsere Anwendung ausführen. Und in diesem Fall von WVD laufen wir einfach auf NPM taub, laufen wir einfach auf NPM um den Entwicklungsmodus auszuführen, wie wir hier sehen können unserem Paket Jason erfahren Sie, wie Sie die Anwendung im Death-Modus ausführen, wie Sie unsere Anwendung erstellen, Leading ausführen und sogar eine Vorschau im Build-Modus , Leading ausführen und sogar eine Vorschau Also lasst uns das schließen und NPM run Def ausführen. Nachdem es erstellt wurde, sehen Sie, dass Sie unser lokales Verzeichnis haben, in dem die Anwendung ausgeführt wird Kopieren wir das einfach und gehen wir zu unserem Browser, und dann sehen wir, dass unsere VID- und React-Anwendung ausgeführt wird. 18. 18. Bildsteuerungskomponente und Stil: Was das Haupt-Frontend angeht, können wir zu den Kosten für Visual Studio zurückkehren, und in unserer Quelle haben wir diese App Dot TSX, das ist unser Einstiegspunkt, und wir werden hier einige Dinge nicht benötigen Ich werde Termot einfach schließen oder ein bisschen löschen und wir brauchen diesen Tee nicht Und wir können alles innerhalb unserer Rückkehr löschen. Wie Sie sehen, werden diese Pakete auch nicht verwendet, sodass wir sie auch löschen können. Und vorerst lassen wir es so. Also B hier, wir werden einen neuen Ordner erstellen, also Icon hier, und wir nennen es Komponenten innerhalb Komponenten, weil unsere Anwendung sehr einfach ist. Auf der Frontend-Seite können wir einfach eine Komponente erstellen und dann eine neue Datei erstellen und wir nennen sie Image Control Dot TSX für das Typoskript Und weil wir auch CSS benötigen, können wir eine neue Datei erstellen und sie einfach Indexpunkt-CSS nennen Nun, zurück zu unserer Komponente, dem Image Control TSX, müssen wir unser Template erstellen Dafür importieren wir zuerst unsere CSS-Datei, also sagen wir Import Indexieren Sie CSS und dann erstellen wir unsere Komponenten, sagen wir die Kosten. Und unsere Komponente wird nur die Bildsteuerung sein. Und als funktionale Komponente erstellen wir die R-Funktion dafür und geben dann einfach etwas zurück, was vorerst nur ein Div sein kann. Da unser Bildsteuerelement noch nicht verwendet wird, müssen wir es exportieren, um es in upTTSX zu Sprich Standard-Bildsteuerelement exportieren. Ich werde es speichern. Und dann können wir auf unserem PTSx in unserer Rückkehr die Komponente verwenden, um beispielsweise ein Bild zu erstellen Steuerung. Und wie Sie hier sehen können, sagt mein Visual Studio bereits, dass die Bildsteuerung für Komponenten importiert werden soll, die Bildsteuerung. Und dann, wie Sie sehen können, haben Sie gerade die Bildsteuerung aus unserem Komponentenordner und unserer Komponente importiert . Dann ruft die App an und die App Dot TSX ist vorerst fertig. Und wir können zu unserer Hauptkomponente zurückkehren, denn wenn Sie zum Browser zurückkehren , sehen Sie, dass dieser leer ist, weil wir noch nichts rendern Also hin und wieder, weil es eine einfache AT-App ist, werde ich einfach etwas CSS für unsere Anwendung einfügen. Ich werde diese CSS-Datei in den Ressourcen belassen , damit wir sie einfach kopieren und hier einfügen können . Also nur Standard-CSS für unsere Container und unseren Image-Container. Ich speichere es einfach und dann haben wir Zugriff auf diese Klassen in unserer Komponente. Und zuerst werden wir unsere Container erstellen, damit wir anfangen können, etwas in der App zu sehen. Also verwenden wir dieses DIF und weil wir mehr als einen Container und mehr als eine DV verwenden hier in der Vorlage mehr als einen Container und mehr als eine DV verwenden werden, benötigen wir eine Also öffne Klammern und ich kann einfach ausschneiden und hierher kopieren, und dieses Div wird den Klassennamen Container haben Aus unserer CSS-Datei haben wir also diese Containerklasse dann mit diesem Div fortfahren, haben wir ein weiteres Div , das unser innerer Container ist. Unser Klassenname wird also innerer Container sein. Im Moment können wir es einfach speichern. Ich habe hier einen Tippfehler, also ist es ein Container. Wenn nicht, funktioniert der Kurs nicht. Dann kann ich hier einfach ein einfaches Ptag einfügen , um zu sehen, wie unsere Anwendung läuft Zurück zu unserem Browser, wir sehen, dass bereits hier auf unserem Bildschirm in unserer Anwendung ausgeführt wird, was bedeutet, dass alles korrekt ist 19. 19. Einstellen unserer Zustandsvariablen: Zuallererst müssen wir also unsere Zustandsvariablen so setzen , dass wir sie innerhalb unserer Logik innerhalb unserer Komponente verwenden können . Also brauchen wir zuerst die Bildstatusvariable, also heißt es Kosten, Bild, und dann heißt es Bild setzen. Und dieses Bild wird eine Zeichenfolge sein. also von unserem Backend kommen, schreiben wir einfach eine Zeichenfolge für Bild und sagen dann use state und öffnen dann Klammern Jetzt müssen wir den Verwendungsstatus importieren, damit wir ihn verwenden können. Also lassen wir den Import-Index ESS unten und sagen oben Import, Use State, und das kommt von React. Jetzt können wir speichern und müssen den Typ unseres Bildes festlegen. Im Moment haben wir also keinen Typ für unser Bild, nichts, wenn die Komponente startet. Wir wollen also , dass dieses Bild eine Zeichenfolge vom Typ Oder Null hat, weil wir am Anfang kein Bild haben, also kann es Null sein und wir setzen den Anfangsstatus auf Null. Wir benötigen auch eine Zustandsvariable für die Datei, die wir an das Frontend und dann an das Backend übertragen werden, damit wir die Vorhersage und die Ergebnisse erhalten können die Vorhersage und die Ergebnisse erhalten Also nochmal, Kosten und wir haben die selektive Datei, und wir sagen Set Selected Datei. Und wieder, benutze State. Und in diesem Fall benötigen wir einen speziellen Typ, nämlich Datei, die alle Dateieigenschaften enthält. Und wir wollen auch , dass es Null oder Null ist. Dann löschen wir das, was wir nicht brauchen, und dann schließen wir einfach die Klammern und setzen den Anfangsstatus auf Null, weil wir am Anfang keine Datei ausgewählt haben. Und um jetzt in unserem Frontend fortzufahren, müssen wir auch drei weitere Variablen setzen , die später geändert werden. Aber wie dem auch sei, wir werden es jetzt einstellen, damit Sie sehen können, wie es funktioniert. In diesem Fall benötigen wir also eine Vorhersage. In diesem Fall müssen wir jedoch keine Zustandsvariable sein. Wir können einfach eine normale Const-Say-Vorhersage festlegen. Das ist ein Array und wir setzen auf ein leeres Array. Wir brauchen auch das Laden. Wenn also unsere Anwendung geladen wird und in diesem Fall ein Edelmetall ist, setzen wir den Wert auf False Und der letzte wird ein Fehler sein. Also sagen wir cost error, auch boolean, also zu word false und dann setzen wir es auch auf Diese drei Variablen werden also später in unseren Hook übernommen , wo wir die Anfragen unterordnen und in der Vorlage festgelegt werden Aber vorerst werden wir es einfach so einstellen, damit es in unserer Vorlage verwendet werden kann. 20. 20. Vorhersage- und Bildboxen-Vorlage: Fahren Sie jetzt damit fort, unser grundlegendes Frontend zu erstellen unser grundlegendes Frontend , in dem wir die Schaltfläche haben, um das Bild zu applaudieren, ein Feld, in dem das Bild gerendert wird. Und auch die Zahl der Vorhersagen, wir löschen einfach dieses P hier, und dann sagen wir, lockige Klammern öffnen und sagen, ob wir kein Bild haben Wenn das Bild also Null oder undefiniert ist oder es leer ist, sagen wir einfach Und N, sagen wir, öffne ein B und du sagst, bitte applaudiere deinem Bild Also lass es uns einfach speichern und sehen, was im Frontend passiert. Und wir haben eine Nachricht mit der Aufschrift: Bitte lade dein Bild hoch. So weit so gut. Fahren Sie hier fort. Aber wenn wir ein Bild haben, kommen wir immer wieder hierher, ziehen geschweifte Klammern und sagen, dass Bild existiert, also öffnen wir jetzt einfach Klammern und ein DIV und diesen Dv liebten Klassennamen des Bildcontainers aus Und dann öffnen wir das Bild-Tag , das die Quelle unserer Bildvariablen , das die Quelle Hier seht ihr also schon, dass es hervorgehoben erscheint. Es bedeutet also, dass es verwendet wird. Bei können wir einfach so etwas wie Applaus sagen und der Klassenname ist das Bild, unsere CSS-Klasse, und dann das Tag schließen. Und wir speichern einfach, nichts wird im Frontend erscheinen , weil wir immer noch kein Bild haben. also im selben Container weitermachen, werden wir unsere Pervition haben Also sagen wir noch einmal, Curlbra sagt, wenn die Prevition existiert, nehmen wir das erste Element unseres Arrays, und Sie werden später sehen, warum, aber aus diesem Grund legen wir es als Array fest Curlbra sagt, wenn die Prevition existiert, nehmen wir das erste Element unseres Arrays, und Sie werden später sehen, warum, aber aus diesem Grund legen wir es als Array fest. In diesem Fall ist es leer Und wieder öffnen wir Asse und öffnen ein Div-Div mit dem Klassennamen der Vorhersagebox. Unser Vorhersagefeld wird also die Informationen enthalten, die aus der Produktion selbst stammen . Schließen Sie das Div und darin haben wir eine PTA mit dem Klassennamen Kategorietext geht wieder und der Kategorietext den Text aus der Vorhersage, die wir in diesem Fall wieder öffnen, die geschweiften Klammern, und dieser kommt aus dem Backend Es wird also in unserer Anfrage auf unserem Backend gerendert. Und wir haben die Vorhersage von Null, das ist immer noch ein Fehler, weil wir dort immer noch keinen definierten Typ haben , aber es ist in Ordnung. Kategorie Vorhersage, und wir wollen, dass alles in Großbuchstaben geschrieben wird. Sagen wir also zwei Großbuchstaben. Und damit N diese Fehler Ihrer Anwendung verschwinden, können wir einfach zu unserem konstanten Satz zurückkehren. Wir wollen ein Array von beliebigen. Also wird hier jeder Typ verwendet. Dies ist ein Fehler bei DST B mit einem Lentin, der keine Typen zulässt, aber das wird sich später ändern Für Null spielt es keine Rolle. Und so haben wir hier keinen Fehler. Aber wenn wir das Jahr fortsetzen, wieder rückläufig, eröffnen wir eine weitere PTA, die den Klassennamen „Genauigkeit“ tragen wird den Klassennamen „Genauigkeit“ tragen Es wird also um die Genauigkeit der Vorhersage gehen. Das wird mit dem Bild angegriffen, und dann schließen wir, und dann wieder runter, wir sagen Clibrass, öffnet wieder Klammern und wir sagen Vorhersage Auch hier wollen wir, ausgehend vom ersten Element unseres Arrays, eine Punktzahl Mal eins und weil wir als Prozentzahl erstellen wollen, und dann sagen wir zwei feste Eins. Also weil es eine große Zahl sein wird und wir sie als Prozentwert umwandeln wollen. Außerhalb der Karibren sagen wir dann Prozent, Prozent, Genauigkeit Aber das wird später gezeigt, wie es genau funktioniert. Jetzt fragst du dich also, was in unserem Frontend passiert . Also lass uns nachsehen. Also immer noch nichts , weil wir kein Bild haben, das wir zeigen könnten. Jetzt sehe ich, dass der Container etwas nach rechts ist, und das liegt daran, dass wir die Breite so eingestellt haben, dass wir zurückgehen können. Und in unserem Index-CSS löschen wir einfach das w und speichern es. Und jetzt ist es genau in der Mitte. also zu unserer Bildsteuerung zurückzukehren, müssen wir den Container für den Fehler festlegen. Nach diesem Div, das ist unsere Vorhersage und die geschweiften Klammern für unsere Vorhersage, geben wir hier etwas Platz und wir sagen Fehler, wieder geschweifte Klammern und dann Fehler, P, und dann haben diese Leute den Klassennamen Und dann schließen wir es und dann innerlich lieben wir den Fehler, der sich dann aus unserer Anfrage ergibt . Im Moment ist es einfach falsch. Es sollte nicht falsch sein, aber es sollte stattdessen eine Zeichenfolge sein und du sagst, Zeichenfolge, wir sagen, kein Fehler. Iss hier einfach ein bisschen rein. Danach haben wir unseren Input, um das Bild hochzuladen. 21. 21. Bild-Upload-Eingang: Nun zu unserer Eingabe, bei der wir das Bild direkt von unserem System in die Anwendung hochladen . Nach dem Fehler hier werden wir das Eingabe-Tag öffnen, also Eingabe. Und der Typ dieser Eingabe wird eine Datei sein , weil wir eine Datei aus dem System hochladen werden. In diesem Fall also Bilddatei, und wir sagen bei Änderung, das wird das Änderungsereignis unserer Eingabe haben. Aber jetzt setzen wir in diesem Fall einfach eine leere Funktion, damit wir keine Fehler haben. Und dann sagen wir, akzeptiere das Bild. Bilder in diesem Fall wollen wir jetzt alle Arten von Bildern. Setzen Sie also einfach einen Stern und alle Bildtypen werden akzeptiert. Und dann schließen wir das Eingabe-Tag. Ganz unten wollen wir eine Schaltfläche , wir mit dem Einfügen des Bildes fortfahren. Also Button und wir sagen OnClick. Und wieder, weil wir die Funktion für den Klick noch nicht haben, erstellen wir einfach eine leere Funktion und sagen dann, dass wir sie deaktivieren, wird diese Schaltfläche deaktiviert wenn wir keine Auswahldatei haben Oder wenn es geladen wird. Wenn wir also keine Datei mit der Anfrage haben , dass die Anwendung geladen wird, wird die Schaltfläche deaktiviert. Und dann schließen wir die Schaltfläche, und dann haben wir in der Schaltfläche den Text, den wir benötigen, und der Text ändert sich je nach Status der Anwendung und dem Applaus des Bildes. Also nochmal, Karibiren sagen wir, wenn sie geladen wird, sagen wir Applaus beim Verlieren. Wenn es kein Kleidungsstück ist und wir ein Bild haben, wollen wir, dass der Button sagt, dass das Bild identifiziert oder identifiziert damit wir eine Prognose haben können Aber wenn nicht, wollen wir, dass auf der Schaltfläche ein Plosimage steht, und die Funktionen werden anders sein Wenn wir jetzt speichern und zu unserem Browser gehen, sagen wir schon hier dass wir etwas auf dem Bildschirm haben Also hier haben wir die Schaltfläche , um die Datei auszuwählen. Also unsere Eingabe Und wenn du klickst, öffnet sich ein Fenster, in dem wir unsere Bilder überprüfen können und die Blosimage-Schaltfläche ist deaktiviert, weil wir kein Bild haben Hier wird kein Fehler angezeigt, weil wir es als Bullion-Fehler gesetzt haben , der existiert, und in unserem Fall existiert er wirklich Aber wenn Sie, sagen wir, Null eingeben, wird ein Fehler ausgegeben, weil es eine Zeichenfolge sein muss, oder Null, wird es nicht angezeigt 22. 22. Tensorflow SSDMobileNetV2 und COCO DataSet erklären: Jetzt werfen wir einen kurzen Blick auf die Pakete oder Lernmodelle, die wir im Frontend verwenden werden Zuallererst Tensor Flow von Google entwickelt und ist eine leistungsstarke Open-Source-Softwarebibliothek für maschinelles Lernen und künstliche Intelligenz Es ist die Grundlage, die es Computern ermöglicht , aus Daten zu lernen und Entscheidungen zu treffen Ingenieure und Forscher verwenden Tensorflow, um neuronale Netzwerke für Aufgaben wie Bilderkennung, Verarbeitung natürlicher Sprache und in unserem Fall Objekterkennung aufzubauen und zu trainieren für Aufgaben wie Bilderkennung, Verarbeitung natürlicher Sprache und in unserem Fall Objekterkennung aufzubauen und Das hier zu verwendende SStAM von A Net Version Two ist eine spezielle neuronale Netzwerkarchitektur, die für die Objekterkennung entwickelt wurde Es ist eine clevere Kombination aus zwei Konzepten. Also SSD, Single Shot Detector und Mobile Net Version zwei. SSD ermöglicht es einem Netzwerk, mehrere Objekte in einem Bild und in einem Vorwärtsdurchgang zu erkennen , was es schnell und effizient macht. Mobile Net Version 2 ist eine schlanke Netzwerkstruktur , die sowohl für mobile Geräte als auch für Browser optimiert ist und sicherstellt, dass das Modell auch auf Smartphones, eingebetteten Systemen und Speichercomputern schnell ausgeführt werden kann auch auf Smartphones, , die sowohl für mobile Geräte als auch für Browser optimiert ist und sicherstellt, dass das Modell auch auf Smartphones, eingebetteten Systemen und Speichercomputern schnell ausgeführt werden kann. The Coco, die gemeinsamen Objekte im Kontext Der Coco-Datensatz ist eine große Sammlung von Bildern, die als Lehrbuch für das Training von Objekterkennungsmodellen dienen für das Training von Objekterkennungsmodellen Er enthält über 330.000 Bilder mit mehr als 2,5 Millionen beschrifteten Instanzen von Objekten in 80 Kategorien Diese Kategorien reichen von gewöhnlichen Objekten wie Autos und Hunden bis hin zu spezielleren Objekten wie Ampeln und Tennisschlägern In Kombination bilden diese drei Komponenten ein leistungsstarkes System zur Objekterkennung in der realen Welt TensorFlow bietet die Tools und die Umgebung, um das Modell der Version 2 des SST Mobile Net unter Verwendung des Coco-Datensatzes zu erstellen und zu trainieren Modell der Version 2 des SST Mobile Net unter Verwendung des Coco-Datensatzes Das Ergebnis ist ein schneller, effizienter Objektdetektor. Dadurch können schnell mehrere Objekte in Bildern oder Videostreams identifiziert und erstellt werden, selbst auf Mobilgeräten. Diese Technologie hat zahlreiche praktische Anwendungen. Sie wird in autonomen Fahrzeugen zur Identifizierung von Verkehrsschildern und Fußgängern sowie in Sicherheitssystemen zur Erkennung verdächtiger Objekte oder Im Einzelhandel, für das Umweltmanagement und sogar in Augmented-Reality-Apps zur Erkennung von Objekten aus der realen Welt und zur Interaktion mit ihnen Die Geschwindigkeit und Effizienz von SSD Mobile Net Reversion Kombination mit einem umfassenden Training anhand des Coco-Datensatzes machen es besonders nützlich für Echtzeitanwendungen, machen es besonders nützlich bei denen eine schnelle genaue Objekterkennung entscheidend ist 23. 23. Hinzufügen von MobileNetV2 SSD COCO Model DataSet: Jetzt können wir damit beginnen, das Vorhersagemodell und den Datensatz zu unserer Anwendung hinzuzufügen das Vorhersagemodell und den Datensatz zu Also werden wir dieses Tensor-Flow-Lernmodell mit einem Coco-Datensatz verwenden mit einem Coco-Datensatz Also lasse ich diesen Link in der Beschreibung. Sie müssen lediglich zu dieser Github-Seite navigieren, und dann werden wir hier genau dieses Modell verwenden. Also die SSD, das Mobilfunknetz Vt Coco. Also klicken wir einfach auf den Link und dann erhalten Sie wahrscheinlich eine Sicherheitswarnung, aber Sie werden einfach auf die Seite weitergehen. Nachdem Sie das Modell heruntergeladen haben, haben Sie also eine ZIP-Datei wie diese. Wir werden es einfach extrahieren. Und dann lieben wir den Ordner, den wir wollen. Kopieren Sie den Ordner einfach in unser Serverprojekt, also in den Serverordner , den wir zuvor für unser Backend erstellt haben. Und dann müssen wir hier nur den Titel bearbeiten und das Erstellungsdatum entfernen und am Ende einfach Coco stehen lassen. Jetzt können wir also speichern und dann zurück zu unserer Anwendung gehen. Wir haben also, wo unser Code für unseren Server läuft, also unser Backend. Und wir können hier sehen, dass wir unser Modell bereits integriert haben und es jetzt noch in unsere Anwendung übergeben müssen. 24. 24. Vortrainiertes Modell in die App laden: Also zurück zu unserem Code Als Erstes löschen wir einfach einen Teil des Codes Wir können einfach die Root-Route nur zum Testen verlassen und alles andere löschen und dann speichern, und wir werden den Datensatz importieren , den wir gerade zu unserem Projekt hinzugefügt haben. Zuallererst müssen wir also die Umgebung dafür schaffen. Wir müssen also das Betriebssystem importieren, damit wir unser Betriebssystem erkennen und den Zugriff auf alle Punkte ermöglichen können. Danach machen wir einfach das Betriebssystem, das wir importiert haben, und dann Punkt environ Und dann öffnen wir hier die eckigen Klammern und dann stellen wir unseren Tensorfluss so ein, dass alles in Großbuchstaben aktiviert wird, also aktivieren wir ein D und N, die Optimalen Ds, und Optimalen Ds, wir werden diese Das soll es der Umgebung ermöglichen, den Tensorfluss später auszuführen Dann müssen wir also auch den Tensorfluss importieren. Und dafür werden wir es hier oben machen. Also sagen wir einfach, Import TensorFlow hat Tensorflow. Denken Sie daran, dass Sie den Tensorflow früher installiert haben und wir dem vorherigen Video eine Erklärung hinzufügen Dann haben wir den Tensorflow importiert. Wir müssen die Variablen festlegen, damit wir dieses Modell in unserem Projekt verwenden können dieses Modell in unserem Projekt Gleich nachdem wir unsere Umgebung eingerichtet haben, müssen wir zuerst unser Modell aufrufen. Also erstellen wir in diesem Fall einfach eine Umgebungsvariable mit Großbuchstaben, modellieren dort. Und hier wollen wir das gespeicherte Modell und die Größe unseres Mobilnetzordners aufrufen das gespeicherte Modell und die Größe unseres , der zuvor gelöscht wurde In diesem Fall öffnen wir einfach Anführungszeichen und sagen SSD, und sie wäre klein geschrieben. Also sagen wir einfach SS D. Mobile Net Version zwei, Coco Saved Model. Bitte stellen Sie sicher, dass dieser Pfad genau dem entspricht , den Sie hier geschrieben haben, denn Sie erinnern sich, dass wir das Datum gerade gelöscht Wenn Sie das Datum jedoch verlassen haben, müssen Sie den Rest hier hinzufügen. Dann müssen wir das Modell des Tensorflusses festlegen. Also sagen wir Modell und dann hat TF das Modell geladen. Eine Schnur zu sein, und wir werden da unsere Schnauze verlieren Also das Verzeichnis unseres Modells. Dies stellt also sicher, dass wir das Serienmodell ausführen. Unser vorgeneriertes Modell geht also aus dem Tensorfluss und dem Mobilfunknetz V zwei in diese Variable Und dann müssen wir das Modell signieren, das abgeleitet werden soll, damit wir es in diesem Fall als Standard verwenden können, und es gibt viele Optionen, aber in diesem Fall werden wir es als Also sagen wir einfach, unsere Variable ableiten und dann Punktsignaturen modellieren und dann eckige Klammern öffnen, und wir sagen, dass standardmäßig bedient wird. Also speichere es Und jetzt haben wir unseren Maulkorb an Variablen in unserer Anwendung verloren , und als Nächstes werden wir sehen, wie wir sie verwenden 25. 25. Führen Sie die Inferenzfunktion aus: Und jetzt sind wir bereit, unsere erste Funktion zu erstellen, also unsere Run-Interferenz-Funktion Und diese Funktion ist so konzipiert, dass sie die Objekterkennung auf dem gegebenen Bild mithilfe des Tensorflusses vor dem Verlust durchführt dem gegebenen Bild mithilfe , den wir hier hinzugefügt haben Diese Funktion sorgt dafür, dass das Bild im richtigen Format für das Modell vorbereitet wird, führt dann die Interferenz durch und gibt dann die Ergebnisse zurück Dann geben wir auch das Feld mit dem Hinweis zurück , dass wir die Objekte wie Begrenzungsrahmen, Klassenbeschriftungen und den Konfidenzwert , den wir in unserem Frontend verwenden werden, lieben Klassenbeschriftungen und den Konfidenzwert , den wir in unserem Frontend verwenden Und dann dienen diese Funktionen als Brücke zwischen dem Rohbild, das wir hochladen werden, und dem Objekterkennungsmodell, das wir hier hinzugefügt haben Um damit zu beginnen, werden wir einfach damit beginnen eine neue Funktion zu erstellen, also Python-Funktion, wir verwenden DF, dann nennen wir sie einfach run inference oder run inference Und wir nehmen und diese Funktion nimmt ein Bild als Argument Und der Typ dieses Bildes soll NPi sein. Und D-Array. Jetzt müssen wir nur noch die Zahl Pi importieren. Also zurück zu unseren Importen, wir öffnen einen neuen Wein und sagen Import Num Pi S&P. Jetzt ist der Fehler hier weg Wir haben die Zahl Pi, wir sagen alles über die NumPi, sogar die Dokumentation falls Sie mehr Informationen dazu haben wollen Und diese Funktion gibt ein Zeichenkettenwörterbuch zurück, und dann machen wir vorerst einfach ein beliebiges Also brauchen wir nur ein Wörterbuch, offene eckige Klammern, und wir fügen die Zeichenfolge als Bezeichnung oder Namen hinzu, und dann fügen wir einfach eine beliebige Größe hinzu. Und dann schließen wir einfach die Funktion. Und jetzt siehst du hier, wir haben diese beiden Fehler, weil beide nicht definiert sind, also müssen wir zu unseren Importen zurückkehren und die Eingabe importieren. Aus der Eingabe importieren wir also die Auszüge von Wörterbuch und N. Und hier habe ich einen Tippfehler Es ist kein Tippen, sondern Tippen, also jetzt ist es korrekt und die Fehler hier sind weg. Also setzen wir unsere Funktion fort und gehen hinein. Seien Sie vorsichtig. Auch hier brauchen wir diese Identifikation in Piton und wir setzen einfach unsere erste Variable, den Eingangstensor, der einen Tensorfluss annimmt, und wir konvertieren ihn in einen Tensor Und das muss unserem Bild entsprechen. Das ist also im Grunde die Vorbereitung oder Konvertierung des Numpy-Arrays Also dieses Bild hier, zu einem Tensorflusstensor, das ist eine notwendige Eingabe für das Objektdatenmodell, das der Tensorfluss benötigt, um Objektdatenmodell, das der das Bild zu erkennen Im Grunde konvertieren wir also unser NumPi-Array in einen Tensor-Flow-Tensor, also in einen Tensor Und doch habe ich vergessen, nach dem Fehler zu fragen, also den Tensor einzugeben. Als Nächstes weisen wir unserem Eingangstensor unseren Eingangstensor von zuvor zu. Also dieser Und wir haben die eckigen Klammern wieder geöffnet und du sagst Tensor Flow, Neue Achse Und dann verteilen und unsere zweite Variable ist fertig. Und was bedeutet das? Das verleiht dem Tensor eine zusätzliche Dimension, also unserer ziemlich feinen Figur Tensor erzeugt einen Stapel der Größe eins. Viele Modelle erwarten, dass die Eingaben stapelweise erfolgen, auch wenn es sich nur um ein Bild Deshalb müssen wir diese Stapel erstellen um sie an die Eingabe unseres Modells weiterzugeben Und dann werden wir für die Erkennungsvariable den Eingangssensor ableiten, den wir den Also, was bedeutet das hier? Folgern Sie also, dass diese Schlussfolgerung aus unserer Modellsignatur stammt, aus unserem vorinstallierten und vortrainierten Modell Und dieses Modell läuft von selbst, verarbeitet das Bild und gibt seine Erkennungen zurück Nachdem wir uns also um das Bild gekümmert und es richtig behandelt haben, werden wir zu unserem Modell übergehen, das die Erkennung übernimmt Also auch hier habe ich die S- und B-Erkennungen vergessen , weil es mehr als eine Und dann müssen wir im Grunde nur diese Erkennungen zurückgeben Jetzt sind wir bereit, diese Funktion in der Route zu verwenden. 26. 26. Route vorhersagen: Jetzt sind wir also bereit, unsere Route zu erstellen , um die Vorhersagen in unserem Frontend zu erhalten. Und dafür und weil es eine Post-Anfrage sein wird, müssen wir das direkt nach unserer App tun , wo wir unsere schnelle API-App definieren. Also können wir einfach bei up sagen, also von der schnellen API und dann posten. Also wird es eine Post-Anfrage geben. Und der Name, den wir für unsere Route haben, kann einfach vorhergesagt werden. Die Route ist also definiert. Jetzt brauchen wir die Funktionalität für sich. Wir werden also eine Sync-Funktion haben, um während des gesamten Kurses synchron zu sein und die Funktionalität zu vertiefen Und dann nennen wir es Predict. Und was unsere Funktion aufnehmen muss, welche Art von Dateien sie aufnehmen muss. Also brauchen wir eine Datei. Also das Bild, das wir auf das Frontend hochladen werden und dann, welchen Typ diese Datei haben soll In diesem Fall sollte es sich also ein BlothFle handeln, das um ein BlothFle handeln, das einer Datei mit einem Spread entspricht, alles darin sein kann, und dann kehren wir zurück oder wir wollten zur JSON-Antwort zurückkehren Also geben wir unsere JSON-Antwort zurück , damit wir sie dann im Frontend bearbeiten können Aber andererseits sehen wir hier einige Fehler, was bedeutet, dass wir sie noch nicht importiert Gehen wir also zurück zum Anfang. Und von unserer FAST-API benötigen wir auch die Datei und die Upload-Datei. Beide stammen also aus dem schnellen API-Import. Und dann brauchen wir auch die JCNRSPONSE, weil es das einzige fehlende Jahr ist , das wir Und dafür öffnen wir einfach ein weiteres Weinjahr und sagen aus der FAST-API und dann aus den Antworten der FAST-API, und dann aus den Antworten der wir JCNRSPONSE importieren wollen und Um mit unserer Funktion fortzufahren, müssen wir zunächst eine Variable erstellen, um auf unsere Antwort zu warten Also können wir die Variable einfach content oder contents aufrufen die Variable einfach content oder contents , weil es mehr als ein Inhalt sein wird, und dann sagen wir, warte, und wir sagen file res. Also Python-Funktion, die unsere Datei wiederherstellt, also der Upload-Dateityp. Dadurch kann die Datei asynchron hochgeladen und gelesen werden Dann müssen wir die Dateien, die wir hochladen, in ein Bild konvertieren , z. B. von einem Numpi-Array und dann in ein RGB-Bild konvertieren einem Numpi-Array und dann in ein RGB-Bild Also, wie machen wir das? Zuerst nochmal, hier unten, wir nennen es einfach Bild. Das ist meine Variable, und sie wird dem Numpi-Array entsprechen , dann haben wir die SV Two Die beiden SV sind die Codes für das Bild und dann sagen wir EMD E-Code S V two wird also hauptsächlich zum Laden von Bildern oder zur Laden von Bildern oder Farbraumkonvertierung und zur möglichen Größenänderung des Bildes Hier booten wir also das Bild oder konvertieren das Bild, genau in die Größe oder den genauen Typ, Größe, die Farben, die wir begrüßen wollen In diesem Fall haben wir also das C V, bei dem wiederum ein Fehler auftritt. Wir müssen es importieren. Also lass uns wieder nach oben gehen. Und lassen Sie uns dem hier eine neue Zeile geben. Dann sagen wir Import, wie wir es tun. Und hier müssen wir das ein bisschen bereinigen. Geben wir die Importe von zusammen und die einzelnen Importe auch zusammen an. Also lasst uns das einfach aufräumen. Um sauberer und spezifischer zu sein. Gleiche gilt hier für OS, und jetzt haben wir einen sauberen und besser organisierten Code. Also zurück zu unserer Funktion, der Fehler ist weg. Und innerhalb unserer EM-Bilddekodierung öffnen wir wieder weitere Klammern, und wieder wollen wir aus unserem Numpi, das wir aus unserem Puffer wollen, unseren Inhalt in Num Pi Integer oder U Integer 8 konvertieren Num Pi Integer oder U Integer 8 Also mit acht Zeichen. Und dann fahren wir hier fort, setzen Sie einfach ein Koma und wieder die SV zwei, und wir sagen, das Bild war farbig, damit wir auch die Farbe bekommen können. Weil das Bild Farben enthält und das Modell dann die exakten RGB-Farben benötigt , um die Erkennung zu erleichtern. Und damit werden wir diese Farben wieder einstellen. Also müssen wir die BGR in RGB-Farben konvertieren. Also können wir hier eine neue Variable setzen, also sagen wir Bild RGB Das wollen wir bekommen. Nochmals, von SV zwei, und du sagst SVT-Farbe Das ist also eine Funktion oder eine Klasse, die von SV Two kommt. Und dann haben wir unser Bild , zu dem wir konvertieren, hier übergeben. Und dann sagen wir SV zwei und ich sage Farbe. Und weil es BGR ist, sagen wir BGR zu RGB Deshalb stellen wir sicher , dass die Farben, bevor wir das Bild an das Modell senden , als RBG verwendet werden Dann haben wir das Bildset, die Farben, alles konvertiert und es kann losgehen Wir müssen die Erkennung bestehen. Also erstellen wir einfach eine neue Variablenerkennung. Und dann rufen wir hier einfach die Funktion auf , die wir vorher hatten Führen Sie also eine Inferenz aus , die das Bild in einen Tensor umwandelt und das Ergebnis erhält Führen Sie also die Inferenz und dann übergeben wir unser richtig Also Bild RGB. Dann werden wir die Ergebnisse bekommen. Also diese Ergebnisse der Erkennung, die wir zuvor anhand dieser Variablen hier festgelegt haben, aber wir müssen sie noch richtig formatieren und in ein Objekt konvertieren, damit sie an das Frontend gesendet werden kann In diesem Fall legen wir also zuerst die Anzahl der Erkennungen fest. Die Zahl ist natürlich eine Ganzzahl, und wir sagen Erkennungen, Anzahl der Entdeckungen Das extrahiert also eine Anzahl von Erkennungen und dann rechnen wir das Erkennungsergebnis in ein Schiedsrichter-Array um, was wir jetzt tun werden Also nochmal, Erkennungen. Also rufen wir dieselbe Variable und hier öffnen wir Curly Brass für Objekt und jedes Objekt hat den Schlüssel und den Wert diesem Wert öffnen wir die Klammer und sagen, wir beginnen sie mit Null Also eine Spalte und dann sagen wir die Anzahl der Erkennungen. Dieser ist hier. schließen Das hier und einen Punkt schließen und dann sind wir Schiedsrichter Und für jeden Schlüssel und Wert bei Erkennungen. Ist. Also, was ist hier passiert? Hier legen wir also das Objekt fest, das die Erkennungen durchlaufen sollen. In diesem Fall sagen wir für, wir wollen einen Schlüssel und den Wert als Numbi für die gesamte Anzahl der Erkennungen setzen den Wert als Numbi für die gesamte Anzahl der also für jeden Schlüssel und jeden Wert in den Erkennungen dieser Erkennungen Wir wollen also für jeden Schlüssel und jeden Wert in den Erkennungen dieser Erkennungen einen Schlüssel und einen Wert für das Objekt festlegen Okay. Dann müssen wir eine Liste für die Rückkehr erstellen. Wir haben also diese Werte hier, also eine Liste mit all diesen Schlüsseln , die aus den Erkennungen stammen, und wir müssen eine Schleife erstellen, um die Erkennungsergebnisse in eine Liste umzuwandeln Und dafür sagen wir einfach vier wichtige Erkennungen. Wir sagen Erkennungen. Schlüssel entspricht Erkennungen. Schlüssel zur Liste. Nachdem wir uns hier die Schlüssel unserer Erkennungen angesehen haben, setzen wir den Index jedes Erkennungsschlüssels jeder Entdeckung in die Liste Dann müssen wir die erkannten Klassen menschenlesbaren Bezeichnungen zuordnen , die wir unserer Use Label Map verwenden Im Moment müssen wir also nur die Ergebnisse hinzufügen. Seien Sie vorsichtig mit der Aufmerksamkeit und dann brauchen wir nur noch einmal die Ergebnisse und unsere Ergebnisse werden als Array zurückgegeben Lassen wir es also vorerst leer und fügen Labelmaps hinzu 27. 27. Label_Map: Nein, wir benötigen eine Label-Map in unserem Code, um die Vorhersagen zu treffen , oder unser Modell, um eine ID zu erhalten, und die IT-Abteilung wird ein Label haben, das den Namen des Objekts trägt , das im Frontend gerendert wird Und weil wir das SST Mobile und den Coco-Datensatz verwenden , stellen sie uns bereits eine Labelmap mit einer PTN-Datei zur Verfügung, sodass wir unsere Anwendung hinzufügen können Wenn Sie dann hier zu dieser URL gehen, werde ich sie in den Ressourcen belassen. Sie können sehen, dass bereits eine Labelmap mit ID-Nummer und dann mit einem Namen, der Bezeichnung des Objekts selbst, bereitgestellt wurde eine Labelmap mit ID-Nummer und dann mit einem Namen, der Bezeichnung des Objekts selbst Diese spezielle Labelmap kann ziemlich groß sein. Ich kann Hunderttausende von Labels haben, aber ich kürze sie, und jetzt können wir sie zu unserer Anwendung hinzufügen. Wir können also zu unseren Visal Studio-Codes gehen und dort im Hauptordner eine neue Datei erstellen und sie Label nennen Karte Punkt Pi. Und dann füge ich einfach die Label-Map ein. Ich werde diese Datei auch in der Beschreibung belassen, sodass Sie sie nur kopieren und einfügen müssen, und dann haben wir hier unsere Labelmap. Aber um sie dann in unserer Hauptdatei zu verwenden , müssen wir sie importieren. Also gehen wir wieder hier hoch und speichern den Teil von Son From Imports, also aus der Labelmap, wir importieren die Labelmap. Im Grunde genommen importieren wir dieses Objekt hier in unsere Hauptanwendung. Achten Sie also nicht darauf, dass wir unsere Label-Map in unseren Hauptordner importiert haben, wir können mit unserer Route fortfahren. 28. 28. Rückgabe der Ergebnisse von der Routenvorhersage: Jetzt können wir mit unserer Pre-Vic-Route fortfahren. Also haben wir hier aufgehört, als wir unser Ergebnisarray erstellt haben. Kurz vor dem Datenarray werden wir also die Anzahl der Erkennungen durchgehen können wir also sagen, dass es vier Im Bereich der Anzahl der Erkennungen können wir also sagen, dass es vier sind Also schauen wir uns die Bandbreite an, gesamte Bandbreite unserer Erkennungen , die wir hier finden werden. Wir setzen die Funktion fort und sagen, dass bei unseren Erkennungen dieser die Erkennungswerte erzielt werden, dieser die Erkennungswerte denn wenn Sie sich daran erinnern, werden mehrere Erkennungen aus einem Bild kommen, und dann wollen wir nur die wertvollste Erkennung nutzen , die eine höhere Punktzahl hat, weil sie dem Objekt, das wir wollen, am ähnlichsten ist Objekt, das wir wollen, am ähnlichsten Wenn also die Erkennung in unserem Indexbild einen Wert von eins erzielt hat, wollen wir nur, ob es gleich oder höher als 0,5 ist, das ist , was uns interessiert. Wenn wir also diesen Wert und diese Erkennung haben, sagen wir, dass die Klassen-ID in diesem Fall eine Ganzzahl ist, und wir geben einfach dieselbe Indexnummer an. Die Klassen der Erkennungsklasse haben also auf unseren Blick die Nummer unseres Indexes, also konvertieren wir im Grunde unsere Klassen-ID in eine Zahl in eine Ganzzahl. Und dann können wir auch die Kategorie festlegen. Und die Kategorie wird so unsere Label-Map sein. Wir müssen unsere Labels aus der Datei verwenden, die wir zuvor hinzugefügt haben. Und in unserer Label-Map erhalten wir die Klassen-ID oder Unbekannt. Unbekannt. Hier erhält die Kategorie also die Klassen-ID der Erkennung, die wir in eine Ganzzahl umwandeln und wir werden hier einen dieser Indizes zuordnen Dann brauchen wir also auch unsere Erkennungsbox. Wir sagen Box und wir sagen Erkennungen. Und hier wollen wir alle Erkennungswerte haben. Mit einem SA für etwa 12 S hier, also machen Sie bitte einfach die Erkennungswerte, und dann wollen wir auch den Index. Und dann können wir endlich unsere Ergebnisse abfragen. Also werden wir OR-Array-Ergebnisse aufrufen und diese Ergebnisse anhängen Dann können wir dieses Array überprüfen und ausprobieren und unsere Daten, die wir benötigen, im Frontend haben Aber hier müssen wir ein Objekt öffnen und schon haben wir die Box. Das wird nur die Box sein , die wir zuvor erstellt haben. Wir werden auch die Kategorie haben. Nochmals, dieselbe Kategorie von hier aus und dann die Punktzahl. Wir brauchen also die Partitur, die auf der Vorderseite gerendert werden soll, tendieren dazu, Punkte zu erzielen. Und weil wir den Punktestand nicht hatten, müssen wir hier prüfen. Das Ergebnis wird also sein: Ich habe hier einen Fehler und ich kann jetzt sehen, dass Boxen hier statt Boxen Punktzahlen sein sollten. Und dann öffnen wir hier ein neues, und so öffnen wir bei der Erkennung von Kästchen wieder eckige Klammern und wir sagen Erkennung Boxen. Auch hier wollen wir einen Index. Also jetzt sollte mit dieser Schleife alles in Ordnung sein. Dann wollen wir die Ergebnisse irgendwie sehen. Wir gehen zurück, also zwei Zeilen zurück wegen dem Zitat, und wir wollen unsere Ergebnisse ausdrucken Also sagen wir final und wir sagen Ergebnisse zu Testzwecken, damit wir die Ergebnisse auf unserer Konsole sehen können, und dann müssen wir die Daten zurückgeben , die bereits für unser Frontend formatiert Da die Funktion also eine benachbarte Antwort zurückgeben soll, müssen wir sie auch zurückgeben Also sagen wir Rückkehr. Und dann antwortet Jason, und unser Inhalt wird das Ergebnis sein. Also hier unser Array, dass wir mit diesen Methoden Daten hinzugefügt haben. Also können wir es speichern und als Nächstes können wir es in unserer Konsole testen. 29. 29. Unsere Route testen: Jetzt können wir vorerst unsere Route und unseren Server testen. Ich lade nur ein paar Bilder herunter, damit wir sie testen können, und wir werden sie hier auf den Ressourcen belassen, und wir müssen unsere Anwendung mit UVCorn ausführen Aber ich führe die Anwendung mit UVCorn aus und habe diesen Fehler bekommen Wenn Sie diesen Fehler haben, folgen Sie bitte diesen Methoden, um ihn zu beheben Sie müssen also PIP Multip installieren, damit Sie das tun können. Aber zuerst muss ich das wieder beenden und sagen, P installiere Python Multipart Das liegt daran, dass wir ein Formular benötigen , weil wir hier ein Formular verwenden, und dann können wir wieder das UVCorn verwenden Also sagen wir UVCorn mit Doppelpunkt nach oben und dann Relos. Und jetzt können wir es im Browser überprüfen. Und wenn wir zu unserem Browser gehen, gehen wir zu unserer Route zu unserer WiRel, die wir hatten, und zum Dokumentteil Dort können wir also schon testen ob unsere vorhergesagte Route funktioniert oder nicht Also werden wir es einfach hier öffnen. Und dann, wie Sie sehen können, handelt es sich um Daten aus mehreren Formularen. Aus diesem Grund mussten wir diese Installation von PIP ausführen, weil unsere Route nur wegen dieser Post-Methode nicht funktionierte Also sagen wir einfach, probier es aus. Und hier können wir eine Datei auswählen. Wählen Sie also bitte die Datei Ihrer Wahl aus, aber denken Sie daran, dass sie auf der Labelmap stehen muss. Ihr könnt also einfach die Bilder verwenden, die auf den Ressourcen übrig sind. Wir verwenden einfach das Bild, sagen wir dieses Boot, wir laden es hoch und dann sagen wir Ausführen. Und jetzt lief die Ausführung okay, alles funktioniert einwandfrei und wir haben unsere Antwort. Also, wie Sie sehen können, mehrere Boxen, aber in diesem Fall werden wir das Maximum herausholen, das eine Punktzahl hat. Damit wurde die Kategorie identifiziert, in der das Team ein Boot wie erwartet und mit einer Genauigkeit von 98% verwendet . Also das im Frontend werden wir einfach auf Prozent aufrunden. Aber hier haben wir eine Dezimalzahl , die 0,98 ist, was 98% bedeutet Wir können es mit einem anderen Bild versuchen. Also setzen wir es einfach zurück, sagen wir, eine Katze sagt Execute und unsere Vorhersage ist eine Katze. Sie können die Ergebnisse auch hier auf Ihrer Konsole, auf Ihrem Terminal sehen . Die letzten beiden, die wir vorhergesagt haben, sind also beide, und die Katze mit 99% und die andere mit 98 Punkten, sodass die Bilder klar genug sind , damit unser Modell sie erkennen kann. 30. 30. Verwenden Sie den Bild-Hook: Jetzt, wo wir unser Backend oder unseren Server eingerichtet haben, können wir zu unserem Frontend zurückkehren und diese Verbindung verwalten. Zuallererst werden wir einen React-Hook erstellen. Ein React-Hook ermöglicht es uns also , einen Code, eine Funktion oder beliebige Daten in einer einzigen Datei zu haben , die in unserer Anwendung verwendet oder eingebunden werden können unserer Anwendung verwendet oder eingebunden werden Um das zu erstellen, kommen wir auf unsere Seite, wo wir unsere Dateien haben , und wir werden einen neuen Ordner erstellen, und wir werden ihn Hooks nennen Und dann werden wir in diesem Hook-Ordner eine Datei erstellen und die Datei wird use aufrufen. React-Hooks müssen also immer das Präfix use haben und dann image aplosHok sagen Und das ist eine Ts-Datei, also eine also eine Jetzt werden wir im React-Hook zunächst mitteilen, was wir benötigen, also benötigen wir den Nutzungsstatus von React. Wir benötigen auch Axios wird also alle unsere HCTP-Anfragen Falls Sie nicht wissen, was bei XUS einfach und ausschließlich eine XTTP-Anfrage ist , um das Datum zu erhalten oder um Post-Anfragen zu erhalten, und dies ist ein hilfreiches Paket, um es einfacher zu machen und dies ist ein hilfreiches Paket Dann werden wir mit Export einen Look erstellen , der in der gesamten Anwendung und Konstante verwendet werden kann, und wir nennen es Use und wir nennen Und der Bild-Applaus bekommen wir ein Argument, und dieses Argument wird die Zeichenfolge oder L sein , die wir senden werden, von wo immer wir wollen Und wir nennen es einfach Applause WL, und der Typ ist eine Zeichenfolge. Dann können wir einfach die Pfeilfunktion haben und alles hier zurückgeben. Zunächst müssen wir einige Zustände haben, damit wir den ersten erstellen können und ihn Vorhersage nennen und die Vorhersage ist das , was wir zu unserer Komponente zurückkehren werden. Vorhersage. Diese Ergebnisse kommen vom Backend, hier verarbeitet und dann können wir sie überall verwenden. Wir sagen, nutze den Zustand und verursache ihn einfach. Dann brauchen wir auch einen Verlustindikator. Wir erstellen einen Volan ruft auf, wenn geladen wird, und dann sagen wir, dass Set verliert, und dann verwenden wir wieder state Und in diesem Fall wollen wir, dass es sich um einen booleschen Wert handelt, und starten die Anwendung mit dem Unser Ladestatus wird also am Anfang falsch sein. Dann kostet es wieder, und wir brauchen auch eine Zustandsvariable für Fehler. Also sag Fehler. Diese Anwendung wird also jeden Fehler haben, wir setzen ihn einfach hier und sagen dann Fehler. Und hier, weil es eine Fehlermeldung sein wird, müssen wir sie als Zeichenfolge setzen. Aber wenn wir keinen Fehler haben, haben wir Null. Also beginnen wir den Lebenszyklus dieses Hooks mit diesem Status Null, also kein Fehler am Anfang. Dann erschaffen wir unsere Funktion in dir. Also brauchen wir eine Funktion zum Hochladen unseres Bildes. Wir können einfach Cost, aploimage sagen , das wird eine Synchronisierungsfunktion sein , die Datei als Argument verwendet Also laden wir hier unser Bild hoch und der Typ wird Datei sein. Und dann geben wir hier einfach etwas rein. Und hier drinnen brauchen wir zuerst Formulardaten, weil wir als Formular agieren , wenn wir unser Bild hochladen, wie wir es zuvor erstellt haben. Es ist ein Formular, und wir müssen es als neue Formulardaten festlegen. Und dann werden wir dieses Bild an unsere Formulardaten anhängen. Formulardaten hängen also die Datei an, die wir als Argument übergeben haben. Also macht die Datei Spaß. Also, weil wir gegen das Bild sind, müssen wir das Verlieren als wahr ansehen. Wenn wir also dem Bild applaudieren, müssen wir in der Regel das Verlieren als wahr angeben und dann unserer Anwendung einen Spin- oder Verlustindikator hinzufügen Verlieren ist also wahr, wenn wir gegen das Bild sind und dann den Fehler auf Null setzen Wir haben hier also immer noch keinen Fehler. Und dann versuchen wir, einen Spaziergang zu fangen. Und zuerst werden wir mit einem Try-and-Catch-Walk die Informationen bekommen oder versuchen zu bekommen, die wir benötigen, und wir fangen jeden Fehler, falls sie existieren. Um also einen Try-and-Catch-Walk zu erstellen, der ein Versuch ist, und dann fangen wir wieder hier dann fangen wir wieder hier ab und geben jeden Fehler weiter, falls er existiert, also fangen wir jeden Fehler ab und öffnen dann einen weiteren Block. Aber hier fehlen uns einige Teile unserer Anwendung, wie zum Beispiel Typen. Wir möchten also, dass unser Hook einen bestimmten Typ zurückgibt. Wir möchten auch, dass es sich bei unserer Vorhersage um einen bestimmten Typ handelt. Deshalb habe ich hier zuerst einen Tippfehler, es ist also eine Vorhersage Dafür werden wir jetzt unsere Typen erstellen. 31. 31. Ergebnisarten: Nein, für unsere Typen können wir die Typen entweder hier erstellen oder die Anwendung übersichtlicher gestalten. Wir werden einen neuen Ordner erstellen und ihn Ordnertypen nennen Und dann erstellen wir innerhalb der Ordnertypen eine weitere Datei namens type dot Ts Und hier können wir anfangen, die Typen zu erstellen , die wir verwenden möchten. Also verwenden wir zuerst den Produktionstyp , den wir dann an unsere Hauptkomponente senden werden. Und dafür sagen wir Export, also können wir diesen Typ, diesen Typ exportieren , und wir haben es bei Vorhersage. Vorhersage ist gleichbedeutend mit offenen Rollenklammern, und dann sagen wir Kategorie , dass wir eine Kategorie benötigen Also das Label, wie Sie sich erinnern, und nennen Sie es eine Zeichenfolge Und dann müssen wir auch die Punktzahl zeigen. Wir haben also unsere Punktzahl, und unsere Punktzahl wird eine Zahl sein, wenn Sie sich an die 0,98 erinnern , dass wir auch unsere Sendung dorthin schicken werden Danach müssen wir also auch etwas von unserer Funktion zurückgeben Wir wollen also genau die Typen, die wir von unserer Funktion zurückgeben möchten, verwenden, hauptsächlich das Bild-Applaus-Ergebnis verwenden. Und dann können wir wieder sagen, Typ exportieren, Bild verwenden, Applaus und dann Ergebnis. Und das wird der Applaus sein. Stellen Sie sich vor, das wäre in diesem Fall eine Funktion, so wie wir unsere Funktion, die Datei aufruft, als Typdatei haben , und dann geben wir hier einfach das Versprechen zurück. Also können wir jedes Versprechen dort zurückgeben, wo wir wollen. Dann haben wir auch die Vorhersage. Wenn Sie sich also erinnern, kamen diese Vorhersagen als Array. Deshalb werden wir hier diesen Typ verwenden, und wir nennen ihn Vorhersage. Aber weil es ein Array ist, wollen wir ein Array mit Vorhersagen, aber es kann auch Null sein, kann auch nichts haben, wenn ein Fehler auftritt oder wenn keine Treffer gefunden wurden, also müssen wir auch Null setzen. Dann haben wir wieder das Laden , was in diesem Fall ein Bullion ist, und dann den Fehler und den Pfeil, ob Sie sich an die Zeichenfolge erinnern oder nicht Jetzt können wir also zu unserem Haken zurückkehren und dann hier einstellen, was wir brauchen. Also hier in der ersten Zustandsvariablen müssen wir sie als Vorhersage festlegen. Öffnen Sie also das Tag hier, und dann sagen wir Prognose und es ist eine Reihe von Vorhersagen , die auch Null sein können. Und der erste Zustand , in dem die Komponente alles auf Null rendert Wenn die Komponente also gerendert wird, haben wir noch nichts, also müssen wir dies auf Null setzen Und jetzt müssen wir unseren Typ importieren , damit wir ihn in der Anwendung verwenden können Wenn wir also zu unserem Import-Teil gehen, sagen wir Import, öffnen dann Kern Pass und wir importieren unsere beiden Typen. Es heißt also Vorhersage und Applaus, Bild verwenden, Ergebnis anwenden. Und ein Fehler, den ich in Time importiert habe, also lösche diesen einfach Nun, hier, wo wir das verwenden wollen, wollen wir es als den Typ unserer Funktion oder das Ergebnis unserer Funktion verwenden , was sie am Ende zurückgeben werden. Also verwenden wir Bild, applaudiertes Ergebnis. Jetzt bekommen wir also diesen Fehler, weil wir etwas zurückgeben müssen und wir immer noch nichts zurückgeben Dieser Fehler wird also verschwinden nachdem wir diesen Codeblock hier fertiggestellt haben. Wir werden als Nächstes weitermachen. 32. 32. Rückgabe von Daten aus Hook: Nein, hier in unserem Try-and-Catch-Block müssen wir noch einige Aufrufe durchführen, damit wir die genauen Ergebnisse haben , um sie dann für die Hauptkomponente zu verwenden. Also zuerst stellen wir die Post-Anfrage, dann mit Achsen, die wir importieren, und dafür sagen wir Kosten, und das ist eine Antwort, die gleich Und weil es sich um eine synchrone Operation handelt, sagen wir, warte auf das Ergebnis, und dann sagen wir axios post und wir wollen boosten, weil wir es von unserer Hauptkomponente aus senden werden Vorhersage anhand einer Reihe Und dann öffnen wir hier die Zahnspange und was wir senden werden, welche Art von Informationen wir senden werden Also zuerst benötigen wir die RL, damit wir unsere RL immer noch nicht in der Anwendung haben , aber das legen wir später fest Dann die Formulardaten. Also Formulardaten, die wir hier einstellen. Und wieder Komma, und wir öffnen die Ohren mit geschweiften Klammern. Für die ERS sagen wir also zuerst ers geschweifte Klammern und hier legen wir einfach den Inhaltstyp und hier legen wir einfach Also offene Anführungszeichen, Inhaltstyp und in diesem Fall, wenn Sie sich erinnern, handelt es sich um mehrteilige Formulardaten aus unseren Tests auf dem Server Sagen wir mehrteilige Formulardaten. Okay, dann setze ich hier ein Komma. Und das Erste, was wir tun können, ist , nach der Antwortvariablen oder der Antwortanfrage hier eine weitere Zeile einzugeben und wir können zuerst das Konsolenprotokoll einrichten, damit wir die Antwort sehen können Sagen wir Serverantwort, denn wenn etwas passiert und die Daten nicht kommen, können wir auf der Konsole überprüfen, ob sie wirklich kommen oder nicht, und dann die Antwortdaten. Dann müssen wir überprüfen, ob alles in Ordnung ist. Also sagen wir, wenn unser Array so unsere Vorhersagen ist, ist es ein Array mit Antwortdaten. Also wenn das ein Array ist und die Antwort das, weil es ein RA als Länge ist. Und wenn diese Länge größer als Null ist, was bedeutet, dass sie gefüllt ist, können wir sagen, dass die Daten existieren, und wir setzen die Vorhersage auf Antwortdaten. Wenn nicht, andernfalls setzen wir den Fehler. Also, weil das nicht der Wahrheit entspricht und wir keine Daten haben, wir einfach einen Fehler aus, und so geben wir einfach einen Fehler aus, und so müssen wir den Fehler setzen und das unerwartete Antwortformat vom Server angeben. Das heißt, auf dem Server ist etwas schief gelaufen. Wenn alles richtig läuft, senden wir diese Daten an unsere Anwendung und unsere Prognosen werden aufgefüllt. Aber denken Sie daran, dass wir hier immer noch Status verlieren, weil es wahr ist, also immer noch nichts, und wir werden später damit beginnen, die Daten anzuzeigen. Also jetzt setzen wir unseren Fang fort. Wenn wir also einen Fehler haben, setzen wir zuerst einen Konsolenfehler. Und wie gesagt, wir fügen einen Fehler hinzu. Wir hatten einen Fehler beim Löschen des Bildes und dann sagen wir, um welche Art von Fehler es sich handelt Also diesen Fehler rendern wir dann auch als Konsolenfehler. Dann wieder öffnen wir I. Und das liegt daran, dass wir Axios verwenden, wir sagen Axios Es ist ein Axios-Fehler. Axis erkennt dies also bei Fehler und setzt es hier als Axios-Fehler Wir werden einen anderen Fehler setzen. Also hier sagen wir, gib ihm vielleicht mehr Platz, weil wir hier den Platz brauchen und wir sagen, öffne einen Backtick Und dann sagst du, dass hier verschiedene zehn Anführungszeichen zurückgesetzt werden sollen, sagen wir, das Bild konnte nicht verloren gehen Dann öffnen Sie das 1-Dollar-Zeichen, Curly Races, und dann übergeben wir die Fehlermeldung oder Fehlerpunktmeldung , die von hier kommt Dann können wir hier weitermachen. Wir haben einen Punkt und dann Status. Das sind also nur nützliche Informationen für den Fall von Fehlern. Wir sagen Status der Fehlerantwort. Wir können wieder die geschweiften Klammern schließen, noch einen Punkt, ein weiteres Dollarzeichen und wir sagen Fehler Dot antwortet. Wir haben dieses Fragezeichen gesetzt , weil es sich um einen optionalen Status handelt. Also das Zulassen, wenn es nicht existiert, nicht weitermachen und dann detailliert oder nur eine leere Zeichenfolge. Dann müssen wir in unserem I-Block auch s setzen, und das S wird gut sein, wir setzen einfach einen anderen Fehler wenn einer dieser Fehler zutrifft, aber wir haben immer noch einen Fehler. Wir müssen nur sagen, dass das Bild nicht vermasselt werden konnte. Bitte versuchen Sie es erneut. Wenn also kein Fehler des Servers oder kein Fehler von Axios vorliegt, setzen wir einfach diese Fehlermeldung Und dann wollen wir den Block fertig stellen und dann sagen wir hier. Nach unserem Fang und unserem Versuch müssen wir also finalisieren und dann sagen wir, dass, wenn alles richtig läuft, wir sagen, Set verliert gegen Foss Jetzt verlieren wir also nicht mehr. Wir zeigen entweder einen Fehler oder die tatsächlichen Daten. Speichern, aber wie extrahieren wir dann? Wir müssen etwas zurückgeben. Also müssen wir jede Zustandsvariable zurückgeben , die wir erstellt haben. Also sagen wir einfach, geöffnete Carl-Klammern zurückgeben und wir geben ein Plotbild Also die Funktion von der Hauptkomponente so einzustellen , dass sie hierher gesendet wird, die Vorhersage, dass wir auch senden müssen, dieses Laden, damit Sie den Ladestatus überprüfen können und dann Fehler machen Wenn wir jetzt speichern und wir immer noch diesen Fehler haben, weil er irgendwie unbekannt ist. Um einfach zu beheben, müssen wir ihn nur so einstellen wie hier, und der Fehler verschwindet. Aber ich habe von irgendwem hier einen Fehler. Hier geht es um meinen Fehler, denn idealerweise sollten wir bei großen Anwendungen auf Produktionsanwendungen niemals irgendwelche oder nur sehr spezielle Fälle verwenden, auf Produktionsanwendungen niemals irgendwelche oder nur sehr spezielle Fälle verwenden da dies die Anwendung und die langfristige oder kontinuierliche Entwicklung beeinträchtigen kann die Anwendung und die langfristige oder kontinuierliche Entwicklung beeinträchtigen Deshalb versuche ich normalerweise, alle zu vermeiden, aber in diesem Fall können wir sie einfach verwenden Speichern Sie es jetzt und wir sind bereit, diesen Teil in unserer Anwendung zu testen. 33. Verwenden von Hook in der Bildsteuerung: Also als erstes sollten wir zurückgehen. Wir können das alles schließen und zu unserem Bildkontrollpunkt TSX zurückkehren Und wenn Sie sich erinnern, haben wir hier diese Variablen erstellt , die wir nicht benötigen oder nicht verwenden würden, aber das müssen wir jetzt ändern Also als Erstes sagen wir einfach Kosten. Und dann wollen wir die gleichen Dinge haben , die wir aus unserem Hook zurückgeben. Wir haben also das geschlossene Bild. Wir werden eine Vorhersage brauchen. Geht verloren und der Fehler. Also das, was wir verwenden werden, sind bereits in unserem Frontend-Jahr festgelegt, und das wird aus dem Hook mit den richtigen Daten kommen. Und dann müssen wir den Hook benutzen, also sagen wir Bild, benutzen Bild applaud Und wenn ich nur einen Tab drücke, wird der Hook für mich importiert Also importiere, verwende Image Applaud aus unserem Hook-Ordner und die richtige Datei Nun, weil ich hier einen Fehler habe und warum ist das so? Denn wenn du dich erinnerst, unser Hook, der Image Plus verwendet benötigt unser Hook, der Image Plus verwendet, ein Argument, das ein Plus ist, was bedeutet, dass wir unseren Schlüssel übergeben müssen. Im Moment haben wir nur eine leere Zeichenfolge gesetzt, aber wir müssen den Schlüssel trotzdem von unserem Server abfragen. 34. API-Schlüssel: Nein, wir benötigen den Schlüssel unseres Servers oder die URL unseres Servers, damit wir ihn hier verwenden können. Also dafür und für die Methoden von separate, damit wir hier nicht sichtbar sind, erstellen wir einen neuen Ordner namens keys. Und darin erstellen wir eine neue Datei namens APi kis dots. Bitte beachten Sie, dass dies eine sehr einfache Methode ist , um die Schlüssel hier nicht anzuzeigen Sicherheitsgründen sollten Sie sie jedoch nicht so verwenden, wenn Sie sie entweder für eine Umgebungsvariable oder für eine Protokolldatei verwenden . Der Benutzer wird also nicht über Entwicklungstools oder andere Methoden darauf zugreifen können. Dafür müssen wir nur zuerst eine Konstante erstellen, die Export, Kosten sagt, und dann nennen wir es API key equals, und dann, weil es eine Zeichenfolge ist, öffnen wir Codes Und falls Sie sich erinnern, ist HTTP, Schrägstrich 127.0 0.04 0.1, und wir betreiben den Server auf dem Port Wenn Sie den Port ändern, so verwenden Sie bitte den Port , den Sie verwenden Also müssen wir nur noch den Typ Typoskript setzen, und weil es eine Zeichenfolge ist, setzen wir sie als Und jetzt können wir diesen ApiKey in unserer Anwendung verwenden. Also kehren wir zu unserer Bildsteuerung zurück und müssen sie zuerst importieren Also noch einmal, hier sagen wir, importieren offene geschweifte Klammern und importieren unseren konstanten API-Schlüssel aus unserem Kiss-Ordner und den APIs Kiss Also hier, wenn das Bild sich öffnet, geben wir einfach weiter, was Also müssen wir zuerst den Bectix öffnen. Also nochmal, der Ctix erlaubt es uns Variablen innerhalb der Zeichenfolge zu verwenden, und wir wollen das Dollarzeichen und die geschweiften Rassen öffnen, und dann haben wir unseren Aber weil unser APA-Schlüssel oder die Route, die wir verwenden wollen, einfach nicht mit einem Port endet Wir müssen auch unseren Schrägstrich, Predict, übergeben , weil es unsere Post-Methode , die wir zuvor in unserer Anwendung erstellt haben Jetzt speichern wir es und jetzt können wir damit weitermachen. 35. Handle-Upload und Handle-Bild: Wir können diese Abschreckungsmethoden bereits von uns aus verwenden, aber wir müssen noch Funktionen erstellen, um die Bildänderung oder das Hochladen des Bildes zu handhaben Also als Erstes werden wir hier eine neue Funktion haben, wir Handle Image Change nennen Also das Ereignis, das wir verwenden werden , um das Bild zu ändern oder ein neues Bild hochzuladen, und das andere wird ein Ereignis sein. Und diese Veranstaltung wird die Art von Änderungsereignis haben. Also HTML-Eingabeereignis , weil wir hier ein Bild von unserem Computer verlieren oder auf diese Methode übertragen. Also nennen wir es Change-Event, den Typ, der von React kommt, und öffnen dann die Tags, und darin haben wir das HTML-Eingabeelement Also, um diese Methode hier zu verwenden. Und weil wir diesen Typ aus React verwenden, müssen wir ihn importieren. Nach dem Nutzungsstatus sagen wir also Change Event, um es hier in unseren Code zu importieren. Der Fehler ist also weg und wir sind bereit, mit unserer Funktion fortzufahren. Es wird also eine Pfeilfunktion und dann Curibass sein. Und als Erstes setzen wir eine Variable für die Datei, also const file Und das ist ein Ereignis, das das Ziel, die Dateien, die wir hochladen werden, optional hat, weil es leer sein kann, und wir wollen das erste Element in diesem Array Dann können wir es auch handhaben, um zu überprüfen, ob alles korrekt ist Wenn wir also eine Datei haben, öffnen wir wieder Carly Braces Wir sagten, Sektion hat Datei ausgewählt. Merken Sie sich hier also unsere Zustandsvariable, das ist der Typ Datei. Wir sagen also, dass wir die ausgewählte Datei von Datei zu Datei zerlegen. Also die, die wir hochgeladen haben, und dann setzen wir das Bild auf die URL. Also in diesem Fall noch eine Schnittstelle für die URL, und dann sagst du, Objekt RL erstellen. Wenn wir also ein Bild schließen, erstellt dieses Ereignis eine URL, sodass wir es sofort anzeigen können Dann speichern wir und ich habe hier einen Fehler, weil die RL aus Großbuchstaben besteht Also dann speichern wir es, also unser Endbild ändert sich, es funktioniert, aber wir müssen es in unserer Vorlage wieder hier zu unserer Eingabe verwenden . Wir haben diese Methode zur unveränderten Methode, und wir müssen nur diesen Teil hier löschen und dann einfach eine Funktion aufrufen und das Bild ändern. hier auch einen Fehler fest, und das liegt daran, dass ich die geschweiften Klammern vergessen habe weil die Methode „Zwei in Großbuchstaben“ eine Methode ist und eine geschweifte Klammer benötigt Also füge hier einfach die geschweiften Klammern hinzu, die ich ausfülle. Jetzt müssen wir den Upload erledigen. Wenn wir also den Upload haben wollen, um ihn auf unseren Server hochzuladen, sagen wir einfach: Kosten, sagen wir einfach: Kosten, Uploads bearbeiten entspricht wieder einer Synchronisierungspfeilfunktion und sagen dann, es gibt eine ausgewählte Datei, wir warten auf das Upload-Bild Um etwas mit der ausgewählten Datei zurückzugeben. Das Upload-Bild ist also die Funktion, die wir in unserem Hook haben, die wir für diesen Teil erstellt haben. Während das hochgeladen wird, können wir abwarten, ob alles korrekt läuft Es wird uns das Datum schicken Andernfalls können wir einfach den Konsolenfehler so einstellen , dass keine Datei solide ist Jetzt können wir also speichern. Aber bevor wir es testen, müssen wir diese Funktion irgendwo in unserer Vorlage hinzufügen irgendwo in unserer Vorlage , da dies das Ereignis auslösen wird . Und falls du dich erinnerst, wir haben hier diese Schaltfläche mit einem leeren Klick, und dort werden wir unsere Funktion haben. Also sagen wir Endo Applaus. Jetzt können wir es speichern und unsere Anwendung testen. 36. Testen des Bild-Uploads: also in unserer Anwendung Wenn also in unserer Anwendung die Anwendung nicht läuft, brauchen wir nur NPM run Def, um unsere IT-Anwendung zu starten, dann gehen wir zum lokalen Host und dann zu unserem lokalen Host, es ist ein Und das liegt daran, dass wir Axios nicht installiert haben. Lassen Sie uns also unseren Server stoppen und dann sagen wir, dass NPM Axios installiert Okay. Jetzt können wir es erneut versuchen und per PM auf Dev zurück zu unserem Browser schicken und alles ist korrekt. Jetzt können wir das Bild hochladen. Wählen Sie hier einfach die Datei aus. Und wir haben unsere Bilder gefaltet und wir können einfach dieses öffnen, das sich ändernde Ereignis ändert das Bild hier korrekt, und dann können wir einfach auf Bild identifizieren klicken, und wir haben einen Netzwerkfehler. Und warum haben wir den Netzwerkfehler , weil diese Anwendungen mit HTTP enden und wir die ursprungsübergreifenden Anfragen so einrichten oder beenden müssen ursprungsübergreifenden Anfragen sie in der Anwendung akzeptiert werden Lassen Sie uns das als Nächstes tun. 37. Erlauben CORS: Zu unserem Server in unserer Haupt-PTN-Datei müssen wir etwas anderes hinzufügen, um die unterschiedlichen Ursprünge unserer Anwendung zu handhaben Also müssen wir zuerst einige Teile importieren , die wir benötigen, um sie zu verwenden Also zurück zu den Importen von, wir sagen von der FAST API-Middleware Punkt für Cross-Origin, wir importieren Kurs-Middleware Dann gehen wir nach unserer Up-Fast-API zurück, öffnen ein paar Zeilen und Also von FAST API als Middle Wear und offene Zahnspangen. Und dann rufen wir Across Middlewar an und dann sagen wir Und alle Ursprünge werden Arrays sein. Dann sagen wir in der nächsten Zeile, dass Anmeldeinformationen wahr sein dürfen. Und wir sagen zulassen, dann sagen wir Methoden zulassen. Und diese Methoden werden wieder ein Array sein. Aber in diesem Fall öffnen wir Anführungszeichen und sagen Stern, um sie alle zuzulassen, dann wieder Komma und dann sagen wir Stern, um sie alle zuzulassen, dann wieder Erlaube Es, dasselbe Also anordnen, in Anführungszeichen setzen und zulassen. Dann müssen wir hier nur noch Kommas hinzufügen und schon sollte es einsatzbereit sein Hier in der Anmeldung werden wir die Zeichenketten unseres Frontends unserer URLs festlegen, werden wir die Zeichenketten unseres Frontends unserer URLs festlegen die wir verwenden, und wir können mehrere verwenden, sodass wir beispielsweise den lokalen HCTP-Host verwenden können , weil unsere Anwendungen auf einem lokalen Host ausgeführt werden, wir können zum Beispiel diesen lokalen Host festlegen, oder wir können hier sogar mehrere lokale Hosts verwenden, zum Beispiel wieder in wir können zum Beispiel diesen lokalen Host festlegen, diesen lokalen Host festlegen, oder wir können hier sogar mehrere lokale Hosts verwenden, Anführungszeichen und sagen noch Lokaler HCTB-Host und dann 42. Zum Beispiel haben wir hier eine React-Anwendung und hier die Angular-Anwendung , die wir verwenden können, und der lokale Host wird verfügbar sein und die Ursprünge werden keine Probleme mehr verursachen Also, wenn ich es speichere, und dann können wir es erneut testen. 38. Die Ergebnisse auf den Bildschirm bringen: Nein, zurück zu unserem Frontend, wir können einfach die Seite aktualisieren und es erneut versuchen. Öffnen Sie also erneut die Bilder. Lassen Sie mich noch einmal planen, und dann müssen wir nur noch das Bild identifizieren Und wie Sie sehen können, ein Haufen. Und hier haben wir das Etikett , das er als Flugzeug erkannt hat, und den Prozentsatz Also der Prozentsatz, wir haben ihn hier festgelegt. Falls Sie sich schon einmal an diese seltsame Zahl erinnern , diese lange Zahl mit Dezimalstellen, werden wir sie hier als Prozentzahl festlegen. Also können wir es noch einmal versuchen, Zebra zu sagen, und Sie sehen, dass sich das Bild geändert hat, aber wir müssen es trotzdem identifizieren Also hier ist Zebra aufgrund der Streifen eigentlich sehr leicht zu identifizieren Und dann können wir mehr ausprobieren, zum Beispiel einen Bus, plus eine Genauigkeit von 98% Also, zögern Sie nicht, beide Bilder aufzunehmen und es zu versuchen. Denken Sie daran, dass Modellieren immer noch Lernen bedeutet und wir Fehler machen. Wir werden unterschiedliche Bezeichnungen und Genauigkeiten angeben oder sogar sagen, dass das Bild nicht existiert. Sie können gerne versuchen, eine komplexere Anwendung entweder im Backend zu erstellen eine komplexere Anwendung entweder oder sogar zu versuchen, dieses Frontend zu verbessern, damit Sie es Ihren eigenen Bedürfnissen anpassen können. 39. Aufsplittern in kleinere Komponenten: Sieht so aus, als ob React komponentenbasiert ist. Also sollte alles in kleineren Komponenten sein , um den Code sauber und das Projekt verständlicher zu halten , und dann können die Komponenten auch in anderen Komponenten wiederverwendet werden . Also hier, wie wir das machen. Zunächst werden wir diese beiden Komponenten in kleinere Komponenten aufteilen . Also können wir die Imagekomponente starten, und dafür gehen wir wieder zu unserem Komponentenordner und erstellen eine neue Datei, und wir nennen sie Image Component Dot DSX Dann können wir hier einfach const setzen und die Imagekomponente aufrufen. Es ist eine funktionale Komponente, also unsere Funktion, und dann geben wir hier einfach etwas zurück und dann exportieren wir die Standard-Bildkomponente Dann müssen wir einfach dieses Div und alles darin kopieren und ausschneiden. Und in der Rückgabe fügen wir den Bildinhalt ein. Wir haben hier einen Fehler, und das werden wir später sehen, wie wir diesen Fehler vermeiden können, und wir werden auch Requisiten übergeben Also können wir es vorerst speichern. Und dann können wir hier unsere neu erstellte Komponente importieren. Also sagen wir einfach Bild. Baue das Deck zusammen und schließe es. Schauen wir uns das mal an. Wie Sie sehen können, importieren wir diese Bildkomponente aus der Bildkomponente. Wir können diese Vorhersagefelder, in denen wir unsere Narbe und Kategorien haben, auch in eine andere Komponente aufteilen diese Vorhersagefelder, in denen wir . Also kommen wir wieder her und sagen Prognosekomponente Punkt TSX Und dann haben wir einfach die gleiche Komponente für die Kostenprognose. Nochmals, funktionale Komponente. Und dann geben wir zurück, was in dieser Vorhersage enthalten ist , die Box hier. Kopiere Div und alles darin, scut es und gehe zu einer Vorhersagekomponente Habe immer noch den Fehler. Schau es dir später an, wie ich bereits erwähnt habe, und dann müssen wir den Standard exportieren. Zu speichernde Vorhersagekomponente. Und dann rufen wir die Komponente in unserer Bildsteuerung erneut auf. In diesem Fall ist also diese Vorhersagekomponente von der Vorhersagekomponente. Vergessen Sie nicht, es hier zu importieren. Und jetzt, um diese Fehler zu beheben, müssen wir Requisiten weitergeben, und das werden wir uns als Nächstes ansehen 40. React-Requisiten: Hier sehen wir also diese beiden Fehler, die in unserer Komponente auftreten, und das liegt daran, dass wir keine Requisiten haben oder dieses Objekt hier nicht existiert Und um das zu beheben, müssen wir, wie ich bereits erwähnt habe, die Requisiten einfach übergeben Requisiten sind also eine Möglichkeit, Daten von Eltern an Kinder weiterzugeben. Welche Komponenten geben also Daten an eine andere Komponente weiter, damit sie dynamisch gerendert werden kann Hängt davon ab, ob Sie die Komponente wiederverwenden möchten oder nicht, Sie können unterschiedliche Daten an diese Komponente übergeben. Und hier, wie können wir das machen? Zunächst werden wir diese Komponente in eine funktionale Komponente umwandeln. Also hier haben wir eine Spalte und dann FC für funktionale Komponente und öffnen diesen Text hier. Also dieses Tag müssen wir unseren Typ übergeben. Wenn Sie sich erinnern, haben wir in unserem Typ diesen Vorhersagetyp, der einen Wert der Kategorie N enthält , den wir früher auf dem Bildschirm gerendert haben. Hier können wir also einfach diese Art von Vorhersage importieren. Importieren Sie also Vorhersagen aus Typen. Und dieser Fehler liegt auch daran, dass wir die Funktionskomponente aus der React-Bibliothek importieren müssen . Sagen wir also, importiere offene Kalibrate FC aus Reacts. Und wie Sie sehen, sind die Fehler v. Jetzt brauchen wir auch unsere Requisiten , die wir als Argument verwenden Und dafür können wir Kalibranzen öffnen. Und denken Sie daran, wir müssen nicht die Kategorie und den DS-Wert eingeben, sondern können einfach Ihre Kategorie und Ihren Punktestand angeben Auf diese Weise wird der Fehler behoben sein. Aber im Moment ist es immer noch da, wir müssen nur diese Vorhersage hier löschen , wir verwenden nicht einfach Kategorie und Punktzahl. Also sind alle Fehler weg, wir speichern sie und dann, um sie in unserer Bildsteuerung zu verwenden, wie Sie hier sehen können, zeigen wir sofort einen Fehler an, und das, weil diese Typen fehlen. Was wir hier brauchen, ist zunächst eine Kategorie, und wir öffnen eine geschweifte Klammer und wir bestehen die Vorhersage Erstes Element des Arrays und der Kategorie. Und das Gleiche müssen wir auch für die Punktzahl tun . Also nochmal, lockige Zahnspangen, Prognose und Also, wenn wir einfach so bestehen, gibt es einen Fehler, weil es eine Zahl erwartet Die Narbe ist also eine Zahl, alle Fehler sind weg. Lassen Sie uns nun dasselbe für die Bildkomponente und die Bildkomponente tun . Und weil wir den Typ in diesem Fall nicht haben, machen wir es anders. Erstellen Sie also zunächst erneut eine funktionale Komponente. Lassen Sie uns aus der React-Bibliothek vermitteln. Und wenn Sie sich daran erinnern, dass dieses Bild eine Zeichenfolge ist, können wir es einfach übergeben, wenn wir keinen Typ haben , um es direkt hier zu übergeben Curly hebt also auf und wir sagen Bild RL, das ist eine Zeichenfolge. Wir erwarten also eine Zeichenfolge. Und dann geben Sie es hier auch als Argument weiter. Dann müssen wir auch die Stufe auf Bild o ändern, und alle Fehler sind weg. Dann haben wir in unserer Bildkomponente wieder das gleiche Problem und wir müssen dieses Bild, mit dem wir unsere Logik verwalten, an die Bildkomponente übergeben . Sagen wir, Bild RL entspricht Bild. Also sind alle Fehler weg und jetzt können wir es in unserer Anwendung testen Also zurück zu unserer Anwendung, wir können einfach Datei wählen. Ich mache hier einfach ein niedriges Bild und wir können es versuchen, ohne Fehler zu machen. Alles funktioniert wie erwartet, und da haben wir es. So übergeben wir also Daten von der übergeordneten Komponente an die untergeordnete Komponente und reagieren auf die Anwendung. 41. Anwendungsfälle und Einschränkungen: In der heutigen Welt sind Objekterkennungs-Apps zu unglaublich nützlichen Tools geworden, die die Art und Weise, wie wir mit unserer Umgebung interagieren, verändern. Stellen Sie sich also vor, Sie gehen eine stark befahrene Straße entlang. Ihr Smartphone kann am Ende mit einem schnellen Scan potenzielle Gefahren erkennen und Ihnen helfen, sicher zu navigieren. Oder stellen Sie sich vor, Sie wären in einem Supermarkt, wo dieselbe App bei der Verwaltung des Inventars hilft und das Wiederauffüllen für Ladenbesitzer zum Kinderspiel macht Diese Apps sind jedoch nicht nur für Unternehmen gedacht. Sie eröffnen Menschen mit Sehbehinderung neue Welten und beschreiben die Umwelt in Echtzeit. Naturliebhaber finden sie von unschätzbarem Wert Fada und die Fauna auf ihnen zu identifizieren In Klassenzimmern machen diese Apps das Lernen interaktiver und machen Alltagsgegenstände zu Aber es läuft nicht alles glatt. Diese Apps sind zwar clever, aber nicht unfehlbar. An einem bewölkten Tag oder in einem schwach beleuchteten Raum können sie möglicherweise Schwierigkeiten haben, Objekte genau zu identifizieren Und obwohl sie gewöhnliche Gegenstände hervorragend erkennen können, könnten sie sich bei unklareren oder spezielleren Objekten den digitalen Kopf zerkratzen oder spezielleren Objekten auch die Frage der Bei Mobilgeräten stellt sich auch die Frage der Akkulaufzeit. Wenn Sie diese Apps ausführen, kann dies Ihr Telefon kontinuierlich schneller als erwartet entladen, sodass Sie möglicherweise zu einem günstigen Zeitpunkt einen leeren Akku haben oder sogar den Akku Ihres Und in unserer datenschutzbewussten Welt sorgt der ständige Einsatz von Kameras für Stirnrunzeln Menschen fühlen sich möglicherweise unwohl, wenn sie wissen , dass ihre Umgebung ständig analysiert wird. Außerdem sehen sie Objekte, verstehen sie aber nicht vollständig. Sie können dir sagen, dass es eine Gemeinsamkeit auf einem T gibt, aber das werden sie nicht zusammen verstehen, sie stellen eine Essgruppe zusammen. Sie sind wie ein Tourist in einem fremden Land, der die Videowörter erkennt, der die Videowörter erkennt aber den gesamten Kontext der Konversation verpasst. Während wir diese Apps weiterhin in unser tägliches Leben integrieren , entdecken wir sowohl ihr Potenzial als auch ihre Grenzen. Sie sind unglaublich nützliche Tools, aber nicht ohne ihre Eigenheiten und Herausforderungen Während sich die Technologie weiterentwickelt, lernen wir, ihre Vor- und Nachteile in Einklang zu bringen ihre Vor- und Nachteile den richtigen Platz für diese Digitalisierung in Vor diesem Hintergrund kann ich es kaum erwarten zu sehen, was Sie sich einfallen lassen oder welche Ideen Sie haben, um diese Art von Apps zu erstellen