Erstellen deiner ersten Reagieren Anwendung in 75 Minuten oder so

1. Was ist React?: Hallo, Maurice hier. Willkommen zu diesem Einführungskurs oder reagieren. Also, was ist reagieren, um zu reagieren? Webseite sagt. Reacted ist eine JavaScript-Bibliothek zum Erstellen von Gesichtern. So können Sie mit React Benutzeroberflächen für Webanwendungen erstellen. Keine systemeigenen Shell-Anwendungen, die eine Sache verwenden, die aufgerufen wird zu reagieren. Einheimische. Wir werden uns nur Web-Anwendungen ansehen, also werden wir React verwenden, um eine Waffenanwendung zu erstellen. Du. - Warum? Also, wer sonst verwendet React? Es stellt sich heraus, dass viele Unternehmen erste Ordner Facebook sind, die kaum überrascht sein sollte, denn wenn Sie in Wrack tauchen, werden Sie erfahren, dass Wrecked tatsächlich als Open-Source-Projekt entwickelt wird, aber mit dem Kernteam bei Facebook sich selbst. So wird die Facebook-Website mit Rex entwickelt. Aber es stellt sich heraus, die Facebook-Website war nicht die 1. 1 Wenn Facebook Instagram erworben. Die Instagram-Website war eigentlich die erste 1 entwickelt mit reagieren, so dass sie den Rücken mit unseren vielen anderen. Netflix, Airbnb, Twitter, was ist los? Und viele andere große Unternehmen verwenden React für ihre Waffenanwendungen, aber nicht nur große Abschlüsse. Es gibt eine lange, lange Liste von Anwendungen, die mit Wrack erstellt wurden. Wenn Sie diese Liste sehen möchten, können Sie auf die zerstörte Website gehen. Hier ist zu reagieren Website, wo Sie mehr Informationen über reagieren erhalten können. Eines der Dinge, die Sie tun können, ist zu gehen, um einen Vorschlag Baum zu bekommen. Jetzt empfehle ich nicht, in den React-Quellcode selbst einzutauchen. Es ist nicht die einfachste off gute Basis, um mit zu beginnen, aber was Sie tun können, ist auf die Wiki-Seite gehen und Haare sehen Seite Auswahl, zerstört. Und hier können Sie eine lange, lange Liste von Anwendungen sehen , die mit reagieren bis zum Ende erstellt wurden. Jetzt ist das keineswegs vollständig. Ihre Menge von Mama Öffentlichkeit auf wahrscheinlich öffentlichen Websites ist gut mit Reaktionen gebaut, die nicht in dieser Liste sind . Ich habe an einigen Reaktionsanwendungen gearbeitet, und es gibt keine von ihnen sind eigentlich öffentliche Taurel im Haus Anwendungen, einige ziemlich groß, aber sie sind nicht auf dieser Liste. Aber warum machen Sie Ihre Anwendung nicht öffentlich und setzen Sie sie auch auf ein Geschäft? Irgendwie cool, stimmt's? Also in dieser Klasse werden wir ein kleines Klassenprojekt haben. Wir nehmen diese Seite, die Film-Datenbank. Das ist nicht wirklich mit React gebaut, aber das spielt keine Rolle, weil sie dieses wirklich nette a p I haben. Und mit diesem a p I werden wir die Liste von den Top bewerteten Filmen im Moment bekommen. Natürlich ändert sich diese Liste ständig, aber wir werden unsere eigene Reaktionsfront aufbauen und um diese Liste zu zeigen, ist es genau dasselbe. War das aber mehr darüber in einem anderen Video? Begleiten Sie mich im nächsten Video, wo ich Ihnen ein bisschen mehr darüber erzählen werde, wer ich bin, wie ich in die Entwicklung gekommen bin, wo ich wohne aan den. Wir können in das Fleisch von Building React Anwendungen zu bekommen. Wir sehen sie. 2. Persönliche Einführung: Hallo Englisch hier. Willkommen zurück zu diesem Einführungskurs oder zerstört Also, bevor ich werde Ihnen alles über Reagieren Zeit für eine kleine persönliche Einführung erzählen . Es ist immer schön zu wissen, mit dem wir reden. Also bin ich in den Niederlanden ansässig, Europa und den Niederlanden ist ein schönes Land, vor allem im Frühjahr, mit all den Tulpen sind aus, Wir haben einige schöne Strände und, natürlich, tolle Windmühlen. Und all diese Bilder wurden innerhalb von 20 Kilometern von meinem Wohnort aufgenommen. So ziemlich guter Ort, ich glaube, ich bin auch glücklich verheiratet, twits eine Frau und einen Sohn. Aber das ist wahrscheinlich nicht der Grund, warum du dir dieses Video anhörst. Also gehen wir zurück zum Chauffeur. Ich war ein Unabhängiger. Also für Entwickler und Ausbilder Shins 1995 In der Tat habe ich so weit länger als das entwickelt, und ich fing an, weit zurück auf einer der ersten sein aufhören mit Turbo Pascal haben Webentwicklungen seit um 2000 so fast 20 Jahre bin ich auch ein Microsoft wertvollster Profi seit mehr als den Jahrzehnten jetzt. Ich bin auch der Altar aus React Newsletter, wöchentlichen Newsletter, mit allen Arten von Nachrichten über reagieren und Hinweise auf gute Artikel. Sie können es abonnieren, um auf dem Laufenden zu bleiben und alles über React News zu lesen. So abonnieren Goto Bit Hundeleine Last React Newsletter. Stellen Sie sicher, dass die Groß- und Kleinschreibung richtig ist. Es muss genau entsprechen füllen Sie Ihren Namen und Ihre E-Mail-Adresse und Sie erhalten den Newsletter jeden Mittwoch. Wollen Sie mit mir in Kontakt treten? Sie können Twitter oder E-Mail verwenden oder über meine Website gehen. Und ich musste dir empfehlen, weil ich wirklich von dir hören will. Sagen Sie mir, was Sie in diesem Kurs gelernt haben, und sagen Sie mir, was andere Dinge, die Sie lernen möchten reagieren auf Ökosystem oder vielleicht etwas anderes aus Web-Entwicklungen. JavaScript Ansicht Angler, Erzählen Sie mir davon und ich kann Ihnen alles darüber erzählen, aber lassen Sie mich einfach wissen, was Sie hören möchten. Begleiten Sie mich im nächsten Video, wenn ich Ihnen alles erklären werde, warum Sie lernen sollten. Reagieren Sie. So sehen wir uns dann 3. Warum wir React lernen: Hallo res hier. Willkommen zurück zu diesem Einführungskurs Old Wracked. In diesem Video werden wir darüber sprechen, warum Sie in erster Linie reagieren lernen sollten. So reagieren ist die JavaScript-Bibliothek zum Erstellen von Benutzeroberflächen. Aber ich könnte dasselbe über ein wenig andere Bibliotheken oder Frameworks wie Angler View oder sogar Jake müde sagen. Warum also die Mühe? Gelernte reagieren? Nun, es wird von vielen Firmen benutzt. - Natürlich. Es wird von Facebook benutzt. Sie erstellt nach Robe und Verwendung von Instagram, die erste Website, wo es tatsächlich verwendet wurde. Aber es wird auch von großen Unternehmen wie Netflix, Airbnb, Twitter und vielen, vielen anderen verwendet. Du bist also eine gute Firma, die Wracks benutzt. Also würde ich argumentieren, dass mit React, stellen Sie sicher, dass ein besserer Programmierer. So einige von zu reagieren Vorteile. Nun, es hat eine große Gemeinschaft, die immer gut ist. Es ist klein und schnell. Nun, wer mag das nicht? Es ist stabil, und es gibt ein einfaches und vorhersehbares A p I. Ein weiteres großartiges Feature, und Sie können darauf vertrauen, dass es stabil ist, wenn sich die Reaktion ändert, um zu reagieren. AP I Sie sind verantwortlich für die Umsetzung es auf der Facebook-Shorts-Mantel, so dass sie nicht wollen, um die AP ändern. Ich nur um der Veränderung willen. Sie brauchen einen guten Grund. Es unterstützt Ihre Aufsicht Rendering, was großartig ist. Wenn Sie sich Sorgen um die Optimierung der Church Engine und die Likes machen, ist es Open Source, so dass Sie zur Quelle gelangen und sogar dazu beitragen können, wenn Sie möchten. Und es hat ein engagiertes Team für Facebook, die daran arbeiten, aber nicht nur daran arbeiten, weil sie es mögen, sondern auch bezahlt werden, um mit Vollzeit zu arbeiten. Aber es gibt auch einige Händler mit Reaktionen und ob ihr Handel von einer Note könnte tatsächlich aussehen Punkt auf Ihrem Standpunkt. Aber ein wichtiger reagiert wird von Facebook für Facebook erstellt. Es wird also von den Facebook-Bedürfnissen angetrieben. Und wenn sie sich sehr von Ihren Bedürfnissen unterscheiden, reagieren möglicherweise nicht die perfekte Wahl. Aber für viele Anwendungen ist es großartig. Eine andere Sache ist, innerhalb von JavaScript zu markieren. J-Sex-Mantel zu schreiben ist eigentlich ziemlich gut, aber nicht jeder stimmt damit überein. Es gibt Leute, die das nicht mögen. Ich möchte Trennung von Markup von JavaScript. Das ist okay. Wenn das Ihr Ding ist, reagiert wahrscheinlich Notiz für Sie. Ergebnisse werden ausgeführt Daumenbedenken, die Art und Weise zu reagieren ist so schnell, indem man einige Sachen vergleicht, was bedeutet, dass es einige zusätzliche Dinge im Speicher hält, was natürlich über dem Speicherdruck groß ist. Es ist nicht viel, nur ein bisschen, aber das ist vielleicht ein bisschen zu viel für dich. Noch eine Sache. Reaktoren. Nicht sehr eigensinnig wieder, Sie könnten mögen, dass Sie vielleicht nicht. Das Problem könnte sein, dass Sie eine Menge Anleitung wollen, und reagieren gibt keinen Treibstoff, dass Wissenschaft. Es ist ziemlich offen. Sie entscheiden, wie Sie Probleme lösen wollen, und es ist ihnen egal. Sie überlassen es dir. Ich mag so viele andere Leute wie das. Aber es ist vielleicht nicht für dich. Behalten Sie das im Hinterkopf. Also Reactor Pappel. Dies ist, um einen Vorschlag für Wracks zu bekommen, und Sie können sehen, es gibt mehr als 88.000 Sterne. Wie kann das mit einigen anderen Wettbewerben verglichen werden? Nun, hier ist Angler fünf Rahmen zum Nachfolger der populären Wut auf Framework. Es ist sehr beliebt, aber es hat nur 33.000 Sterne. , 33'000 Sterne sind nichts,was man sich schämen muss. Das ist ziemlich gut, aber es ist nirgends annähernd so sehr, wie wir reagieren. Also, wenn Sie ein anderes beliebtes Sie. Ich Bücherei. Es hat 83.000 Sterne, also ist es fast so beliebt wie reaktiv. Steh Millionen auf. Wie wäre es mit dem Zählen von Downloads? Weil es viele gibt, wo man Popularität bekommen kann. Also hier ist auf NPM-Seite für Wrecked. Sie konnten an den richtigen Erkenntnissen sehen, dass es im letzten Monat mehr als acht Millionen Downloads gibt. Wie verhält sich das mit der Konkurrenz? Nun, wenn wir uns Angler in diesem Fall ansehen, haben einen Blick auf die Angler-Kern-Bibliothek genommen, die immer heruntergeladen wird. Wenn Sie Angler herunterladen, ist es ein zwei Koma, sechs 1.000.000 Downloads letzten Monat. Nichts zu schämen, aber nirgends in der Nähe von welchem Reaktor. Wie wär's mit wenigen? Nun, da noch tiefer. Fast 1,2 Millionen. Immer noch ziemlich beeindruckend für die Bibliothek, aber nirgendwo annähernd so viele Downloads wie reaktiv. Also, aber Sie sehen sich diese Zahlen zerstört s ziemlich beliebt und Urin Waren Unternehmen Infusionen. So sehen Sie das nächste Mal, wenn ich Ihnen alles erzählen werde, was Sie in diesem Kurs lernen 4. Das wirst du lernen: Hallo Erinnerungen hier. Willkommen zurück bei Dis. Einführungskurs wird in diesem Video reagieren. Wir werden kurz besprechen, was Sie lernen werden. Das Hauptziel dieses Kurses ist es, Ihnen beizubringen, wie Sie mit Wrack beginnen. Ich werde erklären, warum ich so genial reagiert habe und warum Sie wollen, dass Web-Anwendungen in erster Linie reagieren würden . Ich gehe davon aus, dass du Javascript schon schrecklich kennst. Aber so viel weg reagieren, Entwickler verwenden mehr als Stil. JavaScript deckt einige der mehr als Java-Skriptsyntax ab, die Sie vielleicht noch nicht kennen. Eine andere wichtige Sache ist, was Sie nicht lernen werden. Wir werden nicht auf jede mögliche Art und Weise schauen, um Komponenten oder solche Dinge zu erstellen. Also lassen wir das für einen anderen Kurs. Wir sind auch auf der Suche nach einer Menge externer Bibliotheken wie Reduktion oder React Writer, ? Einige. Aber das meiste davon wird einfach für einen anderen Kurs gehen. Die meisten werden nicht einen Blick auf Unit-Tests werfen. Und in der Tat werde ich einige Best Practices auslassen, nur um die Dinge einfach zu halten. So sehen Sie sich im nächsten Video, wenn ich einige von der modernen JavaScript in der Steuer erklären werde 5. Javascript: Ich bin Alicia. Willkommen zurück hierbei. Einführungskurs wird in diesem Video reagieren, über das ich aus der modernen JavaScript-Konstrukte sprechen werde, um zu verwenden. Also werden wir über Brille sprechen, Raid Aled Karte fete, Pfeilfunktionen, Vorlagen, Strings. Constand führte dazu, Variablen zu definieren, die Import- und Exportfunktionen, Objektrestrukturierung und die asiatischen kuwaitischen Werke. Also lasst uns direkt in den Mantel eintauchen. Also hier, nachdem die Shorts Leute an die Leute da drinnen und den Umhang des Konsuls zum Ausdrucken gebracht haben, gebracht haben,wird es diese Objekte einfach so ausdrucken. Lassen Sie uns also einen People Print oder eine Klasse erstellen, um diese auszudrucken. Also haben wir Konstruktor erstellt. Es dauert Schlepp-Sammlung von Menschen. Sicherheit ist auf Eigentum auf dem Objekt mit dem stolt, und dann fügen wir eine Funktion hinzu, um sie zu drucken. Jetzt können wir eine Instanz aus den Druckerobjekten mit den neuen Schlüsselwörtern konstruieren. Sobald wir das Objekt haben, können wir den Druck von Kill es aufrufen, und die Ausgabe ist genau die gleiche wie vorher. Kein Mensch. Wir wollen nicht jedes persönliche Objekt drucken, sondern nur den Vornamen, den wir die Personensammlung nur in die Vornamenszeichenfolgen abbilden . So nimmt die Map-Funktion eine Funktion ist Parameter und wird einmal für jedes Objekt in Ihrem A aufgerufen werden und wir geben, was wir wollen, in der neueren rechten. Also in diesem Fall, der Vorname, den Sie sehen können, dass Sie gerade das erste, was gedruckt haben. Wenn alles, was wir wollen, eine einfache Funktion wie diese ist, können wir tatsächlich eine kürzere Syntax verwenden. Yuzhin Febrero Funktionen so entfernt, um Schlüssel arbeiten und Essen zu funktionieren. In der Tat sind sie da drauf. Und wenn wir nur etwas zurückgeben wollen, das wir nicht wirklich blockieren und umkippen müssen , können wir einfach den Ausdruck dort einfügen, was die Ergebnisse sein wird. So erhalten sie die Vornamen, die gedruckt werden. Wie menschlich Wir wollen einen vollständigen Namen. Wir könnten Getränkekettung benutzen, um den Vornamen des Weltraums zu nehmen. Und dann der Nachname, der gut funktioniert. Dies ist ein großartiger Ort für Sie. Zeichenfolgenvorlagen. Sie erstellen Stärke Vorlagen mit dem Rücken Schwanz. Das ist normalerweise auf der linken oberen Seite der Tastatur im Inneren, mit Dolar und geschweiften Klammern. Sie können Ausdrücke dort einfügen, Also hier haben wir Stärke Vorlage, die genau das gleiche Ergebnis zurückgibt. Dies können sogar Bolte-Linien sein, also kann ich ein paar Zeilen in ihrem Lauf hinzufügen und Sie werden sehen, wie der Schrägstrich und das Zeichen für die neue Zeile gedruckt werden . In diesem Fall wollen wir also keine neuen Linien. Das ist einfach in Ordnung. Ein weiterer schöner Fall von der fünften Pfeilfunktion ist, dass es dazu beibehält. Er arbeitete in einer Funktion. Also, um das Verhalten zu sehen, ist das nur eine große kleine Hilfsfunktion, die es von Referenz und Zielen nimmt. Und das ist Gold mit dem Drucker, der druckt, an den ich mich gerade erinnere, der nur die vollständigen Namen von den Leuten abdruckt . Aber wenn wir es so nennen, es tatsächlich einen Fehler zurück, weil innerhalb der Funktion es nicht mehr über die Disc e funktioniert. Es beschwert sich also über Menschen, damit wir dies auch mit der fünften Pfeilfunktion lösen können. In diesem Fall funktioniert das Drucken besser, weil es als eine gefiederte Pfeilfunktion definiert ist. , Denken Sie daran, speichern Sie, worauf dies hinweist, wenn es aufgerufen wird, und es hilft. Wenn ich die Waffe voll, schauen Sie nicht so gut, so dass wir tatsächlich drucken die Ausgabe. Es läuft gut, aber wir haben nicht in der Ausgabe gesehen. Und dort sehen wir wieder die vollständigen Links. Dies wird also häufig verwendet, um zu reagieren, wenn wir Toe Ereignishandler und Likes kaufen. Also eine Sache mit diesem Drucker, wir werden ihn nie ändern. Also sagte er, das weit wäre an die neuere Küste gewöhnt. Das zeigt, dass wir es nicht ändern werden. Wir können dasselbe mit dem People-Array an der Spitze tun. Der Trainer wird sich genau gleich verhalten. Aber wenn Sie versuchen, eine dieser Variablen zu ändern, würde es tatsächlich zum Laufzeitfehler gehen, weil wir neu zugewiesen wurden. Drucker. Eine weitere nette neue Funktion ist die Möglichkeit, Daten zu exportieren und zu importieren. In diesem Fall haben wir die People-Datei und es exportiert fünf verschiedene Personen, so dass wir sie hier mit der Import-Anweisung importieren Menschen aus und in diesem Fall werden wir relative Bad mit Gedanken Slash verwenden, um es anzuzeigen. Es ist ein lokales Foul und nicht etwas importiert von MPM, so dass die Ziege läuft die gleiche, aber das würde Prinz fünf verschiedene Menschen. Ein weiterer häufig verwendeter Mechanismus in diesen Tagen ist die Opiatumstrukturierung, die sowohl auf dem Rennen als auch auf kleinen Objekten funktioniert . Also nehmen wir an, wir wollen die erste Person aus der Reihe von Menschen und dann den Vornamen von dieser ersten Person und gedruckt, so dass wir auf traditionelle Weise wie diese tun können. Wir sehen Ihren Vornamen von der ersten Person, Hilda, aber wir können eine radi-Strukturierung dafür verwenden und Opiate Umstrukturierung in diesem Fall, weil Vorname der Variablen war, Mr. Property Name zu sagen. Ich kann das mit einer kürzeren Syntax tun, wobei die geschweiften Klammern zum Variablennamen laufen. Es wird auch das gleiche mit und die Rate tun. Also, indem Sie die eckigen Klammern Laufzeit hinzufügen sagen: Nehmen Sie das erste Objekt aus dem Strahl, nehmen Sie die Vornamen-Eigenschaft daraus und drucken Sie es. Oder ich könnte sagen, denken Sie, dass dieser Vorname von der zweiten Person in diesem Fall würde die erste Person dem Unterstrich zugeordnet werden, dass wir den Vornamen von der zweiten Person nehmen , und sie können auch die andere Leute aus dem Array. Also, sehen Sie, wir drucken den Vornamen der IRS, und dann gingen wir zu drei Menschen im People-Array verloren. Also eine weitere nette Fähigkeit ist ein Shing Warten hier. Wir haben eine einfache Funktion, die Riffe Chuck Norris zitieren würde und die größte, um ein p i zu holen , die wieder zu versprechen. Also die erste Rückkehr, um mit verantwortungsvollen Objekten zu versprechen. Dann müssen wir den Jaysh in funktionalen Netzen aufrufen, die ein Versprechen mit den Daten zurückgibt. Und dann müssen wir einen Fang von Shalom dort haben, für den Fall in der Erde. Also lasst uns das mit asiatischem Kuwait umschreiben. In diesem Fall werden wir die Faktenfunktion aufrufen, und wir warten auf die Ergebnisse, zu antworten. Danach rufen wir die Antwortdelegierung an, um die Daten wieder zu erhalten. Es ist Renditen für Versprechen. Also haben wir dieses Gewicht benutzt und dass wir ausdrucken können. Das ist ein Witz. Da wir also eine Gewichtung verwenden, müssen wir diese Funktion ein bisschen ändern, die von Shin mit den asiatischen Schlüsselwörtern als asynchron deklariert wurde . Und du siehst, es funktioniert perfekt Spaß. Ich war menschliches Griechenland im Irrtum hier also nicht Aussichtspunkt zurück, wenn wir nur laufen, ein Fehler tritt zwischen jemals dort sehen, Also müssen wir einige Fehler klappern hinzufügen. Wir können einfach alles in einen normalen Versuch einwickeln. Fangen Sie genau wie Singleness Mantel, und es wird sehen, dass der Fehler gedruckt wird. Lasst uns an eurem Brunnen festhalten, damit wir jetzt tatsächlich Witze bekommen. Eine andere nette Sache mit dieser Syntax ist, dass wir reguläre Steueranweisungen verwenden können, die wir gerade verwendet haben . Wenn Anweisung hier, um zu sehen, ob die Antwort in Ordnung war und erst dann ein J. Shin bekommt und einen Witz ausdrucken. All dies ist viel einfacher zu tun als mit den versprechenden Schulrücken in Texas. Also lasst uns eine kurze Zusammenfassung machen. Wir benutzen eine Brille, weil sie vertraut ist. Opiat Torrent. Es ist in der Steuer. Wir wissen es. Für die meisten anderen Programmiersprache verwendet die neue Schlüsselarbeit Instanzen zu erstellen. Angeordnete alte Kartenprobleme, um ein Array in und ein neues Array aus einer anderen Form umzuwandeln. Jedes Element ist zugeordnet, in der Regel Kartenfunktion. Fete Arrow Funktionen sind eine schöne Möglichkeit, diese Mapping-Funktionen oder andere Funktionen zu deklarieren. Für diese Mutter Template Strings sind einfache Möglichkeit, Strings zu komponieren. Verwenden verschiedener Variablen. Verwenden Sie Konstante lassen Sie uns für Variablen. Der Geist lässt dich nicht oft ändern. Was du willst. Verwenden Sie wichtige Exporte, um verschiedene Funktionen zu kombinieren, viel besser als eine traditionelle globale Variablen zu verwenden, deren Objekt de Strukturierung, wenn Sie nur ein paar Eigenschaften erhalten möchten? Nein, noch eine andere gemeinsame Sache in reagieren. Sie verwenden eine Spüle warten mit dem holen ein P I oder, für diese Angelegenheit, mit jedem versprochenen basierend A P I wirklich nett. Sehen Sie im nächsten Video, wann ich alles über das Klassenprojekt erklären werde. 6. Das Kursprojekt: Ich bin wieder teilen. Willkommen zurück beim Gericht. Einführungskurs wird in diesem Video reagieren. Wir werden einen kurzen Blick auf das Tücherprojekt werfen, das wir für diesen Kurs durchführen werden. Also werden wir die Daten aus dem Film verwenden, um unsere eigene Filmanwendung zu erstellen. Es wird also so aussehen. Wir haben ein schönes Layout mit Materialdesign als Richtlinienschutz für unsere verschiedenen Filme. Und wenn Sie auf die Schaltfläche „Mehr erfahren“ klicken, erhalten wir weitere Details. Wir können auch Shirt wie hier. Ich suche nach Star Wars in der richtigen Hoffnung vom Bildschirm. Sie konnten die Suchkriterien sehen. Sie möchten die Anwendung hier ausprobieren. Es ist eine funktionierende Version. Wir können auf diesen Link klicken und es wird gestartet. Der Anwendungshost wird nun darüber nachschauen, wie die Anwendung dort gehostet werden kann. Hier können Sie die Details vom Guten Pate sehen, oder ich könnte nach Star Wars suchen. Werfen Sie einen Blick auf einen der Filme dort, so sehen wir uns im nächsten Video. Wir beginnen mit der Erstellung eines neuen Reaktorprojekts 7. Ein neues React erstellen: Hallo, Maurice. Hier. Willkommen zurück zu diesem reakt-Einführungskurs. In diesem Video werden wir einen Blick auf die Erstellung eines neuen Reaktionsprojekts werfen. Die meisten Menschen starten eine neue reagieren Projekte von Yuzhin Erstellt React App Great React, Ein Piss Dienstprogramm von der Facebook-Team entwickelt und macht es wirklich einfach, mit dem neuen React-Projekt zu beginnen . Das ist großartig. React App ist eine Notizanwendung, die Sie sicherstellen müssen, dass alte Zehe Ihre Entwicklungsmaschine bemerkt haben . Dies ist rein für Entwicklungszwecke und zur Laufzeit überhaupt nicht erforderlich. Also lasst uns loslegen und unsere Anwendung Gerüst ausbauen. zuerst sicher, Siezuerst sicher,dass die Notiz mit der richtigen Version installiert ist, also habe ich 8.9 Punkt eins notieren können, nicht nur verzögern, sondern gut genug. Als nächstes brauchen wir Zehenverwendung, NPM Zehe einen Stall, erstellen React-App, und wir brauchen einen Schreibtisch G für globale Flagge angegeben. Ich habe das schon getan, also werde ich es nicht noch einmal tun. Mit schafft reagieren auf, schwächen Gerüst aus dem neuen Projekt Wirklich einfach. Gehen Sie einfach React App erstellen. Geben Sie in diesem Fall den Projektnamen für Filme an, und drücken Sie die Eingabetaste. Es wird einen neuen Ordner mit dem Projektnamen erstellen, einige erzwungene Dateien erstellen, Pakete installieren und das wird ein wenig Zeit dauern, weil die Entwicklungspakete ziemlich groß sind. Und sobald das erledigt ist, können wir tatsächlich zu dem Ordner navigieren und die Anwendung mit MPM starten. Starten Sie und es gibt Anwendungen. Startet in der breiten Breite für Glückwünsche. Sie haben gerade Ihre erste Reaktionsanwendung im Terminalfenster ausgeführt. Du kannst sehen, dass es so ist. Öffnet die Veranda lokalen Host Port Ruhestand und auf der lokalen I p Adresse Sport dreitausend . Sehen Sie sich das nächste Video an, in dem wir das Projekt, das wir gerade erstellt haben, erkunden werden. 8. Das Projekt erkunden: Hallo, Marie Share. Willkommen zurück zu diesem Einführungskurs von Wrecked. In diesem Video werden wir das Projekt, das wir in dem verlorenen Video erstellt haben, untersuchen. Erinnern Sie sich an das Video, in dem wir verwendet erstellen reagieren? Nun, das werden wir uns jetzt ansehen. Wenn wir uns den Coach nicht ansehen und ihn später bearbeiten würden, brauchen wir eine Art Redakteur. Ich werde Visuals verwenden, um Mantel zu verhandeln. Sie können es auch verwenden, oder Sie können eine andere verwenden. Es spielt keine Rolle. React ist es nicht wirklich wichtig, was andere zu verwenden. Ich mag nur visuellen Studio-Code, weil er wirklich mächtig und einfach zu bedienen ist. Das ist also ein Leben in den Mantel. Hier sehen wir das generierte Projekt an der Spitze. Sie sehen den öffentlichen Ordner oder Baumdatei starrte FF Aiken Index sagte H Mill im Manifest. Jason. Der Index dot html ist für Marco für unsere Anwendung. Eine Siegellinie 28 ein leeres Jahr, def. Mit I D Route, die tatsächlich verwendet wird, um unsere Reakt-Anwendung zu rendern. Es ist noch nichts drin, aber es wird sein, wenn die Anwendung ausgeführt wird. Es gibt auch ein Manifest. Jason waren, was für progressive Waffen ist, müssen Sie sich jetzt keine Sorgen darüber machen. Der Hauptteil ihrer Anwendung ist in der Quelle. Voll oder so hier haben wir toe indiziert. Doch Js, das ist zwei und drei Punkte auf unsere Anwendung. Sie könnten das reagierende verwirrte Rendern sehen, das unsere Anwendung dieses Elements dort in das Roots-Diff macht , das wir vorher gesehen haben. Es gibt auch diese Register Service Worker. Ich werde auskommentieren Oberflächenarbeiter sind ziemlich genial, aber die Unterstützung von verschiedenen Browsern ist immer noch so was Buggy. Also für jetzt ist es das beste Nein zur Jugend. Und wo kommt es App, die von Will kommt, die im Apfelschach lebt? Und hier könnte man eine Nahaufnahme sehen, die die Reaktorkomponenten erweitert, die eine Renderfunktion hat , die etwas zurückgab, das wie Markierung aussieht. Dies ist nicht wirklich Markierung. Das nennen sie Js x Intacs. Und im nächsten Video werde ich mehr über J sechs erkundschaften. Für jetzt, nur Tinte über Es gibt Markup, die gerendert werden, wo in unserer Anwendung läuft. Also gibt es noch ein paar Dinge, um einen Blick auf den Rest zu nehmen ist nicht mehr Juwelen Ordner, der alle Mantel enthält, die wir nicht von NPM bemerkt. meiste davon wird benötigt, dass die Entwurfszeit nur unten im Vergleich zu pakistanischen Jason, der die Abhängigkeiten enthält. Sie konnten sehen reagieren React Dome, sowohl zuerst als auch 16.2, die die aktuelle Version ist. Im Moment erhalten Sie möglicherweise eine spätere Version. Dies sind die beiden Abhängigkeiten, die für die Laufzeit benötigt werden. Es gibt auch ein Abhängigkeits-Colt React Scripts, das zur Entwicklungszeit verwendet wird. Es wird nicht für die Laufzeit benötigt, aber es wird sicherstellen, dass wir einen Entwickler-Surfer haben, falsch oder gebündelt Protest und was sonst noch benötigt wird. Sie sehen vier verschiedene Skripte. Sie sehen das Startskript, dem ich das vorherige Video verwendet habe, um die Anwendung zu starten. Es gibt ein Build-Skript wird am Ende des Kurses verwenden, um Runtime bereitgestellte Version zu erstellen, und ihre beiden Skripte testen in Auswerfen Version zu erstellen, , die wir ignorieren werden. Für den Moment. Wir werden in einem anderen Kurs irgendwann in der Zukunft abdecken. Wenn Sie interessiert sind, so ist das im Grunde älter ist es. Wenn Sie mehr darüber lesen möchten, Vertrauen ist mir lesen Wenn ich die Vorschau öffne, ist es ein wenig lesbarer. Sie sehen Es gibt viele Informationen darüber, was in den USA erstellt und was es nicht tut, einschließlich wie es bereitgestellt wird. Wir werden uns das meiste ansehen, aber am Ende des Kurses werden wir die von uns erstellte Anwendung bereitstellen. Und werden Sie mehr zeigen, die Informationen aus diesem fiel für jetzt, Wenn Sie, die auf dem Radio. Gehen Sie voran. Öffnen Sie es einfach im Vorschaumodus und es lesbar die auf Schorsch selbst markierte, iss lesbar, aber nicht ganz so lesbar s zur Vorschau. Das ist also das Projekt. Und im nächsten Video werde ich alles über zwei J sechs Cent Steuern erklären und wie wir verwendet haben, um Reakt-Anwendungen zu bauen , Also sehen Sie dort. 9. Was ist JSX?: Also in diesem Rennen bin ich hier Rennen. Willkommen zurück zu diesem Einführungskurs. Also in diesem Video, werden wir darüber reden, was? Js exes. Also Js X ist nur syntaktischer Zucker. Es wird nur verwendet, um mit reagieren zu laden. Es ist also eine wichtige Rinde, um einen Blick darauf zu werfen. So reagieren Elemente werden mit einem Aufruf erstellt erstellen Element Funktion direkt erstellen. Nun, das ist einfach genug zu schreiben. Js X macht diesen Tulse-Index nur einen kleinen Anfall. Hier ist ein Beispiel dafür, wo die Komponente zur Laufzeit aussehen würde. Wir haben eine Klassen-App, die die Komponententücher von reagieren und innerhalb von zur Renderfunktion erweitert . Wir geben Aufrufe zurück zu reagieren, schaffen Elemente Problem zu einem Diff dort und Ness genannt. Es ist ein H und eine neue Reihenfolge Liste Elemente, die eine Liste Elemente enthält waren Truell Display Star Wars. Jetzt ist es nicht schwer, das zu lesen, aber es ist auch nicht der einfachste Syntex . Die JSX, die dies tatsächlich produziert, ist viel einfacher zu lesen. Sieht aus wie ein Tchmil. Es ist fast HTML nicht ganz, aber es liest die gleiche Weise, so dass dieser J-Sex transpire in zwei vorherigen JavaScript geölt wird. Also, was unterscheidet sich zwischen J. Sex und regulärem HTML. Nun, es ist eingebettete Einsicht von JavaScript. Also sind wir immer noch in einer Kloss, die Komponente erweitert, die Orender Funktion hat, die diesen JSX Index zurückgibt. Sie sehen reguläre def Elemente H ein Elemente, um Listenelement aufzulisten. All diese Elemente sehen vertraut aus. Es gibt jedoch eine kleine Sache, jedoch eine kleine Sache, wo Sie normalerweise ein CSS Tuch Attribute sehen. Hier. Es ist ein Klassenname. Dies liegt daran, dass Klasse reservierter Schlüssel in JavaScript funktioniert, also hat Direct Team beschlossen, Klassennamen anstelle von Schließen zu verwenden. Sie sehen auch diese geschweiften Klammern mit neuem Datum bis dato String. Alles zwischen geschweiften Klammern ist ein normaler JavaScript-Ausdruck, also ist es nur JavaScript mit ausgeführt und wird gerendert. In diesem Fall wird es nur ein aktuelles Datum als String gerendert. Nichts Besonderes ohne Einschränkungen sieht aus wie einige der Vorlagensprachen, in denen Sie nur sehr spezifische Dinge in Ausdrücken tun können. Nein, das ist nur JavaScript. Alles, was Sie in JavaScript Goche tun können. Begleiten Sie mich im nächsten Video, wenn ich alles über plappern erklären werde, was auch ist . Wir haben alle JSX in reguläres JavaScript transportiert, so 10. Was ist Babel?: Hallo, Marie Share. Willkommen zurück hierbei. Einführungskurs wird in diesem Video reagieren. Wir werden über Babel reden. Also, was Babble Babble tut, ist JavaScript-Compiler. Es kann im Grunde modernen Stil JavaScript kompilieren, das von älteren Browsern im Schlepptau nicht verstanden wird. Älterer Stil Javascript, die jeder Browser im Zaun. Aber es kann auch den React-Chase Extell-Code zwingen. Werfen wir einen Blick und sehen dies in Aktion. Erinnerst du dich an das Projekt, das wir Nun, wir hatten diese App-Komponente mit J s X, die so aussieht. Lasst uns das kopieren und in die Schlacht gehen. Das ist also die Bibelwebsite, die sie sehen konnten. Hier steht Babel ist JavaScript-Compiler, ihre Hunde Haare. Und es ist eine sehr gute Website im Allgemeinen. Aber eines der netten Features ist, dass wir es hier ausprobieren können, damit es tatsächlich unseren Coach in der Broschüre genau hier aufbauen kann . Sie könnten sehen, es zwingt es on the fly und auf der rechten Seite sehen wir die Ausgabe. So sehen Sie die Anrufe zu reagieren erstellen Elemente, wie wir im vorherigen Video gesehen haben. Also, warum zeige ich plappern, um das zu tun? Nun, als wir eine Anwendung mit erstellt haben, erstellen, reagieren darauf wird gesagt, plappern von ausgelöst den ganzen Werkzeugsatz. So verwendet es plappern hinter den Kulissen, um alle zu durchlaufen. Alle sind weit JavaScript in JavaScript. Die Broschüre im Sinne, einschließlich der Jays X. Also kommen Sie mir nächstes Video, wenn ich Ihnen zeigen werde, wie Sie beginnen, reagieren Komponenten zu erstellen. 11. Erstellen einer neuen React: Hallo, Marie. Sheer Willkommen zurück zu diesem Einführungskurs von reagieren. In diesem Video werde ich Ihnen zeigen, wie Sie eine neue Reaktionskomponente erstellen und sie verwenden. Also lasst uns direkt in den Mantel eintauchen, damit ich meinen kurzen Fuller nicht mit allem überladen möchte . Das erste, was ich mache, ist, einen Komponentenordner zu erstellen, alle meine Komponenten unter der Quelle zu halten. Fuller, stellen Sie sicher, dass das unter der Quelle ist, und da werde ich einen neuen Sturz erschaffen. Hier geht es um Filme, also werde ich einen Filmwagen erstellen. Jazz nicht hier drinnen. Das erste, was Sie tun müssen, ist, die Reaktions-Bibliothek aus Reaktionen zu importieren. Als nächstes müssen Sie eine neue Klasse erstellen. Wir rufen diese Filmkarte an, und das wird sich von den reaktiven Komponenten der Basisklasse erstrecken. Diese Klasse erfordert also falsche Methoden ergeben, und es wird etwas Markierung zurückgeben. In diesem Fall werden wir es sehr einfach halten. Wir werden nur die Tatsache zurückgeben, dass es sich um eine Filmkarte handelt. Schließlich müssen wir diese Nähe exportieren, damit wir sie woanders verwenden können. Das verwendet den Exportstandard. Jetzt müssen wir immer noch neue Komponenten verwenden. Also lassen Sie uns auf die App gehen Brust up Komponenten. Lassen Sie uns den ganzen Inhalt da drin loswerden. Wir spenden. Es wird nur in die Quere kommen. Ich muss nicht mehr langsam gehen. Ist das, lassen Sie uns unseren Filmwagen importieren und rendern es s Teil von unserer Komponente. Wenn Sie also etwas aus der Anwendung importieren, sollten Sie immer einen relativen Pfad mit so amüsanten Importen verwenden. Schrägstrich Komponenten nicht Schrägstrich Filmwagen. Fügen Sie also die Moviecard-Komponenten in die Kapitulation ein und sehen Sie, dass wir jetzt einen Filmwagen rendern . Jedes Mal, wenn wir Änderungen an der Filmkarte vornehmen, werde ich es automatisch aktualisieren. Also, wenn es sich geändert hat, tun Sie dies ist der Filmwagen durch. Die Anwendung wird automatisch im Browser aktualisiert. Cool, richtig. So sehen Sie sich im nächsten Video, wo ich erklären werde, wie Requisiten für vergangene Daten für eine Komponente in die nächste zu verwenden. Wir sehen uns dann 12. props zum Übertragen von Daten verwenden: Hallo, Marie. Schiere willkommen zurück zu diesem Einführungskurs wird reagieren. In diesem Video werde ich Ihnen zeigen, wie Sie Requisiten für vergangene Daten von einer Komponente zu einer untergeordneten Komponente verwenden . Also lassen Sie uns Freitag beginnen, um von hier die Trap-Komponente zu gehen und haben bereits eine neue Variable namens Star Wars erstellt , die Filmobjekt hält. Es gibt eine Vorstellung von einem und dem Titel „Star Wars“. Das ist es, was ich in die Film-Wache geben will. Also die Filmkarte. Es geht um die Anzeige von Filmen. Also werde ich Ihr Eigentum namens Movie benutzen. Und da werde ich Zehe geschweifte Klammern benutzen, um in dem Ausdruck von Star Wars zu Boss. Jetzt, in der Filmkarte, möchte ich diese Daten verwenden. Also oben in meinem Rendern, kann ich diese aus einer Eigenschaft auf den aktuellen Objekten namens Requisiten extrahieren So schließen ein Film ist distale Requisiten, die den Film von den Requisiten und dann innerhalb meines Tages zurückgibt. Wenn ich es tatsächlich verwenden kann, kann ich den Titel anzeigen. Also da, das bist du. Ich zeig Star Wars. Wenn ich gehe zurück in die App und änderte den Titel in etwas, Els starten Wrack, zum Beispiel, es widerspricht Ihnen. Ich kühle sofort ab, oder? Also kommen Sie mir nächstes Video, wenn ich zeigen werde, wie Sie mit einem Rennen aus Daten in sich wiederholende Elemente arbeiten können . Wir sehen uns dann. 13. Repeating: Ich bin hier Rennen. Willkommen zurück zum Gericht Einführungskurs von reagieren. In diesem Video werden wir über das Wiederholen von Komponenten sprechen, also lasst uns direkt in den Mantel eintauchen. Hier ist also unser vorheriges Projekt mit einer leichten Änderung anstelle eines einzigen Films. Star Wars of Good, eine Sammlung von Filmen mit Star Wars, Star Trek und Late Runner macht immer noch den ersten Film Teig. also keine Veränderung. Wie rendern wir sie alle? Nun, wir könnten die Filmkarten-Komponente wiederholen, aber das ist nicht wirklich nützlich, denn sie müsste wissen, wann das Geld hat, wie viele Filme sind. Ja, das ist, wir werden Ihren Java-Skript-Ausdruck verwenden. Wir werden diese Ray-Map-Funktion verwenden, um die Reihe von Filmen zuzuordnen und in eine Filmkarte für jedes Element im Array zu verwandeln . Boss im Film Der Debug und wir sind gut zu gehen, außer wenn wir den Debug hier öffnen könnte einen Fehler über eine fehlende Schlüsseleigenschaft sehen. Jedes Mal, wenn wir Wiederholungselemente waren, müssen wir sicherstellen, dass wir Eigentum behalten müssen, was einzigartig ist. Also in diesem Fall haben wir den Film I d. Ich werde verwenden, dass s der Schlüssel, und unser Fehler geht. Also nur eine kurze Zusammenfassung werden wir mit Rehmat-Funktion loopy. Wir trafen jeden Film in der Sammlung zu einem Film Komponenten, und wir sagten, um Eigentum zu halten, so reagieren weiß, welcher Film mit welchem kann Telefone verbunden ist . Wir sehen uns das nächste Mal, wo wir über das Staatsmanagement reden werden. 14. Staat verwalten: Ich bin Orisha. Willkommen zurück zu Ergänzungen. Reduktionskurs wird in diesem Video reagieren. Wir werden über das staatliche Management innerhalb von Reaktorkomponenten sprechen, also tauchen wir direkt in den Mantel ein. Also hier ist unser vorheriges Projekt gerade geändert Inning von der ursprünglichen Filme-Sammlung. Aber abgesehen davon ist es das Gleiche. Das erste, was wir tun müssen, ist eine Zustandseigenschaft zu unseren Komponenten hinzuzufügen und den Anfangszustand dort anzugeben . In diesem Fall wird der Anfangszustand nur auf einem leeren Array von Filmen innerhalb der zu rendernden Funktion sein. Wir wollen dies verwenden, so dass wir verwendetto Objekt de Strukturierung Syntax, um Filme aus dem Zustandsobjekt zu bekommen . Also, jetzt werden unsere Komponenten mit einem leeren oder einem von Filmen rendern. Als nächstes müssen wir die Zustände aktualisieren, um diese Liste von Filmen zu zeigen, die diese Mount-Lebenszyklusfunktion zu komponieren verwendet . Denn das ist dieser Trigger Kurz nachdem die Komponente nach dem ersten Rendern gemountet wurde, wird es verwendet, um Statusfunktion auf der Komponente zu mehr zu vergießen. Der Freitagsstatus, der die Bühne ändert, löst die Komponente aus, die erneut gerendert werden soll, so dass sie jetzt zweimal mit einem leeren Array und einem mit dem Filter rechts gerendert wird, hat die Komponente eingehängt. Lebenszyklusfunktion ist auch eine gute Möglichkeit, ein Schindelsverhalten zu starten. Wir werden es vorerst mit der festgelegten Zeit vortäuschen. Also änderte ich den Zustand erst nach ein paar Sekunden mit den Filmen. Also haben wir eine leere Seite gesehen, keine Filme, und nach ein paar Sekunden sind sie tatsächlich geladen. Also lasst uns eine kurze Zusammenfassung neu, die wir brauchten, um die Status-Eigenschaft hinzuzufügen, um Komponenten zu tun, die wir verwendet haben, um Komponente dit Mount-Lebenszyklusfunktion zu Trigger Nation zu komponieren, oder dieses Verhalten verwendet, um die Zustandsfunktion Toe Update Estate zu setzen , die zur Komponente hintere Ender und Innenseite der zu rendernden Funktion. Wir lesen die Daten aus dem Zustand, also schließen Sie mich das nächste Mal an, wenn ich Ihnen zeigen werde, wie Sie Daten aus einem Anteil oder Illusion in Ajax Schoolladen Ajax School 15. Daten mit einem AJAX laden: Hi, Rennen hier. Willkommen zurück hierbei. Einführungskurs wird in diesem Video reagieren. Wir werden einen Blick auf, wie man eine Deck Schulen und Low Trim Daten aus dem Sheriff machen für so der Sheriff für die Arbeit an der Verwendung ist der Film D B. Es ist eine großartige Website, die populäre Filme unter anderen Dingen listet. Aber das Wichtigste für uns ist, dass es ein nettes A p I hat. Also hier sind die eigentlichen Websites. Dies ist die Liste an der Zusammenarbeit von Filmen interessiert waren, so dass Sie nur ein Konto auf dieser Website zu erstellen. Und sobald Sie in dem Land haben, können Sie Ihre Einstellungen und das Innere der Einstellungen gehen. Du wirst deinen A P I Schlüssel finden. Rollen Sie die Bits runter. Hier finden Sie die Taste A P I. Sie müssen drei Versionen füttern. Kopieren Sie das und gehen Sie zur Entwicklerseite. Hier erfahren wir alles über die Dokumentation für alle möglichen Dinge, die wir verlangen können. Aber in unserem Fall sind wir an den Filmen interessiert. So die am besten bewerteten Filme können wir tatsächlich versuchen, dass das Leben von dieser Seite in Ihrem a P I Taste basiert und scrollen Sie nach unten Obits und ausführen, um anzufordern. Und hier konnten wir die Antwort mit der Liste der Filme in den Ergebnissen sehen. Eigenschaft. Lass uns gehen, Pete, ist dein L. und gehen wir zurück zu unserer Bewerbung. Wenn die Anwendung statt Versatz Filme auf eine feste Liste, werden wir eine Alter tatsächliche Frage zu tun. Also sind wir gewohnt, um Funktion zu holen und gut in den Euro basiert, und wir werden zurück Ticks verwenden, damit wir leicht den A P I Schlüssel injizieren können , den ich vom FBI importiert habe. Keitel Js Datei. Sie müssen sicher auf einen P-I-Schlüssel zahlen. Sie behoben, weil die Fetch-Funktion isation Guinness es ist Rückkehr für ein Versprechen. Wir müssen dies zu einer Alterungsfunktion machen, also haben wir die Präfixkomponente mit einer Senke montiert. Jetzt können wir dieses Gewicht auf dem Abruf verwenden, um auf das Versprechen zu warten. Dies wird tatsächlich ein Antwortobjekt zurückgeben, das uns alles über die Antwort erzählt. Also eine Sache über die Erziehungsfunktion der Antwort, die wir verwenden können, um Daten abzurufen, gibt es ein anderes Versprechen zurück. Also müssen wir wieder ein Gewicht an diesem Jason Day, der heute ist, dass wir gerade gesehen haben, wenn wir testen, es ist der Euro auf der Website. So hat es eine Ergebniseigenschaft, die tatsächliche Filme enthält. Also werden wir das für den eingestellten Zustand verwenden. Nun, wenn Sie zurück zur Stirn gehen und sich die Replikation ansehen, können wir sehen, dass sie tatsächlich die Filme auflistet. Wir sind einfach so im Film, um ziemlich cool zu sein, oder? Wirklich einfach bis niedrig Datum auf diesem Weg. Also, was das einfach tun würde. Wir haben verwendet, um Funktion zu Anfragen Ajax-Daten zu holen, die wir auf einer Sing-Funktion erstellt und verwendet, um die Versprechen zu warten, um zu lösen und diejenigen, die wir den Tag hatten, an dem wir die Zustandsfunktion wieder eingestellt haben, wie zuvor, um die Komponente mit die Liste der Filme. Also, wir sehen uns das nächste Video. Wir werden einen kurzen Blick auf das Materialdesign werfen, das verwenden wird, um unsere Anwendung ein schöner aussehen zu lassen. 16. Materialdesign: Ich bin hier Rennen. Eine willkommene zurück Schulungen Reduktion Kurs wird in diesem Video reagieren. Wir werden einen Blick darauf werfen, was Material Design ist und wie Sie es zu Ihrer Anwendung hinzufügen können . Also, was dieses Material Design Material Design? Issa Design Sprache von Google. Es ist ein einheitliches System, das kombiniert werden muss. Ressource ist, und Sie sind Komponenten zusammen, um eine schöne U. Y.-Anwendungzu erstellen U. Y.-Anwendung . Es kommt mit CSS und vielen Anleitungen, wie man es benutzt. Es ist wirklich um Papier entworfen, wie Papier auf eine traditionellere Art und Weise verwendet werden würde, und erstellen Schichten über einander. Aber es fügt eine Menge von Interaktivität hinzu. Wie Sie im Moment sehen werden. Es ist sehr interaktiv, zum Teil wegen seines mobilen Erbes. Eines der Dinge, die es selbst sehen könnte, ist Kartenkomponenten in der Kartenkomponente ist eine wirklich schöne Möglichkeit, ein Bild zu kombinieren, das Text wird und vielleicht zusätzliche Flaschen wie reagieren zurückkommen , dass das verwenden wird, um unsere Filme anzuzeigen. Wir könnten Materialdesign SS verwenden, aber in der Reaktionswelt ist es einfacher, Material zu verwenden, das Sie y der beliebteste Weg, um Materialdesign-Anwendung mit reagieren zu erstellen . Es besteht aus einer Reihe von reagierenden Komponenten, die Sie verwenden können. Werfen wir einen Blick auf die Website. Also hier ist, um Material Sie wai Website. Wie Sie aus Little Banner Version einen Punkt sehen können, den ich kam. Wenn du das nicht siehst, sagte Banner, wenn du dieses Video ansiehst, könnte es bereits aus sein. Aber gerade jetzt für Sie, einer ist noch in der Beta. Sie können auch hier sagen, dass die aktuelle Version 0.20 ist. Da der eine Punkt über Gin ist ganz anders. Ich würde eine empfehlen, die 0.20-Version zu überspringen oder was auch immer es zu der Zeit sein könnte, und gehen Sie zu dem einen Punkt über Gin, wenn das noch nicht endgültig ist. Also für klicken Sie auf den Link, wir kommen zu den Nachrichten Oh, Versionen. Wir könnten uns ein paar von den Komponenten ansehen. Werfen wir einen Blick auf eine einfache Schaltfläche, und hier können Sie flache Tasten sehen, die Sie sehen können, ob ich mit der Maus über sie schwebe. Sie leuchten irgendwie auf. Auch, wenn ich auf sie klicke, können Sie diesen welligen Effekt sehen , der irgendwie schön ist. Keine soc verschiedene Tasten hier noch der Welligkeit Effekt hier. Die Kartenkomponenten. Wir werden eine wirklich einfache Karte benutzen. Siehst du, es sieht ein bisschen aus wie ein Blatt Papier auf dem Tisch mit etwas Text drauf. Oder in diesem Fall, eine Karte mit einem Bild sind einige Text und ein paar Flaschen, die irgendwie wie das, was wir tun werden. Die at bar Komponente, die eine andere Komponente verwendet wird, zeigte einen Titel aus der Anwendung optional mit einem Hamburger-Menü und vielleicht eine andere Menüoption hier zu Logan. Art von schön und einfach zu bedienen. Wenn Sie also anfangen möchten, müssen Sie zuerst Material installieren. Also lasst uns das kopieren und zum Kontrollfenster auf PlayStation gehen. Haben wir es gestohlen? Die andere Sache wird tun müssen, ist installieren Sie den Roboto gebildet, weil er hier der Link zum Google AP Augenblick, um es zu installieren. Also lasst uns das kopieren. Gehen Sie zum Editor öffnen Sie den Index dreht sich zu Mel und unter dem APP-Titel Schwächen basiert. Da ist drin. Es wird auf die falsche automatisch von Ghul FBI-Seite heruntergeladen. Nun, wir sind hier mit meinem nur wird den Titel ändern, weil wir nie dazu gekommen sind, das zu tun. Also lassen Sie uns das Top-Filme nennen. In der Zwischenzeit wurde Material installiert und wir konnten die Anwendung erneut ausführen, aber es gäbe nichts zu sehen. Also lasst uns diesen Teil vorerst überspringen. So sehen Sie das nächste Mal, wenn wir die at bar Komponenten als oben auf unserer Seite verwenden und wirklich beginnen, die Materialien entworfenen Komponenten zu verwenden. Wir sehen uns dann. 17. So fügst du die AppBar hinzu: Hallo, Marie. - Sir. Willkommen zurück zu nur Einführungskurs reagieren wird. In diesem Video werden wir die at-Bar-Komponente aus Material hinzufügen, das zu unserer Anwendung entwickelt wurde. Das ist also nicht bei BAR. Es ist eine einfache Bar. Art einer Werkzeugleiste. Das war's. Also die Spitze ihrer Anwendung und es ist ein zentraler Ort für einige Aktionen, wie Abmelden oder Suchen. Sie wissen, gehen implementieren Does waren gerade dabei, eine wirklich einfache Bar zu implementieren und den Anwendungstitel in ihrer Art für das Branding zu setzen . Also lasst uns in den Mantel eintauchen. Hier ist Ihre Anwendungskomponente, und gerade jetzt alle von uns ist nur eine Liste von Filmtiteln zeigen. Also lass uns das ein wenig schöner machen und in einer Bar hier drinnen hinzufügen. Wenn Sie auf das Material gehen Sie y Dokumentation. Wir konnten die in der Bar Andi sehen. Wenn wir auf diese Schaltfläche klicken, geben wir die tatsächliche Kraft-Schicht zu. Wenn Sie sehen, dass eine Reihe von Dingen importiert werden, lassen Sie uns diese Importe kopieren. Sie haben wirklich einfachen Stil. Das ist auch eine Kopie, dann haben sie nicht bei der Barkomponente. Lasst uns noch hoffen. Das gehört auch tatsächlich dazu. Wenn das Einfügen in Onda ist, fügen wir eine zusätzliche Schließung hinzu und wenn und wir eine weitere Sache tun müssen , wenn wir gut exportieren, müssen Sie das verwenden, was Stile höherer Ordnung Funktionen und beachten Sie die einfache Bar aber unsere Komponenten. Also mal sehen, wie das aussieht. Wir brauchen diese Straße nicht in der Nähe. Wird aber besorgt . Das und ihre scharfe Barkomponente sieht weiß auf Kerl je ganz so aus. Sie änderten tatsächlich ein Standard-Golar-Haar von dem, was immer es wäre primär auf Standard gewesen . Ich bevorzuge die primäre, also hebt es ein bisschen mehr hervor. Wir bekommen diese bläuliche Farbe, die Aussicht, nichts, was ich jetzt ändern möchte, wenn wir scrollen. Dieser Balken scrollt tatsächlich aus der Ansicht heraus. Also habe ich links die Position von statischen Zehe einen anderen Wert gesetzt, ich denke, dass diese Werte hier unten finden. Wenn Sie eine Definition für eine Bar einräumen, können wir dorthin gehen. Sie haben zugegeben, dass es zwei verschiedene Werte für die Position gibt. So fixiert, absolut klebrig oder statisch, richtig, das wäre statisch. Also lasst es uns reparieren, was du es an den oberen zwei in der kleineren beheben würdest. Jetzt können Sie sehen, ob ich diese Balkenstation Anwendung scrolle. einzige Sache ist, die Top-Filme sind dahinter, also müssen wir dort ein wenig Polsterung hinzufügen. Aber wir werden das tun, wenn wir anfangen, Karten zu erstellen. Es gibt eine spezielle Art von Symbolleiste. Es fügt Brendan zur Anwendung hinzu, macht es einfacher zu sehen, welche Anwendung oder in ihr fügt einen schönen Ort für globale Aktionen wie Suchen, Ausschauen oder Navigieren zu anderen Teilen der Anwendung hinzu. So sehen wir uns als nächstes, um Sie beim nächsten Mal zu sehen, wo wir Filmwächter erstellen, um ältere einzelne Filme zu halten . 18. Eine Filmkarte erstellen: Hallo, Murray ist hier. Willkommen zurück hierbei. Einführungskurs wird in diesem Video reagieren. Wir werden die einfache Liste von Filmtiteln in schön aussehende Filmautos ändern. Wir werden ein Design wie dieses verwenden. Ich werde ein kleines Bild zeigen, den Titel aus dem Film, die kleine Beschreibung und wir werden für Button haben, die noch nichts in diesem Video tun wird. Wir werden das im nächsten Video tun, aber es wird dazu führen, die Filmdetails zu sehen. Also lasst uns jetzt gleich in den Mantel tauchen. So sieht unsere Anwendung aus, und das erste, was ist, dass wir die Liste haben. Aber ein Teil von der Liste ist eigentlich hinter Ah bei BAR, also müssen wir etwas Platz machen, um die Filmliste unter dem auseinander zu zeigen. Also lassen Sie uns hinzufügen, einige sieht das zu tun haben, also ist das besser. Nun, wenigstens sehen wir den ersten Film. Als nächstes wollen wir uns eine Filmkarte schnappen, gehen wir zu den Material-Design-Seiten und werfen einen Blick auf den Quellmantel hier. Wir können das Markup für diesen Warenkorb sehen, also lassen Sie uns einfach kopieren, dass es eine große Bereinigung gibt. Wir müssen es tun. Dieser Klassenname existiert nicht, aber wir müssen dort eine Klasse durchführen. Also lasst uns am Ende der Filmkarre. Eigentlich ist das das Filmbild Digits the movie cart und hier drin, anstatt Lizard zu sagen, lassen Sie uns den Filmtitel dort setzen, damit wir eine Liste von Filmtiteln sehen. Das Layout ist noch nicht sehr hübsch. Wir haben kein Bild, das spuckt. Das ist das zuerst zu beheben. Also, um das Bild anzuzeigen, müssen wir einen Blick auf Rückkehr Jason Data nehmen. Also hier habe ich ein Beispiel. A consider ist eine Eigenschaft zurück Drop Off, die diesen Dateinamen aus dem tatsächlichen Bild enthält, aber es ist nicht der vollständige Buff, den es nicht zum vollständigen Pfad gelangen würde. Film-Datenbank ist ein anderer AP. Ich rufe an, wo Sie die Konfiguration erhalten können und es wird die Basis zeigen. Ural in der Differenz erlaubten Größen und durch Kombination von Dosis zu wits die eigentliche Hintergrundbilddatei . Wir können den kompletten Buff bekommen, und eine Kulisse wird ungefähr so aussehen. Also lasst uns das kopieren. Wir sehen immer noch kein Bild, aber das liegt daran, dass der Standard IMA tchite Hero-Pixel ist. Müssen wir eine bestimmte angeben? Wenn Sie sich dieses Bild ansehen, könnten wir eine Drei auf der Dwight sehen. Die tatsächliche Höhe der Grenzwerte beträgt 196 Pixel. Lassen Sie uns verwenden, dass genug von den zusätzlichen Anführungszeichen entfernt , die nicht brauchten Es gibt Bilder. Sie sehen noch nicht sehr hübsch aus, denn standardmäßig wird die Karte das volle Gewicht vom Bildschirm nehmen, was ein bisschen zu viel ist. Wir wollen, dass ein Auto 300 Pixel weiß ist, also lassen Sie uns einige aufhören, das zu tun. - Das ist besser. Die alten Trailer-Pixel. Es ist immer noch eine lange Liste, also lasst uns das ändern. Um dies zu tun, müssen wir der Liste von Filmen sagen, dass es nicht nur die Massen rendern sollte. Aber Sie hatten einen Musiker oder Flex verpackt gerendert und dass wir einen schönen Stall von Filmen haben, und je nach Bildschirmgröße wird die Anzahl der Filme zunehmen oder zu verringern. Aber, wie auf dem kleinen Bildschirm wird nur eine einzige Liste haben. Aber auf meinem Laptop bekommen wir eine Liste oder vier Filme zusammen. Schön. Also lasst uns die Beschreibung geändert, um das richtige Feld zu sein. Wir haben eine schöne Liste von Filmen, einschließlich des alten Textes, wenn wir darüber hinwegkommen. Wir haben die Schaltfläche „Mehr lernen“ noch nicht verkabelt, aber wir werden diese nächste Lektion so materiell machen. - Warum? Einkaufswagen sind eine gute Möglichkeit, Informationen wie diese zu präsentieren, entweder wiederholte oder einzelne Artikel. Aber in diesem Fall mit guter Wiederholungsliste von Filmen, sind sie ideal für das Hinzufügen von Bildern, Aktionstasten. Das war, was Frankreich brauchte, wie wir es bei dieser Gelegenheit getan haben. Wir sehen uns nächstes Jahr, wenn wir uns das ansehen werden, indem wir die Move-Details in einem Pop-up-Fenster spielen . Wir sehen uns dann. 19. Filmdetails anzeigen: Hallo Erinnerungen hier. Willkommen zurück zu diesem Einführungskurs von Wrecked In diesem Video. Wir werden einen Blick auf mehr Filmdetails werfen, also lasst uns direkt in den Mantel tauchen. Also hier sind unsere Anwendungskomponenten, und im Moment haben wir nur die Liste der Filme. Aber wir werden den Auswahlfilm hinzufügen, um es, wenn wir auf den Film klicken, um mehr anzuzeigen wird dieser selektive Film Jahr Zustand ändern. Um dies zu tun, benötigen wir eine ausgewählte Filmfunktion, die sich in den Zustand ändert. So haben wir die Zustandsfunktion gesetzt, um den selektiven Film in dem Zustand zu aktualisieren. Denken Sie daran, nie geändert den Zustand direkt, wer müssen auch in der Lage sein, seine Schale zu löschen, wird einen klaren Film hinzufügen, um den selektiven Film wieder auf Nein zu setzen. Jetzt müssen wir diesen ausgewählten Film auf die Moviecards-Komponenten übergeben, so dass es sein könnte, dass Sie für ihre zeigen. Also in der Filmkarte, erstellen wir eine neue Funktion wählen Film, wo wir diesen wie Film von den Requisiten zusammen mit dem Film, den wir den Film auswählen mit diesem Film. Also in den Kartenaktionen haben wir die Schaltfläche und wir Adam Click-Handler und rufen Sie den ausgewählten Film auf den aktuellen Komponenten dort. Denken Sie daran, einen eigenen Klick mit Kamelgehäuse zu verwenden. Nein, wenn wir klicken, um mehr zu erfahren Schaltfläche, wird der Zustand tatsächlich aktualisiert, aber das ist, dass wir nicht überprüfen, die Zustände tun etwas damit. Wir können sehen, dass So eine schöne Möglichkeit, es anzuzeigen ist mit Dialog, so dass wir es verwenden. Gebildet. Ich schaue aus Material Sie. Warum? Also lassen Sie uns den Code von dort kopieren und einen neuen Komponentenfilm erstellen. Sterben. Sieh mal. Es wird den gesamten Quellcoach da drin basieren, also gibt es ein paar Dinge, die wir nicht brauchen. zuerst Lassen Sie unszuerstden Namen in Film Die ändern. Hören Sie, wir müssen den Griff nicht angeben. Klicken Sie auf Öffnen Bestell-Handle geschlossen. Wir können loswerden, diese Staat wird auf der Anwendungsebene verwaltet. Also in der Render-Funktion Reue Film , der übergeben wird, in dem der aktuell ausgewählte Film sein wird, haben auch den Griff in der Nähe der Funktion, die später übergeben wird. Nun wird der Dialog geöffnet, wenn der Grund Film ausgewählt. Also haben wir einen Double Bang Operator verwendet, um ein Objekt oder nein in eine wahr oder falsch zu verwandeln, also gehen wir zurück zu den APP-Komponenten und beinhaltet diesen Film Die. Schauen Sie dort hinein, wir werden es importieren und dann wird es mit dem ausgewählten Film rendern. Auch müssen Sie sicherstellen, dass in den Griff geschlossen Funktion übergeben, in dem, wo wir den Film löschen, die auch am nächsten sterben wird. Sieh noch mal nach. Für den Moment. Wenn wir klicken, wird mehr erfahren, sehen wir eine schöne motile sterben aussehen Pop-up. Wenn wir außerhalb davon klicken, verschwindet es wieder. Also lassen Sie uns tatsächlich den Titel des Films anzeigen. Wenn Sie nur den Filmtitel als ISS verwendet haben, wird Hair tatsächlich einen Laufzeitfehler erhalten. Dies liegt daran, dass der Film manchmal kein so Film ist. Der Titel wäre DVF, das eine Eigenschaft auf dem No-Objekt spült. Also müssen wir das etwas anders machen. Sie wird eine Titelvariable erstellen und standardmäßig wissen, welche Valets als Reags-Komponenteninstanz ist , und nur wenn der Film Opie Act tatsächlich auf einen tatsächlichen Film eingestellt ist, wird die Titelkomponenten erstellen . Ich würde die geschweiften Klammern in Steuer verwenden, um den Titel dort zu rendern, also entweder keine oder sterben Look Titel und ich würde uns Ihren Namen machen oder zu gehen eingereicht sind abhängig davon, welche Film echte Ucat , So können wir das gleiche mit dem Inhalt tun, das Volle zu wissen. Und wenn wir einen gefiederten Film haben, rendern Sie Inhaltskomponenten. Sie brauchen auch nicht beide von den Flaschen. Also lassen Sie uns nur eine einzige Schaltfläche dort haben, die als Closed und Course ein Close-Handler bezeichnet wird. Lassen Sie uns also einige weitere Details aus dem Film anzeigen, der den Film Übersicht hat. Das ist der Text dort. Und lassen Sie uns diese Textfelder aktualisieren, um das Veröffentlichungsdatum des Films anzuzeigen. Nein, wir sehen die Filmbeschreibung und veröffentlichen das, aber das Veröffentlichungsdatum war immer noch unschlagbar. Lassen Sie uns also dieses Textfeld deaktiviert, damit es geändert werden kann. Aufzählungszeichen Anzeigen das Film-Bild aufblähen Übersicht. Wird ATS der eigentliche Film, äh, prahlerne Bild. Achten Sie darauf, eine korrekte Klassen zu importieren, und wir brauchen nur Kark mich, Ihre Notizen, die anderen Teile aus der Wache, genau wie bevor wir einige CDs brauchen, um das Bild tatsächlich in die richtige Größe zu geben. Es wird das Bild aktualisiert, um das Poster anstelle des Backdrop anzuzeigen und ihm einen anderen Klassennamen zu geben , da es eine andere Größe hat. Wir haben ein paar Reparaturen. CSS mit dem richtigen mit und Höhe, und hier sehen wir das Poster für The Pate. Lassen Sie uns also einige weitere Textfelder hinzufügen, um weitere Details über den Film anzuzeigen. Nein, nur ein Veröffentlichungstermin, sondern auch die Popularität und die Abstimmungsmittelzahl zählen. So schnell zusammenfassen. Wir haben den Anwendungsstatus verwendet, um den ausgewählten Film zu verfolgen. Wir haben den Anwendungsstatus mit der Callback-Funktion aktualisiert. Wir gingen in die Movie-Karte, und wir verwendet, um materiell Warum Dialoge Klasse, um die Film-Details anzuzeigen. Begleiten Sie mich beim nächsten Mal, wenn wir einen Blick darauf werfen, wie man nach anderen Filmen sucht. 20. Suche für Filme suchen: Ich bin Widder hier. Willkommen zurück hierbei. Einführungskurs wird in diesem Video reagieren. Wir werden darüber reden, nach anderen Filmen zu suchen, also lasst uns direkt in den Mantel tauchen. Hier ist unsere aktuelle Anwendung, und das Hinzufügen einer Sucheingabefelder rechts oben neben dem Bildschirm in der APP-Leiste wäre ein guter Ort, um zu beginnen. Also hier ist unsere APP-Komponente mit der at Bar. Lassen Sie uns ein Formular Eingaben nach dem Titel hinzufügen. Wir werden das für unsere Hemden im Stiefel verwenden. Und wenn wir die Kanzlei einreichen, wollen wir mit der Kirche beginnen. Also fügen wir einen bekannten Submit-Handler hinzu, um Ajax School von dort aus zu machen. So ist die Suche sehr ähnlich wie das Laden der oberen rechten von Filmen. Wir müssen das Ereignis unseres verwenden, da HTML standardmäßig die Seite einreicht und die Anwendung neu lädt. Also müssen wir das Standardverhalten verhindern. Sie müssen auch ein wenig zu Ihrem L wechseln. In diesem Fall werden wir suchen. Es ist weniger Film. Wir müssen den Shirts Text zur Verfügung stellen. Also lassen Sie uns injizieren, dass wir nicht tatsächlich die Hälfte haben, die nicht zwischen hinzugefügt in einer Minute. Also wird sich die Suche Texas ändern, also bekommen wir die von den Staaten, wir werden initialisieren. Es ist als leere Zeichenfolge im Zustand, also lassen Sie uns ein Eingabefelder in das Formular einfügen. Ich werde nicht vorvorbereitet, also musst du nicht zusehen, wie ich es tippe. Ihr werdet sehen, dass sein Wert die Suche ist, Tex. Und wann immer es aktualisiert, wird es ein gesuchtes, ausgetauschtes nennen . Also lassen Sie uns bekommen, um Text aus den Staaten zu suchen und das ist implementieren, das ausgetauscht Gold zurück gesucht hat. Also an dieser Stelle möchten wir ändern, um als nächstes im Zustand basierend auf dem tatsächlichen Wert aus der Eingabe zu suchen. Das Ereignis ist also aktuell. Sagen Sie uns, welche Eingänge ISS mit der Zieleigenschaft und das als Wert, der der tatsächliche Wert in den Lehrbüchern ist. Sie also sicher, dass zwei erforderliche Importanweisungen für die Eingabe und die Importverzierung enthalten sind. Also bleiben sie im Stich. Es ist direkt hinter Top-Filme auf der linken Seite Notiz auf der rechten Seite noch, Jedoch, wenn wir versuchen Shorting, wir bekommen einen Fehler in der Paris Ich habe einen Fehler im Euro gemacht. Ich habe vergessen, den Queria-Parameter einzubeziehen, weißt du, mit dem Abfrageparameter funktioniert es besser, und ich könnte nach Star Wars-Filmen suchen, also lasst uns zu Kirchenbüchern nach links gehen. Indem Sie also die Flex-Eigenschaft toe eins auf dem Titel setzen, wird es den gesamten verfügbaren Platz in Anspruch nehmen Eingaben nach rechts verschieben. Das ist besser reich auf der rechten Seite. Wir wollen auch ein bisschen eine Verzierung hinzufügen, um sicherzustellen, dass es klar ist, dass diese Eingabe Dienstbarkeit für die Suche. Also lassen Sie uns hinzufügen, dass in der Spanne, wer eine Lupe Aiken viel besser jetzt verwenden wird. Wenn Sie nach Star Trek suchen, werden wir die älteren Star Trek Filme sehen. Also lasst uns eine kurze Zusammenfassung machen. Wir haben verwendet, um Eingabekomponenten für einen Suchtext zu beenden gesteuert. Wir haben ein Formular zwei legt die Suche Texaner tun Ajax Schule, und wir änderten die Filme auf dem Zustand mit den Ergebnissen aus dem Suchziel. So sehen Sie den nächsten Schritt, jeder wird tatsächlich unsere Anwendung im Internet bereitstellen 21. Die Anwendung ausrichten: Ich mache mir Sorgen. Willkommen zurück zu Entscheidungen Reduktion Kern von Wracked. In diesem Video werden wir die Anwendung, die wir für die Waffe entwickelt haben, bereitstellen. Also hier bin ich auf der MPM-Seite für Erstellen Wrecked Up, und wenn Sie auf die Benutzerhandbücher klicken, scrollen Sie ein wenig nach unten. Sie könnten Optionen für die Bereitstellung sehen, und eine wirklich nette ist die Verwendung von Now. Jetzt sehen wir Service von Websites, und es macht es wirklich einfach, eine reagierende Anwendung oder viele andere Anwendungen bereitzustellen, für diese Angelegenheit kostenlos. Das ist also die eigentliche Seite. Also lassen Sie uns unsere Anwendung hier bereitstellen, ich bin bei den Befehlsproblemen in unserer Anwendung. Das erste, was wir tun müssen, ist zu erstellen, um Version Angebot Anwendung freizugeben. Mit MPM Run Built wird eine Produktionsversion aus der Anwendung diese Warren Foster erstellen , so ist es sehr empfehlenswert. Dies hat also den erstellten Ordner erstellt, der zwei bereitstellbare Anwendungen enthält. Nun, lassen Sie uns jetzt installieren, es ist eine globale gestohlen, damit wir es für meine überall verwenden können. Also NPM installieren jetzt midterm minus G für global, was ziemlich falsch ist, so dass das jetzt installiert ist, könnte die Anwendung jetzt mit der Option dash dash name bereitstellen . Andernfalls wird es den aktuellen Ordner nehmen , der Builds genannt wird, und durch Hinzufügen dieses Versteck Public wird es uns nicht fragen, ob es öffentlich amüsant sein sollte, jetzt kostenlose Version abzuschalten. Und das wird immer öffentlich sein. bekomme jedoch Ichbekomme jedocheinen Fehler. Raising ist die maximale Größe für eine kostenlose Anwendung ist ein Megabyte und sogar gibt es Anwendung ist nicht sehr groß. Es enthält eine Karte Foul auf der Karte. Herbst ist relativ groß, so lassen Sie uns löschen, dass Andi wieder versuchen, bereitzustellen. Also, jetzt lief unsere Bereitstellung besser aus. Wir könnten die Ihre EL in der Konsole sehen, wenn Akopian Tempo zu Ihrem Brunnen in den Pinsel oder wir können unsere gehostete Anwendung sehen. Also hier läuft es im Internet, nur dysfunktional, wie es war, bevor wir die Film-Details sehen konnten, die wir für Filme konserviert . Großartig, also lassen Sie uns sicherstellen, dass dies einfacher gemacht werden kann. Wir können zeigen, indem Sie einen neuen Befehl im Skriptabschnitt hinzufügen. In unserer Praxis Behauptung müssen Sie den Befehl dort kennen, der zuerst ausgeführt und erstellt wird, dann CD in das Rechnungsverzeichnis. Dann werden wir diese Karte fallen löschen und jetzt in der Regel zu kalt Raum Zorn für das, die bereits installiert haben , die es auf jedem OS tatsächlichen os que Monate tun wird unterscheidet sich zwischen Mac OS , Windows und Lennox. Ich möchte, dass einige Kartendateien ihre Aufrufe jetzt mit dem richtigen Namen löschen, um sie bereitzustellen. Jetzt können wir die Anwendung bereitstellen, indem wir NPM jetzt ausführen, und es wird alle erforderlichen zwei Monate ausgeben. Wer traut es sich? Es ist Euro ist tatsächlich das gleiche in diesem Fall, weil die Anwendung hat sich nicht geändert. Liebe die Anwendung wieder, um sicherzustellen,. Ja, alles ist immer noch voll funktionsfähig. Großartig. Und immer noch nach Filmen suchen. Großartig. Sie brauchen also nicht viel zu hosten, um die Anwendung zu reagieren. Die Anwendung könnte tatsächlich mehr brauchen, aber in diesem geht unser Tag, der von niemandem kommt. Anwendung mit Site macht es wirklich einfach, die Anwendung bereitzustellen. So sehen wir uns im nächsten und letzten Video. Wann wird einen schnellen Überblick über alles, was wir in diesem Kurs behandelt haben 22. Zusammenfassung: Ich bin Ray Share. Willkommen zurück hierbei. Einführungskurs wird reagieren. Dieses Video ist gerade verloren. Und in diesem Video haben wir nur eine kurze Zusammenfassung von allem, was Sie gelernt haben, was ziemlich viel ist. Also begannen wir, indem wir einen Blick darauf werfen, was reagieren ist und warum Sie es lernen sollten. Dann haben wir einen Blick auf die Erstellung einer neuen React-Anwendung mit Create React App. Wir müssen uns auch die Aktionssteuer von Jays ansehen, um zerstörte Komponenten zu erstellen. Wir betrachteten die Kapitulation einzelner oder mehrerer untergeordneter Reaktionskomponenten. Wir haben Requisiten, die Tag an untergeordnete Komponenten weitergegeben werden können. Sie geben an, es zu schaffen, für die Anwendung dort zu bleiben. Wir haben ein P I holen, um Ajax-Schulen zu tun, um Daten vom Server abzurufen. Verwendet einen Sucher, Komponenten materiell y in unserem Fall, um die Anwendung hübsch aussehen zu lassen. Und wir haben unsere Anwendung jetzt auf Xitong bereitgestellt, was wirklich einfach war. Jetzt bist du dran. Tun Sie etwas Großartiges mit React und lassen Sie mich wissen, was Sie gebaut haben. Ich bin immer daran interessiert zu sehen, was Leute mit reagieren. Also danke für die Teilnahme an der Punktzahl. Ich hoffe, es war normalerweise für dich. Und lassen Sie mich wissen, was Sie sonst gerne über Reagieren oder reagiert verwandte Themen lernen möchten, damit ich andere Kurse rund um diese Themen erstellen kann.