Vibe-Programmierung mit Windsurf: Webdesign ohne Code für Anfänger | Programmieren mit KI | Chris Barin | Skillshare

Playback-Geschwindigkeit


1.0x


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

Vibe-Programmierung mit Windsurf: Webdesign ohne Code für Anfänger | Programmieren mit KI

teacher avatar Chris Barin, Certified Photoshop Expert

Schau dir diesen Kurs und Tausende anderer Kurse an

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

Schau dir diesen Kurs und Tausende anderer Kurse an

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

Einheiten dieses Kurses

    • 1.

      Einführung

      2:21

    • 2.

      Was ist Windsurf und Vibe Programmieren

      4:03

    • 3.

      Windsurf installieren und Ihre Erwartungen festlegen

      6:05

    • 4.

      Unsere erste Website im Windsurfen

      9:49

    • 5.

      Was können Sie mit Vibe-Programmierung in Windsurf programmieren

      8:53

    • 6.

      Fortbewegung beim Windsurfen

      4:15

    • 7.

      Fortbewegung beim Windsurfen

      8:10

    • 8.

      Einrichten von MCPs und Regeln in Windsurf – ganz einfach

      6:53

    • 9.

      So beheben Sie Probleme

      5:11

    • 10.

      Claude im Vergleich zu GPT

      11:50

    • 11.

      GPT gegen Gemini gegen Grok

      10:09

    • 12.

      Kosten einfach erklärt – auf einfache Weise

      6:32

    • 13.

      Die versteckten Gefahren der Vibe-Codierung und des vollständigen KI-Zugriffs

      4:33

    • 14.

      80 % bis 20 %

      5:34

    • 15.

      Von Figma zum Windsurfen?

      3:19

    • 16.

      Übersicht

      3:04

    • 17.

      Von der Idee über Windsurfen über Vercel bis hin zur Live-Website

      3:31

    • 18.

      Lassen Sie uns die Eingabeaufforderung verstehen

      6:35

    • 19.

      Starten Sie das Projekt

      7:59

    • 20.

      Wie man mit Fehlern umgeht

      6:53

    • 21.

      Das Formular richtig arbeiten lassen

      7:58

    • 22.

      Laden Sie Ihre Website auf GitHub hoch

      7:47

    • 23.

      Veröffentlichen Sie Ihre Website mit Vercel & beheben Sie Fehler

      8:17

    • 24.

      Veröffentlichung der Website unter Ihrem eigenen Domainnamen

      6:57

    • 25.

      Änderungen an unserer Live-Website vornehmen

      6:15

    • 26.

      Schwimmen im Ozean

      4:13

    • 27.

      Was kommt als Nächstes?

      1:34

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

Von der Community generiert

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

87

Teilnehmer:innen

--

Projekt

Über diesen Kurs

Lernen Sie Vibe-Programmierung mit Windsurf: Starten Sie Ihre erste Website in nur wenigen Stunden

Keine Programmierkenntnisse? Kein Problem. In diesem anfängerfreundlich gestalteten Kurs lernen Sie, wie Sie Windsurf, eine revolutionäre Plattform mit künstlicher Intelligenz, zum Erstellen und Starten Ihrer eigenen professionellen Website verwenden können – auch wenn Sie noch nie eine einzige Zeile Code geschrieben haben.

Stellen Sie sich vor, Sie haben eine Geschäftsidee und verwandeln sie in eine Live-Website, indem Sie einfach beschreiben, was Sie wollen. Dieser Kurs zeigt Ihnen, wie Sie dies verwirklichen können. Sie erfahren, was Vibe Programmieren ist, warum es die Zukunft ist und wie Sie es nutzen können, um sich eine solide Einkommensquelle zu schaffen.

Was du lernen wirst

  • Wie man Windsurf verwendet, um Websites von Grund auf neu zu erstellen

  • Was ist Vibe Programmieren und warum ist es ein entscheidender Faktor?

  • So nutzen Sie KI für den Entwurf und die Optimierung Ihrer eigenen Website.

  • Eine anfängerfreundlich erläuterte Erklärung von LLMs, MCPs und anderen Kernkonzepten

  • Schritt-für-Schritt-Anleitung zum Start Ihrer ersten Website

  • So kaufen und verbinden Sie eine benutzerdefinierte Domain

  • Praxisnahe Übungen für schnelles und intelligentes Bauen

  • Wie Sie Ihre Website wiederholen, aus Feedback lernen und letztendlich Geld verdienen

Warum dieser Kurs anders ist

Die meisten Kurse überladen Sie mit Jargon, endloser Theorie oder erwarten, dass Sie ein Technik-Experte sind. Nicht dieses! Dieser Kurs wurde von einem Designer entwickelt, der sich seine Karriere durch Vereinfachung von Technologie aufgebaut hat. Der Schwerpunkt liegt auf Ergebnissen. Du wirst etwas Reales aufbauen, und du wirst es schnell tun.

"Man stellt sich es vor, man beschreibt es, man versteht es. Dann können Sie Feinabstimmungen vornehmen und damit Geld verdienen."
– Das ist Vibe Programmieren in Aktion.

Der Kurs macht Spaß, ist schnell und frustrierend. Ja, manche Dinge fühlen sich vielleicht noch in einem frühen Stadium an – und das ist Ihr Vorteil. Früh zu sein bedeutet weniger Wettbewerber, mehr Möglichkeiten und einen Platz in der ersten Reihe bei der KI-Revolution.

Was Sie brauchen

  • Ein Desktop- oder Notebook-Computer

  • Ein Windsurf-Konto (Sie haben eine 2-wöchige kostenlose Testversion, dann beginnt sie bei 15 $/Monat)

  • Neugier und Bereitschaft zum Experimentieren

  • Absolut keine Programmierkenntnisse

Für wen ist dieser Kurs geeignet?

  • Aufstrebende Unternehmer, die ihr eigenes Online-Geschäft aufbauen möchten

  • Freiberufler oder Kreative, die ihr eigenes Portfolio oder ihre eigene Services Website entwerfen möchten

  • Studenten interessieren sich für KI und Website-Erstellung

  • Alle, die sich vom Tech-Boom ausgeschlossen fühlten, weil sie nicht wissen, wie man programmiert

Warum Sie dies jetzt lernen sollten

  • KI wird nicht verschwinden. Es wird immer stärker, und das ist deine Chance, auf der Welle zu reiten.

  • Windsurf wurde von OpenAI für 3 Milliarden Dollar übernommen – das weltweit führende KI-Unternehmen glaubt also daran.

  • Du bist zu früh. Und früh zu sein bedeutet Möglichkeiten, die die meisten Menschen später nicht haben.

Denken Sie darüber nach – jetzt Zeit in diese Sache zu investieren, ist wie vor 20 Jahren Apple-Aktien oder Bitcoin bei der Markteinführung zu kaufen.

Triff deine:n Kursleiter:in

Teacher Profile Image

Chris Barin

Certified Photoshop Expert

Kursleiter:in

Chris Barin is a professional web and app designer with nearly 10 years of Photoshop experience. By being self-taught, he managed to gain the trust of over 190.000 students from all over the world through his Photoshop courses. A staple of his materials is a hand-on, down-to-Earth approach that focuses on getting maximum results with minimal effort.

Chris started out as a freelance web designer and built a loyal client base, earning over tends of thousands of dollars by designing sites part time. Today, he runs his own Android design studio, 20 strong, creating fantastic looking apps for clients; his apps have over 100 million downloads to date.

Passionate about teaching, Chris teaches because he has been disappointed in the quality of training materials available ... Vollständiges Profil ansehen

Level: All Levels

Kursbewertung

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

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

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

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

Lerne von überall aus

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

Transkripte

1. Einführung: Willkommen in der Zukunft. Dies ist deine Chance , ein Level aufzusteigen und etwas zu lernen, das dein Leben erheblich verbessern wird . Und das ist Vibe-Coding. Und das liegt daran, dass Sie kein Entwickler mehr mit langjähriger Erfahrung sein müssen , um eine Website, eine App oder ein Unternehmen zu erstellen App oder ein Unternehmen Wir werden eine Plattform namens Windsurf AI und die Leistungsfähigkeit künstlicher Intelligenz nutzen , um uns bei der Erstellung von Websites zu unterstützen Du stellst es dir vor, du beschreibst es, du verstehst es. Man verfeinert es, man bringt es auf den Markt, man lernt und dann verdient man schließlich. Es kann ein paar Versuche und vielleicht ein paar Monate dauern , aber Vibe Coding gibt dir eine unglaubliche Chance, ganz alleine ein fantastisches Geschäft Ich glaube, das ist für die meisten Menschen die beste Möglichkeit, ein solides, verlässliches Einkommen zu erzielen Und ich wiederhole, ohne technisch zu sein, ohne zu wissen, wie man programmiert, das ist die Zukunft. In diesem Kurs werden wir eine Website von Grund auf neu erstellen. Wir werden es Schritt für Schritt mit Hilfe von KI auf unserer eigenen Domain starten . Das wird nicht besonders einfach sein. Es wird manchmal frustrierend sein, und das liegt daran, dass wir früh dran sind Aber früh zu sein, ist unser Hauptvorteil. Stellen Sie sich vor, Sie hätten vor 20 Jahren in Apple investiert oder Bitcoin gekauft , als es zum ersten Mal auf den Markt kam. Sicher, am Anfang wird es Unsicherheit geben , oder? Probleme, alle möglichen Probleme, aber warte nicht, bis es zum Mainstream wird. Das ist dein Shop. Und in diesem Kurs werde ich alles erklären , was Sie wissen müssen. Sie haben gerade angefangen und in kürzester Zeit die erste Website gestartet . Ich werde Ihnen in einfachem Englisch beibringen, was KI, LLMs, MCPs und all das bedeuten Ich bin Designer, und wenn Sie jemals meine Designkurse gesehen haben, wissen Sie, dass ich mich darauf konzentriere, schnell Ergebnisse zu erzielen, ohne langweilige Theorie Ich werde Ihren Kopf nicht mit komplizierten Begriffen und Konzepten füllen . Nein, noch einmal, ich bin kein Entwickler, und das ist ein großer Vorteil. Stattdessen konzentriere ich mich auf Beispiele und unterhaltsame Übungen. Investieren Sie in Ihre Zukunft. Dies ist eines der besten Dinge , die Sie derzeit lernen können. Um Ihre Zukunft zu sichern und ein fantastisches Einkommen zu haben. Fangen Sie noch heute an. Warte nicht. Das ist deine Chance. 2. Was ist Windsurf und Vibe Programmieren: Willkommen zurück. In diesem Zitat wir Windsurf zum Vibe-Code verwenden, aber was ist Windsurf und was ist Vibe-Coding Zuallererst ist Windsurf also eine Plattform, die Ihnen hilft, Software mit der Leistungsfähigkeit von KI zu entwickeln, und das, ohne zu wissen, wie man programmiert Es wurde gerade von Open AI, den Leuten hinter Chat GPT, für 3 Milliarden US-Dollar gekauft den Leuten hinter Chat GPT, für 3 Milliarden US-Dollar Ja, das ist eine Milliarde. Es sind 15 Dollar pro Monat, und was Sie dafür bekommen, ist ein völliger Wendepunkt. Mit Winserf arbeiten Sie Seite an Seite mit künstlicher Das versteht Ihr Projekt, folgt Ihren Anweisungen und erstellt Ihre App für Sie, fast wie Du schreibst, was du willst. Das nennt man die Aufforderung. Vielleicht beschreibst du, welche Apps du machst. Und dann übernimmt die KI das Ruder und erledigt den Großteil der schweren Arbeit. Kurz gesagt, was kann Windserf eigentlich bauen? Nun, wir können mobile Apps erstellen, sowohl für IOS als auch für Android, genau wie die Apps, die Sie im App Store oder bei Google Play erhalten können die Sie im App Store oder bei Google Play Sie können alles erstellen, von einem Fitness-Tracker über eine Chat-App bis hin zu einem professionellen Finanztool. Was auch immer Sie sich vorstellen können, Sie können bauen. Natürlich können Sie Websites erstellen, wie wir es in diesem Kurs tun werden, wie Präsentationswebsites, Portfolios, persönliche Blogs, Werke. Es kann Landingpages für Produkte, für Startups, für Veranstaltungen, was auch immer verwalten . Es ist alles schnell, alles reagiert, alles ist sauber. Es gibt keinen Nachteil. Natürlich können Sie SAS-Produkte entwickeln. Das bedeutet Software als Service. Und Windsurf kann dir dabei helfen, das zu bauen. Es kann dir mit dem Frontend, mit dem Backend, mit der Datenbank, allem helfen , sodass du das nicht wissen musst. Sag ihm einfach, was es tun soll, und es wird die komplizierten Dinge herausfinden . Und noch eine letzte Sache. Sie können Plugins und verschiedene Tools erstellen. Sie können Chrome-Erweiterungen erstellen. Sie können Discord-Bots erstellen. Sie können interne Tools für Ihr Team oder Ihr Unternehmen erstellen. Verdammt, du kannst sogar Plugins für Webpressen erstellen. Wenn es sich in einem Browser befindet oder auf einem Computer läuft, besteht eine sehr gute Chance, dass Winserf das bauen kann Nun, hier ist die große Idee. Winserf stellt eine direkte Verbindung zu einigen der intelligentesten KI-Modelle der Welt Das heißt, es weiß, wie man Python, Javascript, React, Next JS, Node, was auch immer schreibt . Es ist, als hätte man rund um die Uhr ein erfahrenes Entwicklerteam mit unendlicher Geduld, das bereit ist, vor Ort zu programmieren, was auch immer Sie wollen. Sie sagen ihm, was Sie wollen, und dann fängt es an zu programmieren. Sie überprüfen die Ergebnisse, geben Feedback und es verbessert sich sofort. Das ist wiederum so, ohne dass Sie wissen, wie man ohne all die Dinge, die ich zuvor erwähnt habe, programmiert. Das ist also der wesentliche Teil. Also stell dir das vor. Sie haben eine Idee für das Produkt, richtig, für das Plug-In, eine App, ein Tool, das ein Problem löst , das Sie vielleicht schon seit Jahren Jetzt bräuchten Sie normalerweise monatelange Entwicklung. Sie bräuchten ein Team, richtig, ein Budget, endlose Besprechungen. Und die Sache ist, das wird bei Windsor nicht mehr benötigt Sie beschreiben einfach die Idee und in ein paar Minuten haben Sie etwas Reales, etwas Funktionales, etwas, das Sie testen, verbessern und dann vielleicht nach einiger Arbeit endlich auf den Markt bringen können , verbessern und dann vielleicht nach einiger Arbeit endlich auf den Markt bringen Das ist also Vibe-Coding. Vibe-Coding bedeutet also, dass Sie dem Programm in einfachem Englisch sagen , was Sie tun möchten, und dann führt die Plattform es aus Das ist es, was Windsurf so mächtig macht. Das hilft dir nicht, Code zu schreiben. Nein, es hilft dir, Produkte zu entwickeln. Es löst Probleme und hilft Ihnen, schneller als je zuvor von der Idee zur Ausführung überzugehen schneller als je zuvor von der Idee zur Ausführung Bitte laden Sie den Anhang herunter und melden Sie sich für das Windsurfen an Also mach weiter und melde dich an, und in der nächsten Vorlesung werden wir Windsurf gemeinsam installieren und in der nächsten Vorlesung werden wir Windsurf gemeinsam installieren. Lass uns loslegen 3. Windsurf installieren und Ihre Erwartungen festlegen: Willkommen zurück. Die Installation von Windsurf ist ziemlich einfach, weil es nur ein einfaches Programm Es passiert nichts Besonderes, aber während ich mich im Hintergrund darum kümmere, lass mich deine Erwartungen darlegen, oder? Wir sind früh dran. Die Dinge ändern sich rasant. Jede Woche oder so, vielleicht alle zwei Wochen, gibt es große Neuigkeiten, Verbesserungen. Und das ist ein bisschen unangenehm, oder? Es kommen neue Funktionen heraus, und ich bin mir sicher, dass dieser Kurs veraltet sein wird, auch wenn ich mein Bestes tun werde, um ihn auf dem neuesten Stand zu halten. Mein Ziel ist es nun, Ihnen beizubringen , wie man diese Tools lernt und wie man sie benutzt. Ich werde Ihnen Prinzipien beibringen , die nicht aus der Mode kommen, und das ist der wahre Wert dieses Kurses. Lassen Sie uns zu diesem ständigen Wandel der Verbesserungen zurückkehren , richtig? Nun, das ist der Preis, Sie zahlen müssen, wenn Sie zu früh kommen. Du brauchst jede Menge Geduld. Du musst deine Frustration von dir wegspülen lassen. Und das liegt daran, dass ich dir verspreche du nicht weiterkommen wirst. Das verspreche ich dir. Und es geht nicht um diesen Kurs, meinen Unterrichtsstil oder mein Wissen. Nein, ich hatte unzählige Fälle in denen der offizielle Leitfaden sagte, klicken Sie auf den blauen Button. Aber es gab nur rote. Oder der Guide sagte, ich solle auf die Schaltfläche Speichern klicken, aber es gab keine Schaltfläche zum Speichern. Es ist so nervig, wenn das passiert. Ich hatte Probleme, bei denen ich aufgrund von Problemen mit meinem VPN nicht mehr arbeiten konnte . Aber ich verwende eigentlich kein VPN. Es hieß, ich hätte kein Internet, aber alles funktionierte einwandfrei. Ich habe jeden Schritt jedes offiziellen Leitfadens befolgt und bin bei einem obskuren Problem stecken geblieben Ich verwende drei verschiedene Computer und habe drei verschiedene Probleme Jetzt könnte ich ewig weitermachen. Das wird bestimmt passieren. Und mein Rat, nutzen Sie die Anleitung aus dem Anhang, um Hilfe zu erhalten. Jetzt müssen Sie die meiste Zeit selbst viel suchen und reparieren. Ich bin hier um zu helfen. Du kannst auf mich zählen. Einige Probleme werden jedoch sehr spezifisch für Ihren Computer sein. Und Sie müssen Geduld haben, um sie zu lösen. Das ist also der Nachteil, richtig, weil ich so früh im Spiel Nun, was ist der Vorteil , so früh dran zu sein? Nun, du hast einen Vorsprung im Rennen. Egal, ob es um den Job geht, freiberuflich tätig zu sein oder ein Unternehmen aufzubauen, das ist riesig Sie lernen aus Ihren Fehlern. Sie sehen gemeinsame Probleme und kommen voran. Sie sind allen anderen einen Schritt voraus, die nicht all den Schmerz durchmachen wollen , früh dran zu sein, dass Dinge nicht funktionieren. Du bist ihnen voraus. Und wie gesagt, es ist, als würde man 20 Jahren in Apple investieren. Niemand wusste, dass es ein so großes Unternehmen werden würde , richtig, ein so großer Erfolg. Aber hier, das verspreche ich dir, gibt es nichts Größeres. Und es liegt alles in deinen Händen. Das ist die Sache. Du kannst unglaubliche Dinge erschaffen. Oder du könntest es einfach verschieben. Du kannst warten, bis die Dinge ganz klar und einfach für alle sind klar und einfach für alle Keine Bugs mehr, keine Probleme mehr. Und was dann? Nun, du wirst 100-mal so viel Konkurrenz haben, oder? So einfach ist das. Wenn Sie jetzt in Apple oder Bitcoin oder was auch immer investieren , können Sie natürlich gut abschneiden. Aber wenn Sie am Anfang dabei gewesen wären, wären die Belohnungen unendlich höher gewesen Verstehe also bitte , warum du leiden wirst. Sie werden Kopfschmerzen und viel Frust haben. Aber es ist für deine Zukunft. Und wenn Sie damit umgehen können, wenn Sie weitermachen können, wird die Belohnung riesig sein. Deshalb liebe ich Vibe-Coding wirklich so sehr. Es ist genau der richtige Schwierigkeitsgrad, oder? Wenn es zu schwer wäre, wäre es nur klassisches Programmieren. Die klassische Art, vier, vielleicht sechs Jahre lang zu studieren, ständig zu arbeiten, ein Junior zu sein, langsam, aber sicher aufzusteigen Also vier bis sechs Jahre. Also das wäre der schwierige Weg. Aber wenn es zu einfach wäre, wären alle hier. Jeder würde es tun. Die Belohnung wäre also so gut wie nichts. Dieser, dieser Schwierigkeitsgrad, er ist fantastisch. Es ist genau der richtige Schwierigkeitsgrad. Also zurück dazu. Du wirst nicht wirklich programmieren, oder? Sie müssen keinerlei Programmiersprache beherrschen. Sie müssen geduldig sein und in der Lage sein, die Idee von Ihrem Kopf bis zum Computer klar zu erklären . Und das ist eine Fähigkeit, die Sie im Laufe dieses Kurses und durch Übung entwickeln werden. Aber auch hier gilt: Sie werden keinen Code programmieren und Sie werden keinen Code lesen. Du solltest nicht alles verstehen, was vor sich geht, während Windsurf im Hintergrund an deinem Projekt arbeitet Nein, eines der wichtigsten Prinzipien , die ich dir beibringen möchte, ist, dass du den ganzen Tag damit verbringen kannst , Memes zu erstellen, um sie mit deinen Freunden zu teilen und zu lachen, oder du kannst auf der anderen Seite eine Plattform zum Windsurfen schaffen , auf der Leute Memes erstellen können, und dann kannst du daraus eine Einnahmequelle machen Das ist also eines der wichtigsten Dinge des Es geht darum , wo Ihr Fokus liegt und wie Sie Ideen entwickeln und umsetzen können. Darüber werde ich einen Vortrag halten, also bleiben Sie dran. Aber jetzt musst du Windsurf installiert haben. Ich habe unsere Oberfläche nach dem dunklen Farbschema eingerichtet und wir sind dabei, unser erstes Projekt zu erstellen Ja, bald werden wir eins machen. Nun, eine letzte Anmerkung. Ich werde vieles vereinfachen , damit es für jeden leicht zu verstehen ist, oder? Aber nur für den Fall, dass Sie der Programmierer mit umfangreichem Wissen sind, Sie bitte Verständnis dafür, dass, wenn Sie sagen, dass Windsurf eine Abzweigung von VS-Code ist, meisten Menschen nicht wirklich viel sagt Oder wenn Sie so etwas sagen wie, rufen Sie Ihr Terminal auf und führen Sie dieses schnelle Python-Skript aus. Auch das ist für die meisten Menschen etwas überwältigend. Das werde ich nicht tun. Ich werde die Dinge vielleicht zu stark vereinfachen, aber dies ist ein Kurs für Anfänger, die keine technischen Kenntnisse haben, also werden wir es einfach und Schritt für Schritt angehen Okay, damit sehe ich dich in einer Sekunde. 4. Unsere erste Website im Windsurfen: Willkommen zurück. Lassen Sie uns unsere erste Website in Windserf erstellen Bevor wir beginnen, schauen Sie sich diesen Vortrag bitte zweimal beim ersten Mal einfach und sehen Sie, was passiert. Spulen Sie dann vom Anfang zurück und machen Sie eine Pause, um weiterzuarbeiten. Sie werden ziemlich oft auf Pause drücken müssen. Bitte versuchen Sie nicht, bei Ihrer ersten Besichtigung mitzuspielen. Sie werden nicht mithalten können. Also nochmal, schauen Sie bitte zweimal und machen Sie beim zweiten Mal eine Pause, so oft Sie möchten. Okay, jetzt müssen alle unsere Projekte in Ordnern organisiert werden. Lassen Sie uns also unseren Computer öffnen und einen neuen Ordner erstellen. Wenn Sie Windows verwenden, versuchen Sie, Ihre Hauptpartition zu meiden , auf der Windows installiert ist , da dies für manche Benutzer manchmal zu Problemen führen kann. Okay, nenne es, wie du willst. Ich werde Wind One verwenden, aber der Name ist wirklich egal. Als Nächstes starten wir Windsurf und wir werden diesen Ordner öffnen Bisher nichts Besonderes, oder? Warte auf die Sekunde, bis die Schnittstelle geladen ist. Aber ja, das ist es. Wir haben jetzt unser erstes Projekt. Anhang zum Kurs erhalten Sie diese Textdatei mit einer Aufgabe. Es ist etwas ganz Einfaches, ziemlich Grundlegendes. Das fügen wir hier in Cascade auf der rechten Seite ein. Das ist Cascade auf der rechten Seite. Jetzt befinden wir uns im Schreibmodus, und von diesem Drop-down-Menü werde ich dieses Modell verwenden Bitte verwenden Sie dasselbe, oder wenn es nicht verfügbar ist, können Sie eines dieser Modelle vom Bildschirm aus verwenden. Okay, ich werde später alles im Detail erklären. Also lass uns bitte weitermachen. Nun, die Botschaft, die Aufgabe lautet wie folgt. Erstelle eine moderne Portfolio-Landingpage für mich, Chris Barron 36 aus Bukarest, Rumänien Ich habe 14 Jahre Erfahrung im Design. Ich gehe zu einem zertifizierten Dozenten von Dobe und spezialisiere mich auf Web- und App-Design Ich bevorzuge ein rot-schwarzes Farbschema, nette Animationen und einen Portfoliobereich mit fünf Kategorien Verwenden Sie vorerst Platzhalter-Bilder. Es wird eine einzelne Seite mit einem Hauptmenü oben sein, das Sie zu diesem bestimmten Abschnitt führt Meine Büroadresse ist diese, und bitte fügen Sie Scheinrezensionen Fügen Sie ein Kontaktformular hinzu, damit mir Leute eine Nachricht senden und meine Telefonnummer anzeigen Zeige auch meine Social-Media-Profile an. Verwenden Sie bewährte Methoden, um diese Landingpage zu erstellen. Okay, das ist also die Aufgabe. Sie sollten dasselbe verwenden, aber seien Sie sich bewusst, dass es völlig normal ist, dass Ihr Design anders aussieht als meins. Genau so funktioniert KI. Das ist kein Fehler. So funktioniert es. Falls jetzt etwas überhaupt nicht funktioniert, es einfach hängen. Mach dir darüber keine Sorgen. Fahren Sie mit der nächsten Vorlesung fort, in wir alles einrichten werden, und dann werden wir zurückkommen und es erneut versuchen. Also noch einmal: Wenn Sie das überhaupt nicht ausführen können, fahren Sie mit der nächsten Lektion fort und kehren Sie dann zurück. Okay, sobald wir die Eingabetaste gedrückt haben, sind wir auf dem Weg zu den Rennen. Beachten Sie diesen Bereich hier. Das besagt, dass es läuft. Und du kannst auch diesen grünen Kreis darunter bemerken. Falls du es stoppen willst, willst du die KI stoppen. Sie können diesen roten Knopf benutzen, obwohl Sie das nicht wirklich tun werden. In diesem Fenster können Sie jetzt sehen, wie das Modell denkt. Einige Modelle sind ziemlich beschreibend. Sie erklären alles im Detail. Hier sagt dieses Modell, dass es eine ziemlich einfache Website mit HTML und CSS sowie ein bisschen JavaScript erstellen wird eine ziemlich einfache Website mit . Okay. Und Dateien tauchen auf, angefangen mit der Indexdatei, die im Grunde die Homepage ist Sie können die Dateien auf der linken Seite des Bildschirms sehen, und Sie könnten sie möglicherweise hier vorne und in der Mitte öffnen sie möglicherweise hier vorne und in der Mitte Aber in 99% der Fälle werden Sie sich tatsächlich auf die rechte Seite konzentrieren. Jetzt werde ich diese Aufnahme beschleunigen, da es manchmal eine Weile dauern kann, besonders bei bestimmten Modellen. Seien Sie jetzt nicht überrascht, dass das Modell möglicherweise einen Fehler macht, oder? Das Modell meint übrigens einfach die KI. Hier hat es zum Beispiel versucht, zu viel Code auf einmal zu generieren , und das ging fehl. Es konnte es nicht tun Aber es hat seinen Fehler erkannt, also hat es nach einer anderen Lösung gesucht und sie dann bereits angewendet. Und das, ohne dass wir eingreifen, ohne dass wir etwas tun. Das ist also ganz nett. Als Nächstes versuchte es, Python zu starten, damit wir die Website tatsächlich sehen konnten. Sie müssen Python nicht kennen, aber wir müssen es installiert haben. Jetzt können Sie sehen, dass wir uns hier entscheiden müssen. Installieren wir nun Python oder sollten wir es anders versuchen? Das fragt uns die KI. Und ich möchte dir etwas zeigen. Sagen wir ihm, dass es Python selbst installieren soll, oder? Das wäre großartig, oder? Aber nein, es wird es eigentlich nicht tun. Und darüber werden wir in einer separaten Vorlesung sprechen. Kurz gesagt, es würde unser Leben einfacher machen, aber das wäre ein großes Sicherheitsproblem. Es wäre nicht sicher. wir nun zurück und sagen wir ihm, dass er weitermachen soll. Aber hier ist die Sache. Ich war mit meiner Botschaft zu vage Fahren Sie fort. Es weiß also nicht, was es tun soll, oder? Also habe ich nach Python gesucht. Wieder einmal wollte ich eigentlich die andere Option. Also ist es meine Schuld. Also musst du immer präzise mit deinen Anweisungen sein. Sag ihm genau, was du willst. Setz dich nicht zu kurz. Aber eigentlich wird das auch nicht funktionieren. Also lasst uns Python installieren , weil es eigentlich ganz einfach ist. Wir machen es nur einmal, und dann erledigt das Modell alles. Okay, also scrolle nach oben und klicke auf diesen Link. Mach dir keine Sorgen über die Warnmeldung. Hier sind wir auf der offiziellen Website, also ist alles schön und sicher. Scrollen Sie nach unten und suchen Sie nach Ihrem Betriebssystem. Wie Sie sehen können, ist dies das empfohlene. Also werden wir es herunterladen und installieren. Nun, bevor wir etwas auswählen, hat das Modell gesagt, dass wir eine bestimmte Funktion aktivieren müssen, und das ist dieses zweite Kontrollkästchen hier. Aber es ist am besten, wenn du beide markierst. Okay, haben Sie jetzt bitte etwas Geduld und machen Sie so oft eine Pause, wie Sie müssen, um weiterzuarbeiten. Okay, jetzt installieren wir es, und das wird nur eine Minute oder so dauern. Nun, manchmal funktioniert das nicht richtig, und ich habe eine Vorlesung für diesen speziellen Fall. Aber ja, hier ist es geschafft. Zurück zum Windsurfen Teilen wir dem Modell mit, dass Python installiert ist, und sagen wir ihm, dass es weitermachen soll. Sofort erhalte ich hier den Befehl, dass Winserf nicht so konfiguriert ist, dass es eigenständig läuft Aber das ist kein Problem. Wir werden selbst auf diese Ausnahmeschaltfläche klicken. Und nach dem zweiten ist hier noch einer. Klicken Sie erneut auf Akzeptieren. Und einfach so sollten wir mit Python fertig sein, und wir können loslegen. Jetzt bittet mein Windows-Computer um Erlaubnis, und wir werden natürlich Ja sagen. Wir können jetzt unsere Website mit dieser Adresse auschecken. Kopieren wir es und fügen es dann in einen beliebigen Browser ein. Sie können aber auch Open und External Browser verwenden. Jetzt werde ich Microsoft Edge auf diesem Computer verwenden, aber Sie können verwenden, was Sie wollen. Ja, das ist eine schöne Website. Es ist schwarz und rot , weil ich danach gefragt habe. Nun, wenn ich es mir ansehe, ist es spektakulär? Nein, natürlich nicht, aber wir haben es mit nur ein paar Klicks zum Laufen gebracht. Beachten Sie, dass ich keine Fotos habe , weil wir keine zur Verfügung gestellt haben. Auch hier würde das Modell selbst nichts herunterladen. Aber lassen Sie uns noch einen Schritt weiter gehen. Lassen Sie uns das Schwarz durch einen schönen Blauton ändern und vielleicht die Karte hinzufügen, anstatt einfach die Adresse anzuzeigen, oder? Geben Sie das jetzt noch einmal ein, und es kann eine Weile dauern, aber ich werde es beschleunigen. Nun, wenn alle Änderungen vorgenommen sind, klicken Sie bitte hier auf „ Alle akzeptieren“. Verwenden Sie nicht den aus der Mitte des Bildschirms. Nein, konzentrieren Sie sich immer auf das rechte Bedienfeld und akzeptieren Sie alle Änderungen, sobald das Modell fertig ist. Beachten Sie, dass es keinen grünen Kreis und keinen roten Knopf gibt, um das zu stoppen. Das heißt, es wurde gestoppt und wir können es akzeptieren. Okay, schauen wir uns das an. Ja, das ist solide. Es ist jetzt blau und wir haben eine Karte. Wir haben etwas, mit dem wir arbeiten können, und es sollte reagieren. Wir können mit der rechten Maustaste klicken und aus dieser Liste Option Prüfen auswählen. In diesem neuen Fenster suchen wir nach diesem Symbol, das unseren Browser in den mobilen Modus umschalten wird. Ja, das ist großartig. Herzlichen Glückwunsch. Nochmals, es ist nicht perfekt. Ich weiß, dass ich Dinge verbessern muss. Aber so schnell kannst du im Handumdrehen mit dem Windsurfen loslegen Ich möchte, dass Sie Ihre eigene Version erstellen, beginnend mit meiner Textdatei Erstellen Sie einen neuen Ordner auf Ihrem Computer, gehen Sie dann zum Hauptmenü und verwenden Sie Ordner öffnen So einfach ist es, ein brandneues Projekt zu starten. Ersetzen Sie den Namen in der Textdatei, ändern Sie Ihre Daten und erstellen Sie sie dann. Wenn du fertig bist, mache einen Screenshot des gesamten Designs und poste ihn, damit ich ihn sehen kann. Wenn Sie es nicht schaffen, einen Screenshot zu machen, machen Sie sich keine Sorgen. Machen Sie einfach ein Foto mit Ihrem Handy. Falls Sie Probleme haben und diese nicht bewältigen können, verwenden Sie das beigefügte PDF, um Hilfe zu erhalten. Bevor wir zum Schluss kommen, lässt sich Python für einige Leute nicht korrekt installieren, und das funktioniert möglicherweise nicht. Wenn Sie das sind, seien Sie bitte nicht enttäuscht. Wir haben einen Vortrag, in dem wir alles vorbereiten. Wenn Sie also gerade keine Website haben, hinterlassen Sie einen Kommentar, damit ich weiß, mit welchem Problem Sie konfrontiert sind , und fahren Sie dann mit der nächsten Vorlesung fort. Okay, wir sehen uns in einer Sekunde. 5. Was können Sie mit Vibe-Programmierung in Windsurf programmieren: Willkommen zurück. Bevor wir mit dem Windsurfen weitermachen, fragst du dich vielleicht, Chris, was soll ich bauen? Ich verstehe es Ich weiß, dass Sie vielleicht kein Unternehmer mit einigen Genies sind, aber lassen Sie mich Ihnen mit ein paar schnellen Ideen helfen Vorher muss ich Ihnen eine wichtige Sache sagen. Die Ausführung ist unerlässlich. Ideen sind wertlos. Ich werde das noch einmal sagen. Es geht nur um die Hinrichtung. Es ist nicht die Qualität der Idee. Ich werde das dann erweitern. Fangen wir also mit dieser Website an. Ich liebe emg.com, oder? Diese Website verkleinert Ihre Bilder . Wenn Sie zum Beispiel schon einmal mit Photoshop gearbeitet haben, wissen Sie, dass Sie dadurch manchmal riesige Dateigrößen wie zwei, drei, 5 Megabyte bekommen, Bei dieser Plattform Sie die Bilder per Drag-Drop fallen, und das war's Sie reduzieren ihre Größe um 80%, ohne an Qualität zu verlieren. Und es kann Ihnen auch helfen, die Größe von Bildern schnell zu ändern. Nochmals, Drag, Drop und das war's, oder? Und Sie haben hier noch ein paar andere Funktionen. Aber der Preis beträgt vier bis sieben Dollar pro Monat. Es ist nichts. Sogar ich habe mich angemeldet. Also das ist eine Idee. Und hier ist eine Plattform, die Ihr PDF in eine Excel-Datei umwandelt, sodass Ihr Buchhalter es einfacher hat , damit umzugehen Es ist eine Super-Nische, oder? Es ist nur für eine bestimmte Gruppe von Menschen, aber das kostet 38.000 Dollar pro Monat 38.000$ pro Monat. Verrücktes Zeug Und das ist ein weiterer , dem es sehr gut geht. Das benennt all deine Fotos um und das war's. Die ganze Sache. Das ist die gesamte Plattform. Anstatt sie IMG 010203 zu nennen, gibt es ihnen einen richtigen Namen, was großartig für die Fälle ist, in denen Sie in den Urlaub fahren und Tausende von Fotos herumliegen haben , oder? Auch dies ist ein sehr spezifischer Service. Als Nächstes verwenden wir dieses eine poly.com, dem Sie Ihre Inhalte auf all Ihren Social-Media-Kanälen veröffentlichen und planen Ihre Inhalte auf all Ihren Social-Media-Kanälen Diese Plattform hat eine einzige Person, ein einziger Typ dahinter verdient über 1 Million $ pro Jahr, australische Dollar, aber immer noch, und jetzt ist er Channel se Machen wir jetzt eine Pause. Das sind keine unglaublichen Ideen. Das kommen nicht von Geschäftsgenies, oder? Das sind normale Leute , die eine Idee hatten. Sie hatten ein Problem und haben dieses Problem behoben. Sie haben diese Idee umgesetzt, und sie haben es gut gemacht. Es gibt vielleicht 50 andere Plattformen wie zum Beispiel Poly Also teurer, manche billiger. Deshalb habe ich gesagt, dass es nur um die Hinrichtung geht. Und mein Rat: Konzentrieren Sie sich auf die gestalterische Seite. Nehmen Sie etwas, das schon 100 Mal gemacht wurde, fügen Sie ein schönes Design hinzu, eine kleine Wendung, und schon haben Sie ein Geschäft. Natürlich müssen Sie es immer noch bewerben. Sie müssen Werbung machen, aber das ist eine andere Geschichte. Lassen Sie mich nun mit einigen anderen Beispielen fortfahren, etwas weiter oben. Also hier ist Base Cam, eine scheinbar komplizierte Plattform , die sich auf eine Sache konzentriert: Nachrichten. Es ermöglicht Ihnen im Grunde, eine Aufgabenliste auf sehr ähnliche Weise wie Notion zu erstellen . Natürlich bieten diese Plattformen noch viel mehr , viel mehr Funktionen. Aber dann fängst du mit einer einfachen Idee und dann erweiterst du sie, du lässt sie wachsen. Erstellen Sie zum Beispiel eine App, die Sie daran erinnert , jede Stunde von Ihrem Stuhl aufzustehen, oder? Das ist ein Geschäft. Das ist ein Service. Das ist eine App, das ist eine Plattform. Und diese kleine Idee kann dir eine weitere Einnahmequelle bieten, wie du sie monetarisierst, wie du ein Publikum aufbaust Das ist wieder eine andere Sache. Das ist abgesehen von den Ergebnissen. Aber ich verspreche Ihnen , dass es sich um Tonnen von Plattformen handelt, die auf einer sehr einfachen Idee basieren. Hier ist eine WordPress-Erweiterung , mit der Sie einfach Social-Media-Beiträge in Ihre Website einfügen können . Super einfach und sie verdienen viel Geld, meistens passiv, oder? Jetzt habe ich kostenpflichtige WordPress-Erweiterungen gesehen , mit denen Sie oben oder unten auf Ihrer Website eine Leiste mit einer benutzerdefinierten Nachricht hinzufügen mit denen Sie oben oder unten auf Ihrer Website eine Leiste mit einer benutzerdefinierten Nachricht können. Das ist es. Das ist die ganze Sache. Das ist der komplette Stecker des gesamten Geschäfts. Die Sache ist also, der Himmel ist die Grenze. Es geht darum, Probleme zu lösen, Probleme, von denen Sie wissen, dass sie Ihnen wichtig sind und die Sie selbst lösen möchten. Immer noch auf WordPress gibt es eine App, mit der Sie den Google Analytics-Code oder das Tracking von Facebook-Anzeigen einfügen können Google Analytics-Code oder das Tracking von Facebook-Anzeigen einfügen . Und so einfach ist das. Es ist nicht allzu kompliziert. Jetzt hat ein Typ Vibe eine Horoskop-Plattform live auf TikTok codiert , und sie läuft sehr, sehr gut Hodoskop was auch immer. Das ergibt keinen Sinn. Es ist nicht für mich, aber vielleicht ist es für dich. Nun, ein anderer Typ hat eine Wallpaper-App gemacht, aber nur für die bestimmte Art von Anime. Du musst nicht zum nächsten Uber oder zur nächsten Tür gehen. Du kommst auf ein, fünf, zehn K pro Monat. Du musst tatsächlich ein Problem für eine kleine Nische von Leuten lösen. Aber nehmen wir an, Sie haben keine dieser Ideen, oder? Nun, wir haben die Portfolio-Website erstellt, oder? Warum bieten Sie diesen Service nicht einigen lokalen Unternehmen an? Finden Sie 100 von ihnen in Ihrer Nähe, in Ihrer Stadt, in Ihrem Land und bitten Sie sie um 1.000 USD oder 80 Dollar pro Monat Und Sie haben gerade ein gutes Stück Veränderung vorgenommen. Es gibt andere Plattformen, die Ihnen Listen aller Zahnärzte in Ihrer Stadt oder Ihrem Land in York Jetzt kommt es darauf an, dass Sie den richtigen Ansatz finden. Schicken Sie ihnen eine E-Mail? Rufst du sie an? Tauchst du im Geschäft auf? Zahlen Sie 1.000$ oder 800$? Und das müssen Sie natürlich nicht nur mit Zahnärzten tun Denken Sie an all die anderen Unternehmen in Ihrer Nähe, die gutes Geld verdienen, aber schreckliche Websites haben. In meinem Teil der Welt sind das Restaurants, das sind Anwälte, das sind Dienstleistungsgeschäfte, das sind Tierärzte Die Liste geht weiter und weiter. Sie haben natürlich unzählige Webdesign-Agenturen. Aber Ihre kann anders sein , weil Sie sich auf einen bestimmten Bereich spezialisieren können , den Sie möglicherweise sehr gut kennen Oder dass du bald sehr gut lernen wirst. Sie bieten eine gute Website bereits mit wenig bis gar keiner Wartung codiert wurde. Deshalb ist es ein Rennen, weil immer mehr Leute anfangen werden , dasselbe anzubieten, oder? Denn wenn Sie eine Website in fünf, zehn, 15, 20 Minuten erstellen können, was heißt das dann, oder? Willst du vielleicht 600 Dollar verlangen? Der nächste Typ wird 400 verlangen und plötzlich, ab 1.000$, fängst du an, es für ein paar Cent anzubieten Zeit ist also von entscheidender Bedeutung. Deshalb habe ich gesagt, dass es sich lohnt, früh dran zu sein. Aber natürlich besteht kein Grund zur Panik. Es gibt mehr als genug für alle. Also mein Rat, bevor Sie etwas kreieren , das Sie verkaufen möchten, beginnen Sie mit ein paar kleinen, lustigen Projekten. Lassen Sie uns jetzt eine Pause machen. Hoffentlich können Sie jetzt sehen, dass es eine Welt voller Möglichkeiten gibt, aber Sie müssen nicht das 100.000.000-Dollar-Geschäft anstreben Löse einfach kleine Probleme wie Umwandlung von quadratischen Ecken eines Bilds in abgerundete Und das ist vielleicht ein Fonds von 100 Dollar pro Monat. Es klingt albern, ich weiß, aber die sozialen Medien sind voller Geschichten wie dieser Es heißt Bauen in der Öffentlichkeit und ist eine großartige Möglichkeit, Werbung zu machen Du postest ständig über deine Reise. Dieser Aufbau einer öffentlichen Bewegung ist fantastisch , weil man sich von ihren Projekten inspirieren lassen kann, und man kann auch aus ihren Fehlern lernen , um sie zu vermeiden. Wenn du ihre Profile siehst, kannst du sehen, dass es sich nur um normale Leute handelt. So können Sie sich inspirieren lassen. Der Typ, der ply.com programmiert hat, hat jeden Schritt seiner Reise dokumentiert und wie er sie im Laufe vieler Jahre ausgebaut Er war völlig allein. Er hat alles codiert, auf die altmodische Art und Weise. Er war der einzige Entwickler. Aber jetzt bist du vielleicht allein, aber du hast das Wissen und die Leistung von 100, 1.000 erfahrenen Entwicklern in deiner Ecke für 15, 20, 25 Dollar pro Monat, oder? Sie werden also nicht Jahre brauchen , um Ihr Projekt zu erstellen. Sie können im Marketing scheitern, aber dann können Sie es ein anderes Mal und ein anderes Mal und ein anderes Mal tun . Sie können es erneut versuchen. Du kannst schnell scheitern. Du kannst lernen. Und dann wirst du irgendwann Erfolg haben. Ob es groß oder klein ist, es liegt an dir. Es liegt in deinen Händen. Aber ja, jetzt ist die Frage, was willst du bauen? Es mag albern sein. Es mag klein sein Aber wenn du weiter versuchst und lernst, verspreche ich dir, dass du Ergebnisse erzielen wirst. Lass uns mit Windsor weitermachen. 6. Fortbewegung beim Windsurfen: Willkommen zurück. Starten wir Windserf, damit wir seine Oberfläche erkunden können Das mag sich bei dir ändern, aber die Grundlagen werden immer da sein Wir haben oben ein Hauptmenü, das wir eigentlich nicht benutzen werden, ein Handtuch-Panel auf der linken Seite und auf der rechten Seite haben wir unser herrliches Kaskaden-Panel, in dem wir mit dem Programm sprechen und es Sachen bauen lassen Wenn Sie ein Projekt starten, sollten Sie irgendwo auf Ihrem Computer einen Ordner erstellen dann die Schaltfläche Ordner öffnen verwenden Nur für den Fall, dass Sie in der Vergangenheit an einem anderen Projekt gearbeitet haben, können Sie sie hier sehen. Und in diesem Fenster auf der rechten Seite namens Kaskade kann ich beginnen, Schritt für Schritt Anweisungen zu geben , indem ich dieses Feld hier verwende, oder ich kann eine frühere Konversation fortsetzen , indem ich hier darauf klicke Arbeiten Sie jetzt nicht weiter, sondern beobachten Sie einfach, was passiert also in ein aktives Projekt springen, gibt es eine Menge zu sehen, oder? Aber lassen Sie uns das Team wechseln , weil Sie vielleicht die Benutzeroberfläche ändern möchten, oder? Gehen Sie also zum Hauptmenü zur Datei. Gehen Sie von hier aus zu den Einstellungen. Dann suche nach Team. Und zum Schluss klicken Sie hier auf Farbteam. Im Moment, nachdem Sie auf eines davon geklickt haben, wird das Fenster geschlossen, was nicht ideal ist, aber es wird erneut geöffnet. Dateieinstellungen, Team-Farbteam und wählen Sie eines davon aus. Okay, großartig. Um die Benutzeroberfläche besser zu sehen, können Sie als Nächstes Control Plus verwenden , um den Text zu vergrößern. müssen Sie jetzt nicht tun, aber wenn der Text schwer lesbar ist, ist das eine Option. Also Control plus. Um es zu verkleinern, verwenden Sie Control minus. Nun zurück zu einem echten Projekt, Sie müssen eigentlich keinen Code lesen Die Oberfläche ist ziemlich überwältigend, aber in 90% der Fälle, wenn nicht mehr, werden Sie sich hier auf der rechten Seite auf Cascade konzentrieren hier auf der rechten Seite auf Cascade Hier werden Sie also sehen, wie die künstliche Intelligenz denkt und woran sie arbeitet Es wird dir sagen, wann es Fehler gibt und was es im Grunde getan hat . Nun, der Rest der Oberfläche, nun, Sie haben hier eine Datei in Explosionsform, durch die Sie alle Dateien im Projekt sehen können, und diese werden tatsächlich hier im Hauptteil des Bildschirms geöffnet Wenn Sie also auf die Dateien auf der linken Seite klicken, werden sie hier in der Mitte des Bildschirms geöffnet Beachten Sie die sich öffnenden Tabs, die Ihrem Browser sehr ähnlich sind. So können Sie sie schnell durchgehen. Also, wirst du das tun? Nein, in 99% der Fälle, nein. Nochmals, unser Fokus wird hier auf der rechten Seite auf Cascade Okay, mit der Bodenplatte ist es ungefähr genauso. Probleme, Ausgänge, Terminal und so weiter. Wir werden dieses Bit nicht wirklich oft benutzen. Das Terminal mag sich als nützlich erweisen, aber ja, wir werden es Schritt für Schritt angehen. Während also alles, was verschlüsselt wurde, für normale Menschen so einschüchternd wirkt , ist das eigentlich ganz einfach weil man das meiste davon weglässt Du sprichst mit der KI hier auf der rechten Seite, dann war's das. Nun, hier gibt es eine wichtige Einstellung: Schreiben und Chatten. Wir werden immer Write verwenden, was einfach bedeutet, dass wir alles von der KI erstellen lassen. Erfahrene Programmierer möchten jetzt vielleicht einfach mit der KI sprechen, um Rat zu bekommen und so weiter Das ist bei uns nicht der Fall. Wir wollen, dass die KI alles macht. Das ist Programmieren. Also, für uns, nein danke. Wir bleiben beim Schreibmodus. Okay, eine Sache, die Sie beachten sollten, ist, dass die KI nur mit den Dateien aus diesem bestimmten Ordner arbeitet . Jede Website, jedes Projekt benötigt also einen eigenen Ordner. So hält man die Dinge klar getrennt. Du öffnest den Ordner und surfst. Sie haben Ihre Konversation auf der rechten Seite und es werden Dateien aus diesem bestimmten Ordner erstellt oder bearbeitet , sonst nichts Die letzte wichtige Einstellung hier ist der Teil, in dem Sie Ihr Modell auswählen. Das wird die Ergebnisse dramatisch verändern. Lassen Sie uns also in der nächsten Vorlesung über Modelle sprechen. Bitte ändern Sie vorerst die Benutzeroberfläche auf ein neues Team und erstellen Sie einen neuen Ordner auf Ihrem Computer. Öffnen Sie ihn dann und surfen Sie beim Windsurfen, damit Sie sich an diesen Ablauf gewöhnen können So kreierst du brandneue Projekte, und das werden wir auch tun 7. Fortbewegung beim Windsurfen: Willkommen zurück. Es gibt bestimmte Tools, die Sie auf Ihrem Computer installieren können, sodass Windsurf bessere Arbeit leisten kann, insbesondere wenn Sie so wenig Arbeit wie möglich erledigen möchten wenig Arbeit wie möglich Jetzt werden wir die vollständige Kontrolle nicht an eine KI abgeben vollständige Kontrolle nicht an eine KI abgeben Stattdessen werden wir sehr bekannte Softwaretools installieren sehr bekannte Softwaretools , die Winserf helfen werden, besser zu funktionieren Nun, wir haben Python bereits installiert, aber wenn Sie es nicht getan haben, tun Sie es bitte. Am Ende werde ich Ihnen ein potenzielles Problem und dessen Auswirkungen zeigen . Um zu überprüfen, ob Ihre Installation gut ist, öffnen Sie nun Ihr Startmenü und geben Sie CMD CMD ist die Abkürzung für Command. Das ist was du willst. Eingabeaufforderung. Geben Sie hier diesen Befehl ein. Und wenn Sie so etwas sehen, können Sie loslegen. Jetzt werden Sie höchstwahrscheinlich eine neuere Version haben , aber das ist völlig in Ordnung. Solange es keine Warnungen oder Probleme gibt , können Sie loslegen. Falls Sie es jetzt nicht schaffen, können Sie unter Windsurf über das Hauptmenü zum Terminal gehen Hier fange ein neues an. Es wird genau hier unten sein. Geben Sie dasselbe ein und sehen Sie, ob es funktioniert. Bei mir ist alles gut. Bevor wir weitermachen, muss ich sagen, dass ich nicht jede Software erklären werde, weil sie kontraproduktiv ist Stattdessen werde ich eine Datei mit ein paar Details zu jedem einzelnen Programm anhängen ein paar Details zu jedem einzelnen Programm Jetzt möchte ich mich auf praktische Dinge konzentrieren. Für mich ist das Ziel einfach. Erstellen Sie Websites so schnell wie möglich. Es wird nicht helfen, jetzt etwas über Python zu lernen. Es wird dir den Kopf schwirren lassen. Also werde ich mich so kurz wie möglich fassen. Ja, Python ist von meiner Liste gestrichen. Idealerweise würden Sie Ihren Computer sicherheitshalber nach jedem einzelnen Schritt neu starten . Hier werde ich weitermachen, auch wenn das einige Probleme verursachen kann. Aber ja, lass uns gehen. Das nächste Ding auf meiner Liste ist dieses. Jetzt keine JS LTS-Version. Dies ist ein weiteres Muss. Und während des Installationsvorgangs werden Sie gefragt, ob Sie ein paar andere Duals installieren möchten Nun, eine Sache, bitte stellen Sie sicher, dass Sie diese Option aktivieren. Es wird ein weiteres Fenster mit vielen Texten angezeigt, und ich meine wirklich viel. Jetzt heißt es auf meiner Seite, dass es Python nicht finden kann, obwohl ich es gerade installiert habe. Ein Neustart meines Computers hätte dieses Problem möglicherweise lösen können. Ich weiß, dass es installiert ist Ich werde weitermachen. Aber die Sache ist, nach einer Weile hört das einfach auf. Aber hier ist die Sache. Öffnen Sie eine Notiz der Befehlszeile und geben Sie Knoten V ein. Sie müssen sich übrigens keinen dieser Befehle merken Sie sind alle mit dem Kurs verbunden. Und ja, ich sehe meine Version hier, also bin ich startklar. Also zwei Programme, die ich abgehakt habe. Als nächstes auf meiner Liste, Power Shell 7. Wir sind im offiziellen Microsoft Store, und das zeigt uns, dass es viele Möglichkeiten gibt, Power Shell Seven zu installieren. Nun, es scheint überwältigend, aber es ist eigentlich ganz einfach. Wir werden diese Methode verwenden, Win Get, welche Methode wird empfohlen? Hier gibt es eigentlich nur zwei Schritte. Es sieht kompliziert aus, ist aber eigentlich ganz einfach. Das ist der erste. Sie öffnen also die Befehlszeile. Sie klicken hier, um diesen Text zu kopieren, und fügen ihn dann einfach mit Strg V ein. Sie erhalten hier eine Frage, geben Sie Y wie Ja ein und drücken dann die Eingabetaste. Es scheint, dass zwei Versionen verfügbar sind. Vorschau bedeutet so viel wie Beta. Es ist also eine Version, die ein bisschen experimentell ist , normalerweise weniger stabil. Das wollen wir nicht. Also wollen wir den anderen. Also das ist Schritt zwei, um es zu installieren, kopieren Sie diesen Befehl. Auch hier nicht die Vorschauversion, das ist etwas weiter unten, und fügen Sie es dann in die Befehlszeile ein. Und nach ein paar Sekunden wird das installiert. Testen Sie es jetzt, öffnen Sie erneut Ihr Sternmenü und geben Sie Push ein. Verwenden Sie jedoch anstelle eines U ein W, und Sie sollten sehen, dass Powershell 7 verfügbar ist Jetzt geht es uns ganz gut. Lass uns mit GitHub weitermachen. Wir benötigen ein Konto, aber wie bei allem anderen ist es völlig kostenlos. Geben Sie Ihre E-Mail-Adresse ein, dann müssen Sie sie nach einer Weile verifizieren, und das war's, wir können loslegen. Github wird dringend benötigt, auch wenn es sehr einschüchternd sein kann Wie Sie gleich sehen werden, werden wir uns auf das Wesentliche konzentrieren, und schon bald werden Sie sich damit wohl fühlen Okay, tolles Zeug. Als Nächstes werden wir Docker installieren Dies wird als optional angesehen, aber ich hatte einige Probleme weil ich es nicht installiert hatte. Ich würde es also viel lieber haben, wenn Sie es auch installieren Dies ist eines der am langsamsten zu installierenden Programme, aber es gibt eigentlich nicht viel, was Sie tun müssen Es ist nur langsam zu installieren. Aber ja, wenn es endlich fertig ist und es ein paar Minuten dauern wird , musst du Geduld haben. Sie müssen ein Konto erstellen. Die Sache ist, ich wollte ursprünglich ein Konto einrichten, aber hier ist die Sache mit Qull einigen dieser Tools können Sie sich über Guild Hub anmelden Also, weil wir gerade ein Konto auf GID Hub erstellt haben, warum sollten wir es nicht verwenden, oder? Es ist viel schneller Und hier gibt es noch ein paar andere Dinge. Aber während ich im Hintergrund arbeite, möchte ich erklären, was vor sich geht. Wir sind also dabei, viele Gerichte in der Küche zu kochen, oder? Es wird Frühstück, Mittagessen und Abendessen geben. Es werden Desserts sein. Es werden Snacks sein. Es werden vollwertige Mahlzeiten sein, oder? Das bedeutet, dass wir einen voll ausgestatteten Kühlschrank und Utensilien benötigen einen voll ausgestatteten Kühlschrank und Utensilien Wir brauchen die Zutaten und wir brauchen Messer, Gabeln, Löffel, die Werke, richtig? Das machen wir gerade. Werden wir absolut jeden einzelnen von ihnen in jedem einzelnen Gericht verwenden ? Nein, natürlich nicht, aber es ist viel einfacher, alles sofort zuzubereiten , als zu versuchen , sie beim Kochen zu finden. Schau nach, ob du nach dem Fehler beim Windsurfen eine Fehlermeldung bekommst , weil du dieses oder jenes verpasst hast, dann verschwendest du Zeit Du wirst Credits verwenden, was im Grunde Geld ist Du verlierst Energie und Schwung. Deshalb schlage ich dringend vor, dass Sie alles sofort installieren. Wenn Sie eine Pause einlegen, kommen Sie natürlich auf den Punkt. Aber wenn das erledigt ist, wirst du fliegen. Also das machen wir gerade. Okay, jetzt installieren wir etwas namens Git für Windows. Das wird ziemlich viele Einstellungen haben, aber wir werden eigentlich nur die Standardwerte für jeden einzelnen Schritt verwenden . Jetzt kannst du gerne eine Pause machen, aber ich werde einfach alles akzeptieren , weil Windsurf eigentlich alles regeln wird Nun, mir ist klar, dass diese Liste nicht allzu bequem ist, aber sie wird es der KI ermöglichen , mit weniger Eingaben und mit weniger Eingreifen von uns viel mehr zu tun Eingreifen von Es wird also ein bisschen unabhängiger sein. Okay, schnell vorspulen und wir müssen nur noch drei weitere Konten erstellen. Aber diese sind im Handumdrehen erledigt. Versell ist der erste. Wir werden das verwenden, um unsere Websites zu hosten , damit jeder sie sehen kann, oder? Jetzt ist es wieder kostenlos, also mach dir keine Sorgen. Melden Sie sich über Github an, um den Vorgang zu vereinfachen. Okay, großartig. Als Nächstes verwenden wir Resend, um E-Mails zu senden Dies ist für bis zu 3.000 E-Mails pro Monat völlig kostenlos. Fantastisch, um loszulegen. Und schließlich werden wir ein Konto bei Super Base einrichten, was sich hervorragend für unsere Datenbanken für komplexere Projekte eignet, was wir vielleicht später tun werden. Aber hey, es ist nur ein Klick, also lassen Sie uns das einfach aus dem Weg räumen. Und ja, insgesamt, ob Sie es glauben oder nicht, wir sind mit diesen Tools fertig. Nun, es gibt noch ein paar andere Einstellungen , mit denen wir uns in der nächsten Vorlesung befassen werden. vorerst eine Pause, installieren Sie alles und fahren Sie erst fort, nachdem Sie diese Checkliste durchgearbeitet haben Ich sehe dich gleich wieder, wenn du fertig bist. Unterbrechen Sie den Kurs sofort und installieren Sie alles. 8. Einrichten von MCPs und Regeln in Windsurf – ganz einfach: Willkommen zurück. Wir haben ziemlich viele Dinge wie Python, NoJS, Power Shell installiert Dinge wie Python, NoJS, Power Shell Aber es gibt auch ein paar Dinge, die wir in WinSerf einrichten können Das erste sind Regeln. Sie können zu diesem Abschnitt gelangen, indem sich auf diese Ecke und WinSerf konzentrieren Und innerhalb der Anpassung gibt es ein paar Tabs, Regeln, Workflows und Erinnerungen Jetzt werde ich es so einfach wie möglich halten. Wir sind an globalen Regeln interessiert. Klicken Sie also hier und Sie erhalten ein leeres Dokument in diesem zentralen Teil. Verwenden Sie hier die angehängte Datei , um diese Regeln einfach zu kopieren und einzufügen. Kurz gesagt, wir sagen Winsorf, wie es sich verhalten soll. Es ist, als würde man jemandem sagen wie Sie Ihren Kaffee am liebsten zubereiten möchten, oder Und innerhalb der Regeln haben wir grundlegende Dinge wie wir wollen effizient sein, wir wollen bewährte Verfahren anwenden. Wir wollen, dass es sicher ist und sensible Informationen usw. vertuscht werden. Sie können viele Vorlagen für die Regeln im Internet finden, oder Sie können einfach meine verwenden. Ich habe es auch aus dem Internet bekommen. Jetzt verwenden wir globale Regeln, weil wir wollen, dass Windsurf sie auf jedes einzelne Projekt anwendet Workspace-Regeln wären spezifisch für dieses einzelne Projekt, und das wollen wir nicht Wenn wir beispielsweise zu einem mobilen App-Projekt auf IOS wechseln, haben wir möglicherweise andere Regeln. Also ja, in diesem Fall wäre das sinnvoll. Aber ja, insgesamt ist das, was hier geschrieben steht, eine globale Sache. Kopieren Sie es einfach, fügen Sie es ein, klicken Sie auf Steuerung und Sie können dieses Symbol verwenden, um die Dinge zu aktualisieren. Nach den paar Sekunden solltest du es hier sehen. Okay, jetzt klicken wir auf Plugins. Es ist dieses Symbol genau hier. Das sind die MCPs, und kurz gesagt, wir geben der KI mehr Kontrolle Wenn wir sie nicht verwenden wollen, müssten wir viel mehr Arbeit machen, selbst Code schreiben, mehr Befehle schreiben Das ist im Grunde mehr Arbeit für uns, und stattdessen wollen wir, dass die KI das meiste davon erledigt, oder? Das Tolle ist, dass dies eine offizielle Liste ist. Es ist sicher. Es ist startklar. Jetzt haben Sie vielleicht mehr zur Verfügung weil sie absolut fantastisch sind, und Winsurf fügt immer mehr davon hinzu Aber ja, lass uns anfangen. Die erste Erinnerung. Klicke darauf. Und obwohl Sie dieses Download-Symbol verwenden könnten, bevorzuge ich es, den zentralen Teil hier zu verwenden und auf Installieren zu klicken. Und das ist im Grunde das. Für diesen gibt es keine anderen Einstellungen. Das Gleiche gilt für sequentielles Denken. Dies wird der KI helfen, die Aufgabe in kleinere Teile zu zerlegen , und sie wird sie im Auge behalten, was uns viel bessere Ergebnisse liefern Okay, lassen Sie uns dabei bleiben. Lassen Sie uns Git aktivieren, hier kann etwas passieren und es wird ziemlich nervig sein. Obwohl ich Git für Windows in der vorherigen Sitzung korrekt installiert habe , heißt es, dass es nicht funktioniert. Also werden wir am Ende darauf zurückkommen. Das ist eine Sache, die bestimmt auch auf deiner Seite passieren wird. In Tutorials scheint es so einfach zu sein. Du machst alles richtig. Aber hier ist die Sache, auf deiner Seite funktioniert es nicht. Du verfolgst jeden einzelnen Schritt aus dem Video, aber auf deiner Seite funktioniert es nicht. Ich weiß, dass es frustrierend ist, aber mach dir keine Sorgen. Wir werden unser Bestes tun, um das Problem zu beheben. Als nächstes das Dateisystem MCP. Auf diese Weise kann die KI Ordner erstellen, Dateien verschieben, Kopien erstellen usw., weil sie möchte, dass Sie sich sicher fühlen. Sie fragt, wo genau Sie die Erlaubnis haben möchten Nun, mein Rat ist, dass Sie es auf das gesamte Laufwerk einstellen. Falls Sie nervös sind, können Sie ihm möglicherweise einen Ordner zuweisen, vielleicht innerhalb eines Ordners, aber das kann später zu Problemen führen. Jetzt werde ich immer mein gesamtes Laufwerk einrichten, nicht nur einen einzelnen Ordner weil ich mir da sehr sicher bin. Als Nächstes aktivieren wir Suba Base, was für ernsthafte Projekte eigentlich sehr nützlich ist Nun, das fragt uns nach dem Token, und das ist eigentlich ziemlich üblich Nichts allzu kniffliges. Klicken Sie hier und Sie werden genau zu dieser Seite weitergeleitet. Eins: Zeig deine Schlüssel niemals jemandem. Es ist, als würden Sie Ihre Kreditkartennummer im Internet zeigen. Alle möglichen schlimmen Dinge können passieren. Aus diesem Grund können Sie es nicht sehen, nachdem Sie diese Seite verlassen haben. Du wirst es einmal sehen. Also sag das an einem sicheren Ort. Ich werde es einfach in Windsurf einfügen. Okay, lassen Sie uns so weitermachen, aber bitte machen Sie bei Ihrer zweiten Besichtigung so oft eine Pause wie nötig Lass uns zu GitHub gehen. Zuvor war es Git, was eine Sache ist. Jetzt ist das Github, was eine andere Sache ist. Das fragt uns nach dem Token. Sie können Google verwenden, um nach Github, dem persönlichen Zugriffstoken, zu suchen . Oder du kannst das tun. Gehen Sie zu Ihrem Browser, gehen Sie zu github.com und dann zu den Kontoeinstellungen Jetzt finden Sie von hier auf der linken Seite unten die Entwicklereinstellungen Und in diesem neuen Fenster werden Sie genau sehen, welches persönliche Zugriffstoken wir wollen. Wir wollen den Klassiker. Erstellt, aber sei dir bewusst, dass du einen Namen und ein Ablaufdatum einrichten musst. Ich empfehle 90 Tage, aber Sie müssen absolut alles selbst abhaken . Ich weiß, dass du es satt hast, Dinge zu , aber ich verspreche dir, das wird unser Leben um einiges einfacher machen. Überspringen Sie keinen einzigen Schritt. Es ist ziemlich wichtig. Aber ja, insgesamt, jetzt bereit für Rock 'n' Roll. Alles ist eingerichtet. Die gesamte Liste ist von meiner Seite abgehakt. Eines jedoch, es scheint, als ob Github nicht funktioniert. Das Problem hat etwas mit Docker zu tun, was etwas seltsam ist Auf jeden Fall ist hier die Sache. Wenn Sie Ihren Computer neu starten, startet Docker möglicherweise nicht von selbst In diesem Fall werde ich es starten und dann eine Minute warten , und dann eine Minute warten bis es geladen ist Und dann aktualisiere ich, indem ich das Symbol oben rechts verwende. Eines jedoch: Bitte haben Sie etwas Geduld mit Docker. Unabhängig von Ihrem Computer wird er ziemlich langsam geladen Okay, es hat angefangen, also lassen Sie uns aktualisieren. Und ja, bitteschön. Wir sind gut. Das ist alles in Ordnung. Du magst sagen, was ist mit einigen anderen hier in Windsor, ein paar anderen MCPs Nun, im Moment, wenn Sie versuchen, mehr davon zu aktivieren, erhalten Sie eine Fehlermeldung Ich bin mir sicher, dass wir in naher Zukunft immer mehr hinzufügen können. Aber zu diesem Zeitpunkt ist es soweit. Eine ziemlich kurze Liste, ziemlich schade. Aber ja, jetzt kannst du pausieren, alles auf deiner Seite einrichten, damit du auf dem neuesten Stand Aber falls auf deiner Seite etwas nicht stimmt, kannst du zum nächsten Video springen. 9. So beheben Sie Probleme: Alles funktioniert, Sie können zum nächsten Video springen. Aber falls etwas nicht stimmt, schauen Sie es sich an Ihrer Seite weiter an. Es ist mein Fall. Aus welchem Grund auch immer, der Git MCP-Server funktioniert nicht und er sagt, dass es an Python liegt Wir haben Python installiert und es schien in Ordnung zu sein, oder? Also habe ich den Fehler kopiert und Google benutzt. Ich habe ein paar Dinge auf Stack Overflow gefunden. Ich habe viele Lösungen ausprobiert, aber sie haben nicht funktioniert. Um es klar zu sagen, ich bin kein Entwickler. Ich habe keine Ahnung , was das Problem ist. Wie Sie mit diesen Problemen umgehen, wenn sie auftauchen, wird Ihren Erfolg bestimmen . Also wiederhole ich. Du befolgst alle Anweisungen, sei es aus dem Kurs oder aus dem Internet, aber die Dinge werden nicht funktionieren. So läuft es gerade. Wie Sie also mit dieser Situation umgehen , wird Ihren Erfolg bestimmen. Hier habe ich ein paar Dinge ausprobiert und bin dann auf Chat GPT umgestiegen Sie können es völlig kostenlos nutzen oder sich anmelden. Ich empfehle Ihnen, sich anzumelden, auch wenn es sich um ein anderes Abonnement handelt, es kostet weitere 20 Dollar pro Monat oder was auch immer , auf Ihrer Seite. Aber ich benutze es ziemlich oft, also kann ich es ehrlich empfehlen. Sie werden es übrigens nicht für den Zweck dieses Kurses benötigen . Es ist einfach etwas Gutes, das man haben kann. Okay, ich habe dieses Modell verwendet, das sehr gut darin ist, zu denken und zu argumentieren Ich habe genau gesagt, was passiert. Hallo, ich verwende Windsurf AI und erhalte diesen Fehler Die unterhaltsame Lösung, die es mir gegeben hat , war ziemlich kompliziert Für meinen Geschmack sagte ich: Nein, danke. Es ist ein bisschen knifflig. Also bin ich zum zweiten übergegangen Hier hatte ich keine Ahnung, was diese bedeuteten, aber ich fing einfach an, sie in mein CMD-Fenster einzufügen Die erste Zeile schien also nicht zu helfen. Also versuchte ich es mit dem zweiten, dem anderen. Und ja, nach den paar Sekunden hat es etwas installiert und ich hatte das Gefühl, dass es funktioniert. Ich bin zurück nach Windsor gegangen. Und ja, es ist alles gut. Aber hier ist ein weiterer Fall auf einem anderen Computer. Das Git NCP funktioniert nicht, aber aus einem anderen Grund, ich weiß ehrlich gesagt nicht, was das bedeutet, und um ganz transparent zu sein, habe ich nicht vor, es zu lernen Stattdessen werde ich dieselbe Methode verwenden. Ich werde Chat GPT OT danach fragen. Ich werde 03 verwenden, weil es derzeit das fortschrittlichste Denkmodell und für mich kostenlos ist Ich zahle 20 Dollar pro Monat, sodass ich unbegrenzt viele Diskussionen Wenn Sie aus irgendeinem Grund keinen Zugriff auf CHA GPT haben , verwenden Sie Cascade, und es ist sehr wahrscheinlich, dass Sie dieselbe Antwort erhalten Nun, hier in CHA GPT, habe ich gesagt, dass es weitergeht Und dann, nach ungefähr 90 Sekunden oder so, gab es mir einen schrittweisen Plan Zuallererst muss ich etwas mit Power Shell installieren . Und hier ist der genaue Befehl. Okay, das ist also einfach genug. Ich verwende das Startmenü und gebe dann Push ein, aber mit einem W. Jetzt kopiere ich in Power Shell den Befehl, füge ihn ein und drücke die Eingabetaste. Okay, jetzt wird etwas installiert. Es macht verschiedene Dinge. Und okay, ja, es scheint , als wäre es startklar. Okay, ziemlich cool. Nun zum nächsten Schritt, es gab mir einen anderen Befehl, aber es besteht darauf, dass ich ein neues Terminal öffne. Okay, ziemlich gut Ich werde Push noch einmal eingeben und den Befehl einfügen. Aber das wirft natürlich ein Problem auf. Ich habe zwei verschiedene Zeilen kopiert, was nicht korrekt ist. Aber ich werde es trotzdem einfügen, und es scheint, dass wir gut sind. Der zweite Schritt besteht nun darin, Windsurf neu zu starten. Lass uns das nicht überspringen. Ich bin froh , dass ich meinen Computer jetzt nicht neu starten Ich muss eine Sekunde warten, bis er warm ist Ich drücke den Refresh-Knopf von oben rechts und schon habe ich gewonnen. Tolles Zeug. Nun, was Sie betrifft, bin ich mir sicher, dass Sie andere Probleme haben werden , andere Probleme. Aber erinnere dich an eine Sache. Sobald Sie sie gelöst haben, können Sie loslegen. Du wirst fliegen. Das ist die Essenz von Vibe Coding Sie müssen nicht wissen, wie man codiert. Man muss A-Patienten haben, B die richtigen Fragen stellen und C, das Wichtigste, Dinge ausprobieren, bis es funktioniert. Nun, hier ist die Sache. Ich hätte meine Frage Cascade und Windsurf stellen können. Aber da ich bereits Chat-GPT habe, warum sollte ich es nicht benutzen, oder? Ich würde viel lieber eine kostenlose Antwort bekommen , als Credits und Windsurfen zu verschwenden Um es zusammenzufassen: So entstehen Kopfschmerzen. So oder so, es ist simples ABC und Erfolg, oder? In Ihrem Fall können Sie Stunden mit Schritt B verbringen, und Sie stecken fest und können nicht weitermachen. Solange Sie meinen Rat im Hinterkopf behalten, Geduld haben, die richtigen Fragen und Dinge ausprobieren, bis sie funktionieren, wird es Ihnen gut gehen. Denken Sie daran, das ist der Preis, den Sie zahlen müssen, wenn Sie so früh da sind. Früh dran zu sein bedeutet, ohne Fehler und andere Probleme zu haben, aber das ist ein kleiner Preis, den Sie für Ihre Zukunft zahlen müssen. Und damit wollen wir weitermachen. 10. Claude im Vergleich zu GPT: Komm zurück. LLMs sind große Sprachmodelle, und sie sind das Wichtigste, was Windsurf verwendet Die gesamte Intelligenz kommt also durch diese LLMs, die die meisten Leute Modelle nennen. Das ist also ein Modell. Um es klar zu sagen: Windsurf ist das Hauptprogramm, aber der Großteil seiner Intelligenz stammt von diesen Modellen verschiedener Unternehmen Windsurfen ist also wie eine Pfeife. Die Modelle sind das Wasser. Könnte das Wasser nun auch ohne das Rohr fließen? Klar, natürlich, aber es kann überall sein. Windsurf sorgt also dafür, dass du mehr von dem bekommst, was du willst, und deshalb verwenden wir Andernfalls könnten wir uns einfach bei einem bestimmten Unternehmen anmelden und dieses spezielle Modell verwenden, oder? Aber das wäre viel einschränkender und wesentlich teurer. Aus diesem Grund ist Windsurfen eine viel bessere Wahl. Über Winsurf erhalten Sie also Zugang zu den meisten Unternehmen und zu den meisten Modellen auf dem Markt Aus diesem Grund können Sie, wenn Sie hier in das Kaskadenfenster klicken, aus einer ganzen Reihe auswählen Und jetzt ist die Frage, wenn das so wichtig ist, welches sollten Sie wählen, oder? Und die kurze Antwort lautet, es kommt wirklich darauf an. Ich werde den Besten die gleiche Aufgabe geben, damit wir die Ergebnisse vergleichen können, damit wir gemeinsam entscheiden können. Aber auch hier werden Sie sehen , dass es wirklich darauf ankommt. Jetzt haben Sie die Aufgabe angehängt, also sollten Sie dasselbe tun. Bei Ihrem zweiten Besuch sollten Sie dies auf Ihrem eigenen Computer versuchen, sollten Sie dies auf Ihrem eigenen Computer versuchen nur um sicherzustellen, dass Sie dieselbe Erfahrung gemacht haben. Nun, hier ist der Grund, warum es bei Ihnen anders sein kann. Modelle ändern sich oft. Was heute langsam ist, kann morgen also ziemlich schnell sein. Also behalte das im Hinterkopf. Okay, fangen wir mit einer klaren Seite an. Wenn du mit dem Windsurfen anfängst, bekommst du das vorherige Projekt Sie können aber zum Hauptmenü gehen, um eine Datei zu erstellen. Klicken Sie von hier aus auf Neues Fenster. Großartig. Jetzt können wir die Funktion zum Öffnen von Ordnern verwenden und ich suche nach einem Speicherort Direkt in diesem Fenster erstelle ich einen neuen Ordner und nenne ihn mit dem Namen des Modells Das ist optional. Der Name spielt wirklich keine Rolle. Es liegt an uns, uns zu organisieren. Wolke 37. Okay, großartig. Wählen Sie diesen Ordner aus und wir laden unser brandneues Projekt in Windsor hoch Übrigens, wenn Sie es nicht verwalten können, gehen Sie auf Ihrem Computer zu Ihrem Laufwerk und erstellen Sie auf einfache Weise einen Ordner Ich werde diesem Ordner auch ein paar Bilder hinzufügen. Am schnellsten ist es nun, in dieses Fenster zu klicken und Reveal Explorer auszuwählen. Dann kopiere ich einfach den Ordner mit ein paar Bildern und füge ihn ein. Um sicherzugehen, dass das Modell weiß, dass sie da sind , klicke ich mit der rechten Maustaste und wähle „Als Pfad kopieren“. Wir müssen diese Adresse in die Textdatei einfügen. Wenn Sie keinen Pfad kopieren müssen, ist das kein Problem. Einfach hier klicken und die Adresse kopieren. Es ist genau das Gleiche. so oft eine Pause, wie Sie müssen, aber wir werden das in dieser Vorlesung noch ein paar Mal machen , also machen Sie sich keine Sorgen. Okay, die Bilder sind natürlich angehängt. Das Modell ist auf Cloud eingestellt. Jetzt füge ich die Aufgabe ein und starte den Timer. Okay, nun, das funktioniert. Lass mich dir eins sagen. Winserf ist so etwas wie ein Auto Welche Reifen solltest du gut anziehen , das liegt wirklich an dir Gibt es eine bestimmte Reifenmarke und ein bestimmtes Modell, die absolut besten auf dem Markt sind? Nein, natürlich nicht. Es gibt Premium-Marken, es gibt mittelgroße Marken und natürlich gibt es billige. Es ist also keine klare Sache. Es gibt keinen klaren Gewinner. Es ist dasselbe im Fußball mit Telefonen, mit Cola und Pepsi, mit fast allem Es gibt einen Kampf zwischen zwei, drei, fünf sehr gut etablierten Unternehmen Es ist also immer etwas , bei dem es viel Konkurrenz gibt und Sie aus vielen Optionen wählen können. Und bei diesen KI-Modellen ist es genauso. Und hier ist eine Tabelle, die Ihnen zeigt, welche Modelle derzeit verfügbar sind. Anthropic ist ein Unternehmen. Open AI ist natürlich ein anderes. Google ist im Spiel, aber es gibt auch Twitter, das X AI heißt. Und das ist Deep Sky. Es gibt chinesische Unternehmen, und es werden bestimmt noch ein paar mehr hier auftauchen. Nun, das kann Ihnen so viele Entscheidungen in den Sinn bringen, oder? Und mehr noch, sie haben alle unterschiedliche Kosten und Fähigkeiten Und was wir hier sehen, ist, dass einige Modelle sehr intelligent, aber ziemlich langsam sind. Manche sind intelligent, aber sie sind super teuer. Es ist genau so, als würde man ein Auto kaufen oder ein Telefon kaufen. Sicher, sie machen alle irgendwie dasselbe, oder? Manche Leute schwören auf BMW. Andere Leute würden nichts anderes als einen Mercedes fahren. Einige skurrile Leute bevorzugen vielleicht Lexus. Bei diesen Modellen ist es genauso. Jeder von ihnen hat eingefleischte Fans. Aber hier ist der Clou. Neue Versionen kommen immer heraus und das ziemlich schnell. Also, was empfehle ich? Ich sage, bleib bei den Besten. Probiere sie aus und sieh dir die Persönlichkeiten an. Denn ja, sie haben Persönlichkeiten. Nun, was ich oft benutzt habe, ist das Folgende. Es ist Cloud 3.7, GPT 4.1 auf vier Mini High und Gemini 2.5 Pro Dies wird sich in den nächsten Wochen oder Monaten sicherlich ändern , aber hier ist, was Sie beachten müssen Sie müssen sie testen, und genau das tun wir in dieser Vorlesung. Oh, übrigens, schauen wir uns das an. Das ist also auf einem neuen Computer mit einer sehr einfachen Einrichtung, nicht das, was wir zuvor zu Beginn des Kurses getan haben. Wir haben also keine Tools installiert. Also fing Claude sofort an. Es schlägt einen sehr soliden Ansatz mit einem schönen Textstapel, React und dem nächsten JS Sie müssen nicht wissen, was das bedeutet, aber es ist ein sehr gutes Zeichen dafür, dass das Modell bewährte Verfahren der modernen Technologie anwendet bewährte Verfahren der modernen Technologie Nun, hier ist das Erste im Terminal, wir müssen die Eingabetaste drücken, sonst geht es nicht weiter. Dies ist für die meisten Menschen möglicherweise nicht sehr offensichtlich. Dies ist einer der Fälle, in denen Sie sich nicht nur auf das richtige Panel konzentrieren sollten. Die Unterseite, das Terminal, ist von Zeit zu Zeit auch sehr wichtig. Jetzt installiert es eine ganze Reihe von Sachen. Aber ich warte hier und es scheint, als ob es stecken geblieben ist. Es ist eingefroren. Ich bin mir nicht sicher, was los ist. Also hier ist die Sache. Lass uns damit aufhören. Und jetzt, um es wieder aufzunehmen, müssen wir sagen, weiter. Okay, wenn im rechten Bereich eine Schaltfläche zum Akzeptieren erscheint, werde ich ziemlich schnell auf Akzeptieren klicken. Jetzt werden Sie ein paar s bemerken, obwohl das Modell absolut alles gemacht hat, und es scheint, als ob es wieder nicht mehr funktioniert. Also werde ich eine dritte Eingabeaufforderung verwenden und noch einmal „ Weiter“ sagen. Diesmal hat Claude allerdings die Standards fallen lassen. Es versucht nicht mehr, dieses Text-Tag von Anfang an zu verwenden. Nein, es wurde auf etwas viel Einfacheres herabgestuft. Es wird immer noch funktionieren, aber es ist keine gute Übung. Es geht von einem brandneuen Auto zu einem Auto von 1999. Es macht gewissermaßen dasselbe, klar, aber es werden Funktionen fehlen. Und ich muss sagen, dass ich nach fünf Minuten ziemlich enttäuscht bin. Es bewegt sich viel langsamer als ich erwartet hatte. Ich zoome weiter und nach etwa 7,5 Minuten ist es fertig. Wir könnten diese Schaltfläche mit dem Namen Öffnen und externer Browser verwenden , aber dieses Mal gehe ich in den entsprechenden Ordner und suche nach der Indexdatei, ganz klassisch. Und so sieht die Website aus. Nichts Verrücktes, aber es sieht ziemlich okay aus. Das ist ein Schwebezustand. Die Schrift ist nett und klobig. Es befolgte unsere Anweisungen. Ja, insgesamt bin ich damit ziemlich zufrieden. Und ich denke, die mobile Version ist eigentlich auch ziemlich solide. Nichts, worüber man schreien könnte, aber solide. Vergleichen wir es jetzt mit etwas. Wechseln wir zu GPT 4.1. Ich werde alle meine Einrichtungsschritte in einer angehängten Datei hinzufügen in einer angehängten Datei Okay, bitte überprüfe es. Also werde ich weitermachen. 4.1 schlägt auch etwas ziemlich Starkes vor: React and Vet und dann Rückenwind CSS Auch hier ist es völlig in Ordnung, wenn Sie nicht wissen, was das bedeutet, aber es ist solide. Es ist ein großartiges Zeichen. 4.1 checkt die Bilder aus und erstellt Dateien ziemlich schnell. Weniger als eine Minute und ich bin ziemlich glücklich. Aber hier ist die Sache. Hier ist, was passiert. Es dreht sich spiralförmig nach unten. Ein Fehler nach dem anderen. Und das geht eine Weile so weiter. Und dann war ich ziemlich überrascht. Es hat aufgehört zu funktionieren, ohne etwas zu sagen. Ich habe nach einer Indexdatei gesucht, aber es gab keine. Also das meine ich mit Persönlichkeit. Normalerweise sagt mir Claude immer , was los ist? Wie ist die Situation. Und oft macht es viele Schritte ohne anzuhalten und mich nach Dingen zu fragen. Aber ich habe gehört, dass dieses Modell, 4.1 von Open AI, viel nervöser ist. Es pausiert oft und verbraucht tendenziell viel mehr Credits, weil es möchte, dass wir bestätigen, ob wir weitermachen wollen Natürlich wollen wir weitermachen. Zu den Kosten später mehr. Aber ja, das ist teurer. Das wird mehr Geld kosten. Aber ja, um darauf zurückzukommen, ich musste es erneut auffordern, damit wir weitermachen können. Alles akzeptieren und dann eine letzte Aufforderung, die dritte, weitermachen. Aber ja, ich glaube, es ist schon erledigt. Ziemlich interessant. Okay , aber erst jetzt hat es mir die Adresse der Website gegeben, ihren lokalen Host. Weil es einen anderen Text, einen anderen Ansatz verwendet hat, hat es eigentlich keine Indexdatei erstellt. Interessant. Okay, lassen Sie es uns jetzt einfach halten. Lass es uns öffnen, aber es wird nicht geladen. Nun, hier ist das gelbe Licht in diesem Bereich. Also, das bedeutet, dass etwas versucht zu laufen. Also lass uns das Terminal öffnen. Und hier scheint es, als würde es mich bitten, einen Befehl auszuführen, ihn selbst einzugeben und selbst auszuführen, was ein bisschen frustrierend ist Ich hätte mir gewünscht , dass es das alleine gemacht oder es zumindest abgetippt Aber es ist was es ist. Okay, lass mich das eintippen. Okay, starte es und dann ein paar Probleme und es sagt mir, was ich tun muss, um es zu beheben. Auch hier geht es um einfaches Kopieren und Einfügen. Es ist nichts Wichtiges Aber anfangs hatte ich keine Ahnung, dass ich das alleine machen musste. Also, okay, gehen wir zur vierten Aufforderung, um fortzufahren. Und jetzt glaube ich, dass der Server läuft und wir ihn überprüfen können. Okay, ja, schauen wir uns das an. Das Design sieht ganz okay aus. Es ist ziemlich viel dunkler und hier ist eine lustige Sache. Ich wollte einen Instagram-Feed, obwohl ich wusste, dass das sehr schwierig zu implementieren sein würde . Es wurde einer hinzugefügt, aber es ist ein zufälliger, nicht der, den ich erwähnt habe. Also ist das ein Gewinn? Nein, ich bin mir nicht sicher. Insgesamt ist es ein anständiges Design mit einem guten Tex-Tag, und die mobile Version ist auch anständig genug. Das ist also, dass GPT 4.14 insgesamt ordentliche Ergebnisse liefert, aber wir sehen bereits einen ziemlich großen Unterschied zwischen Lass uns nach der kurzen Pause weitermachen. Arbeite noch nicht mit. Lass mich auch die anderen machen. 11. GPT gegen Gemini gegen Grok: Willkommen zurück. Lassen Sie uns diese Modelle weiter vergleichen. Lassen Sie uns also mit GPT 04 weitermachen. nun, während ich das eingerichtet habe, Lassen Sie mich nun, während ich das eingerichtet habe, schnell 4.1 im Vergleich zu 04 erklären Kurz gesagt, jedes Modell ist auf den Anwendungsfall zugeschnitten. Es ist ein Sportwagen im Vergleich zu einem Siebensitzer-SUV. Sie zeichnen sich durch verschiedene Dinge aus. Sie sind für verschiedene Zwecke gedacht, oder? 04 konzentriert sich sehr auf das Codieren. Es unterstützt keine Bilder. Es konzentriert sich auf Argumentation und Logik, was im Grunde bedeutet, dass es hervorragend programmieren kann, oder? Auf der anderen Seite ist 4.1 universell. Es ist eine typische Limousine, die die meisten Menschen für fast alles benutzen können. Bedeutet das, dass es sich in jeder einzelnen Sache auszeichnet ? Nein, natürlich nicht Wenn man mit allem einverstanden ist, ist es in nichts großartig, oder? Nun, das ist offensichtlich kein umfassender Vergleich zwischen diesen beiden, aber ich hoffe, Sie verstehen, warum ein Unternehmen verschiedene Modelle herausbringt, genau wie Automarken. Sie bieten Sportwagen mit zwei Sitzen , eine Limousine, einen SUV, einen Pickup usw., unterschiedliche Anwendungsfälle mit unterschiedlichen Bedürfnissen. Aber ja, zurück zur Sache, 04 ist wirklich, wirklich nachdenklich. Nun, wo die anderen Modelle sofort angefangen haben , zögert dieses Nach 2 Minuten hat es nichts Produktives gebracht. Ich habe gerade meine Bilder in dem Ordner gesehen und das war's. Das ist also ein bisschen enttäuschend. Und diese Langsamkeit geht weiter, und es ist eigentlich ziemlich nervig Denken Sie daran, dass der Preis im Moment etwas niedriger ist als bei den anderen. Es sind tatsächlich 25% der Kosten im Vergleich zur Cloud, zum Beispiel. Aber hier ist die Sache. Es ist eigentlich ziemlich langsam. Aber überraschenderweise ist es nach etwa 4 Minuten tatsächlich fertig auf der Website. Das Projekt ist abgeschlossen. Schauen wir uns das mal an und wissen Sie, die Website ist gar nicht so toll. Das Modell hat uns übrigens nicht gesagt, was es verwendet hat. Welches Framework hat es verwendet? Es hieß nicht, dass es nicht geschafft hätte, das zu verwenden, was die vorherigen getan haben, wie nächstes JS oder VT, was auch immer. Aber ja, es hat eigentlich nicht darüber nachgedacht. Es hat uns nichts gesagt und uns nichts gefragt. Nun, denn bei Knot-Programmierern ist das eigentlich ein ziemlich schlechtes Zeichen, ist das eigentlich ein ziemlich schlechtes Zeichen weil wir keinen Kontext haben Wir können nicht wirklich um Hilfe bitten. Wir wissen nicht wirklich, was mit unserem Projekt los ist. Es hat es gebaut, aber wir haben keinen Kontext, keine Ahnung. Und was das Design angeht. In der mobilen Version können wir sehen, wie der Text die Seiten und auch die Karten berührt . Sie haben an den Seiten keine Atempause. Also ja, es hat den Job gemacht. Es hat es mit einer einzigen Aufforderung erledigt, was auch immer. Aber ich finde das nicht großartig. Aber ja, insgesamt ist das 04. Und hier ist die Sache. Wenn Sie es in einem Diagramm nachschlagen, scheint es eines der besten zu sein. Aber ich denke, in diesem Fall steht es ziemlich weit unten auf der Liste. Es ist langsam. Es hat uns nichts gesagt. Insgesamt kann ich also nicht sagen, dass ich glücklich bin. Ich habe es tatsächlich die paar Tage lang versucht. Ich glaube, es war ungefähr eine Woche, nonstop nur 04. Und Mann, viel zu langsam. Auch wenn es klug ist, entschädigt es nicht. Klar, ich freue mich, dass es nicht viele Fehler macht, aber ja, insgesamt ist es viel zu langsam. Okay, lassen Sie uns zu X AI übergehen, fragen Sie Twitter. Sie haben ein Modell namens Glock. Also werde ich zu genau derselben Aufgabe übergehen, zu den gleichen Schritten Okay, Glock Three sagt, dass sie React und Type Script verwenden will, und sie erklärt, warum. Das ist ziemlich gut Es fängt gut an, indem man ein paar Dateien erstellt, aber etwas faul ist Wie Sie hier sehen können, kommen Evos auf den Markt, und es gibt ziemlich viele davon, nacheinander Also, das ist nicht toll. Also ist hier etwas passiert. Frist überschritten. Ich habe keine Ahnung, was es ist. Aber du hast uns nichts gefragt, also geht es einfach weiter. Also ich denke, es hat sich an das Ziel erinnert , was ziemlich gut ist. Und ja, es werden die Dateien von oben neu erstellt, bei denen es gegen und doch wieder mehr gegen hier gab doch wieder mehr gegen hier Also das ist kein gutes Zeichen, aber solange es funktioniert, weißt du, kann ich damit umgehen Und hier ist die Sache, obwohl mein Computer nicht eingerichtet ist , weil ich wiederhole, er ist nicht eingerichtet, es ist für alle Modelle gleich, oder? Das ist also ein fairer Vergleich, denn alle Modelle erhielten exakt dieselbe Aufgabe auf demselben Computer. Nun scheint Grog zu glauben, dass es ein Problem beim Erstellen von Dateien gibt und sucht nach Optionen Also entschied es sich für eine einfachere Struktur mit nur den wichtigsten Dateien Also Herabstufung, nicht ideal, aber mal sehen. Nach einer einzigen Aufforderung erhielten wir also unser Ergebnis Okay, schauen wir uns das an. Es ist ein einfaches Design. Es verwendet nicht das Textag, das ursprünglich verwendet werden sollte. Und was das eigentliche Design angeht, nun, es ist das einzige, das es geschafft hat , die richtigen Instagram-Feeds zu implementieren, also ist dies das einzige , das tatsächlich funktioniert Trotzdem fehlen den Produkten die entsprechenden Fotos. Insgesamt gesehen ist es also ein bisschen falsch, wenn ich den Glock-Baum hier sehe . Ich kann nicht sagen, dass es mein Favorit ist, aber es ist nicht schlimmer als 04. Ich mag seinen Charakter, aber auch hier musst du dich selbst entscheiden. Jetzt ein letzter Test. Wechseln wir von Google zu Gemini, auf das die meisten Leute setzen Gleiche Schritte wie zuvor, nichts hat sich geändert. Also lass uns weitermachen und einen Blick darauf werfen. Also heißt es sofort, es wird eine einfache Website ohne Text-Tag erstellt. Nicht großartig. Aber es spricht auf großartige Weise mit uns. Es erklärt, dass es acht Bilder sieht, und es freut sich, dass es ein perfektes Vier-mal-Zwei-Raster erstellen kann. Das ist ein wunderbarer Einblick. Das ist ziemlich interessant. Es bittet uns um nichts. Es läuft weiter. Und es funktioniert ziemlich schnell, sobald es das zeigt. Nach anderthalb Minuten auf den Punkt ist es tatsächlich fertig. Wow. Okay, ziemlich schnell. Und lass uns einen Blick darauf werfen. Okay, ja, das ist solide. Natürlich nichts, worüber man schreien müsste, aber die Aufgabe war ziemlich vage Ich bin also mit dem Ergebnis zufrieden. Der Instagram-Feed ist allerdings nicht echt. Das ist sehr interessant. Es hat also meine Fotos verwendet , um ein gefälschtes zu erstellen, was ein sehr interessanter Ansatz ist. Ich bin mir allerdings nicht sicher, ob ich dem vertraue. Mir wäre lieber gewesen, wenn gesagt worden wäre: Hey, mit irgendwas kann ich das nicht machen. Aber ja, ich habe mir gerade einen ausgedacht. Okay. Die Karte ist nicht so schön wie die von Claude und die Bilder sind ein bisschen bescheiden. Sie sind ziemlich klein und passen nicht gut. Außerdem ist die gesamte Website sehr breit. Okay. Google hat gerade ein neues Modell auf den Markt gebracht, ein neues Gemini-Modell, das jedoch noch nicht verfügbar ist Aber ja, insgesamt ist es das, was das aktuelle Modell ziemlich schnell machen kann Also, was ist insgesamt der Gewinner? Nun, es steht zur Debatte. Du musst es selbst testen. Aber ich kann eindeutig sagen , dass 04 viel zu langsam ist. Und Grock hat eines der wichtigsten Dinge vergessen , die Produktfotos Ich glaube, GPT 4.1 ist der einzige, der tatsächlich den lokalen Server verwendet hat, und ich glaube, er hat den großartigen Textag mit React-VT und Tailwind-CSS verwendet React-VT und Tailwind-CSS Ich würde gerne sagen, dass ich als Nicht-Programmierer, als Person, die nicht technisch versiert ist, das für einen großen Vorteil halte weil ich nicht weiß, nach welchen Dingen ich fragen möchte, Wenn mich das Modell leitet, denke ich, dass das am besten ist, denn auch hier weiß ich nicht, wonach ich fragen soll Also das ist eigentlich ziemlich gut. Außerdem wurde es auf der vorgestellten Seite in den Instagram-Feed integriert , obwohl es das falsche von einer zufälligen Firma war. Aber ja, insgesamt ist das der Test. Es ist kein definitives. Es ist nicht umfassend. Wenn Sie den Modellen bessere Anweisungen geben, wenn Sie Ihr System besser eingerichtet haben, erhalten Sie möglicherweise völlig andere Ergebnisse. Außerdem besteht jedes Mal, wenn Sie es ausführen, eine gute Chance, dass Sie etwas anderes bekommen. Nehmen Sie diese Ergebnisse also nicht als endgültig an. Nein, ich hatte mit meinen Android-Apps große Probleme mit GPT 4.1 . Es hatte vergessen, was ich vor zwei, drei Minuten versucht hatte, und es drehte sich im Kreis. Ich bin dann zu Cloud gewechselt, und es hat von Anfang an sofort funktioniert Es gibt also keine definitiven Antworten. Ich wechsle manchmal während eines Projekts ständig , wenn ich nicht weiterkomme, aber meistens beginne ich mit einem klaren Ziel. Hey, ich werde dieses Projekt mit Model X, mit Claude, mit Gemini, was auch immer bauen Claude, mit Gemini, was auch immer Und das liegt daran, dass, wenn Sie Modell während eines Projekts ändern, dem neuen Modell möglicherweise nicht gefällt, was das vorherige getan hat Ja, das passiert. Ja, das ist eigentlich ziemlich lustig. Kritisieren Sie es. Oh, Mann Hier herrscht Chaos. Ich muss das ganze Zeug reparieren. Ich kümmere mich darum, Mann. Wer auch immer hier gearbeitet hat, hat einen schrecklichen Job gemacht. Wenn man also sieht, wie die KI solche Sachen sagt, ist das eigentlich ziemlich lustig. Aber ja, zum Abschluss hoffe ich, dass Sie jetzt ein gewisses Gefühl dafür haben, wie sich diese Modelle vergleichen lassen . Und jetzt haben Sie eine andere Perspektive, nicht nur das Diagramm , das ich Ihnen gezeigt habe. Übrigens gibt es viele Diagramme. Das ist nur einer von ihnen. Also mein Rat, probiere es selbst aus. Benutze meine Aufforderung. Sie haben es angehängt und sehen, was was ist. Dann teilen Sie mir Ihre Ergebnisse im Kommentarbereich mit. Ich würde gerne von Ihren Erfahrungen hören. Gib mir dein bestes Modell, du bist das schlechteste und du bist das durchschnittliche. Denk dran, hab Spaß damit. Es werden bestimmt Probleme auftauchen. Bleib cool, bleib entspannt und genieße den Prozess. Sie werden Ihre eigenen Favoriten haben. Was zählt, ist, dass Sie Ihr Ziel erreichen, egal was Sie verwenden. Viel Glück. 12. Kosten einfach erklärt – auf einfache Weise: Willkommen zurück. Ich möchte etwas ansprechen , das sehr wichtig ist, und das ist Reichweitenangst, Kreditangst. Und hier ist die Sache. Ihr monatlicher Plan beinhaltet eine bestimmte Anzahl an Credits, ab sofort 500 Credits. Sie zahlen eine bestimmte Summe und können diese Credits verwenden. Im Moment sind es 15 Dollar, also 15 Dollar für 500 Credits. Also, so läuft das. Klicken Sie hier und schauen Sie es sich an. Sie können sehen, die Kosten variieren. Einige von ihnen sind sehr teuer und niemand benutzt sie. Von Zeit zu Zeit gibt es auch Aktionen. Zum Beispiel hat Open AI 4.1 und 04 kostenlos zur Verfügung gestellt, also etwa zehn Tage lang völlig kostenlos. Im Moment sind sie billiger als Cloud. Claude hat derzeit auch zwei Versionen. Es scheint also ziemlich kompliziert zu sein, oder? Und das liegt daran, dass Sie einem Modell manchmal eine Aufforderung, eine Aufgabe geben. Und dann erledigt das Model 20 Dinge nacheinander, richtig, völlig selbständig, und Sie sind nur ein Passagier, und das ist ein Kredit, oder? Es zerlegt eine riesige Aufgabe in kleinere und hakt sie dann Stück für Stück ab. Es funktioniert von alleine. Großartig. Aber andere Modelle sind anders. Sie geben ihm eine Aufforderung und er macht einen einzigen Schritt. Also ein Kredit, aber es ist eigentlich nur ein Schritt. Manchmal sagt es dir sogar, was du tun solltest, was sehr frustrierend ist Aus diesem Grund sind die Kosten relativ. Sie könnten sagen, okay, sagen wir, 4.1 ist super billig, oder? Aber wenn es Amnesie hat und du bei jedem einzelnen Schritt seine Hand halten musst und du ihm vier oder fünf Anweisungen geben musst, während du Claude eine einzige Aufforderung geben musst Nun, machen die Kosten dann wirklich Sinn? Kannst du die beiden wirklich vergleichen? Nein, nicht wirklich. Auf der anderen Seite sind einige Modelle unglaublich teuer, sogar zehnmal so teuer. Bedeutet das, dass sie zehnmal so gut sind? Nein, das ist nicht der Fall. Auch hier denke ich, dass sich die Dinge rasant ändern, und diese Modelle werden immer besser und günstiger werden. Nun, ich möchte, dass Sie Folgendes zur Kenntnis nehmen. Es ist keine große Sache, dass die Credits ausgehen. Du hast diese schöne Runde Nummer 500. Aber wenn Sie sie zum ersten Mal benutzen, sinkt sie auf 499 und dann auf 498 Und nach den wenigen Tagen in diesem Kurs wirst du 450 und dann 390 haben Und dann setzt die Panik ein. Und wenn ich den gesamten Plan aufgebraucht habe, 500 Credits? Was passiert dann? Ich hatte genau den gleichen Gedanken, aber dann wurde mir das Spiel klar. Selbst wenn du alle 500 Credits aufgebraucht hast und noch kein abgeschlossenes Projekt hast, was übrigens fast unmöglich ist , kannst du immer noch mehr kaufen. Und der Preis beträgt momentan zehn Dollar für 250 Credits. Das sind 0,04$ pro Abschlussball, den du nehmen würdest. Also 0,04$, richtig? Auch hier kann Ihnen manchmal ein einziger Kredit große Fortschritte In anderen Fällen mag dies jedoch nicht der Fall sein. Es hängt wirklich davon ab, wie klar Sie mit Ihren Anweisungen umgehen und wie detailliert sie sind . Aber selbst wenn Sie durchschnittliche Ergebnisse haben, richtig, lassen Sie es uns so ausdrücken. Es sind 0,04$, oder? Also zehn Eingabeaufforderungen, zehn Aufgaben, werden Sie 0,40$ kosten 100 bedeuten vier Dollar. Und ich schätze, dass Sie am Anfang weniger als 50 pro Tag ausgeben werden, vor allem, wenn Sie einige der billigeren Modelle verwenden , die sich im Werbemodus befinden. Nun, hier macht es endlich Klick und für mich hat es sehr viel Sinn gemacht. Unser Ziel ist es, Websites zu erstellen und dann Geld zu verdienen, oder? Baue Projekte, die uns als Freelancer einstellen, uns einen festen Arbeitsplatz verschaffen und ein Unternehmen gründen Das ist das Ziel, oder? Okay, wenn du einen Programmierer einstellen willst, glaub mir, du würdest nicht zwei, drei, vier Dollar pro Tag zahlen drei, vier Dollar pro Tag Nein. Ich spreche von einem durchschnittlichen Programmierer, oder? Aber hier haben Sie Zugang zu einigen der besten Programmierer der Welt für ein paar Cent, buchstäblich Nun, eine durchschnittliche Landingpage sollte Sie zwischen 2030 und vielleicht höchstens 100 Eingabeaufforderungen weiterleiten In unserem Beispiel verwenden wir weniger als fünf, oder? Aber selbst wenn Sie 50 verwenden, oder? Glaub mir, das ist nichts im Großen und Ganzen. Wenn Sie diese Website für was auch immer verkaufen, nennen wir es 500 Dollar im unteren Preissegment, oder? Spielt es wirklich eine Rolle , dass Sie zwei Dollar dafür ausgegeben haben , nein, natürlich nicht. Also diese Reichweitenangst , dass Ihnen die Credits ausgehen könnten, ist eigentlich nicht rational. Die meisten Programmierer verlangen auf freiberuflichen Plattformen 25-100 Dollar pro Stunde Winsurf ist billiger, schneller, besser und es Sie werden nicht Hunderte von Credits pro Tag verwenden, besonders nicht in den ersten Monaten Denken Sie jetzt an eine andere Sache. Anfangs weißt du nicht, was du tust, oder? Es ist in Ordnung. Möglicherweise verbrennen Sie einige Credits. Die ersten 20 oder 30. Das ist völlig in Ordnung. Das ist normal. So lernt man, oder? je besser du darin wirst, desto klüger wirst du deine Credits einsetzen Aber vorerst sollten Sie sich etwas gönnen. Benutze sie. Mach dir keine Sorgen um sie. Dies ist eine Investition in Ihre Zukunft. Sie kaufen einen Kurs, Sie kaufen mehrere Abonnements, aber die Gesamtkosten sind nichts im Vergleich zu den Vorteilen. Ich habe echte Unternehmen im Lebensmittelsektor aufgebaut. Ich habe Unternehmen in der Technologiebranche aufgebaut. Ich hatte Teams mit Dutzenden von Leuten. Die Kosten sind immens. Miete, Nebenkosten, Gehälter, teure Ausrüstung, das funktioniert auf der anderen Seite, wenn man ein paar Pfennige beim Windsurfen bezahlt Das ist im Moment kein besseres Angebot als Vibe-Coding. Mit ein paar Dollar kann man so viel erreichen. Um es zum Abschluss zu bringen: Schützen Sie nicht Ihre Kredite. Kümmere dich nicht um sie. Es ist eine Investition in deine Ausbildung. Benutze sie. Okay, lass uns weitermachen. 13. Die versteckten Gefahren der Vibe-Codierung und des vollständigen KI-Zugriffs: Willkommen zurück. Lass uns über etwas reden , das nicht sehr lustig ist, aber es ist extrem wichtig für Sicherheit. Was passiert konkret, wenn wir Vibe-Code schreiben? Weißt du, wenn wir in der Zone sind und uns alle darauf freuen, unsere neuen KI-Agenten auszuprobieren, installieren wir vielleicht eine Menge Dinge links und rechts, ohne darüber nachzudenken, oder Aber hier ist das Problem. Jedes Mal Sie ein Skript ausführen, das Sie auf diesem Kabel gefunden haben, es lesen oder an einer anderen Stelle lesen, jedes Mal, wenn Sie einem Agenten, einem Model, einer Firma vollen Zugriff gewähren , übergeben Sie die Schlüssel zu Ihrem Computer Und lassen Sie mich erklären, was das bedeutet. Stellen Sie sich vor, Ihr Computer ist Ihre Wohnung, oder? Und drinnen hast du private Sachen. Ihr Bank-Login, Ihre Geschäftspläne, Sie haben kreative Dateien, Kryptogeld, Kreditkarten, private Fotos, Ihren Reisepass, Personalausweis, alles Mögliche. Stellen Sie sich das jetzt vor. Du gehst zum Mittagessen aus und lässt deine Wohnungstür weit offen. Schlimmer noch, du klebst deinen Schlüssel an die Vordertür, damit ihn jeder nehmen kann, oder? Nun, genau das passiert, wenn wir jemanden oder etwas unseren Computer ohne Frage steuern lassen. Das passiert häufig bei der Vibe-Codierung, weil die KI diese Probleme manchmal nicht berücksichtigt Manchmal werden Passwörter, alle Passwörter aus Projekten, in einer Textdatei namens Passwörter gespeichert alle Passwörter aus Projekten, in einer Textdatei namens Passwörter Ich übertreibe nicht. Nun, ich bin ein bisschen, aber nicht viel. Die Bösewichte wissen das Zeug. Diese Modelle denken nicht an Sicherheit, es sei denn, Sie sagen es ihnen. Und wenn Sie ein Programm mit Ihrem Computer machen lassen , was es will, ist es wieder so, als ob Sie sagen würden: Hey, schauen Sie sich ruhig in meinem Haus um und nehmen Sie, was Sie wollen. Nun, hier ist die Sache. Wir wollten Python nicht selbst installieren. Wir wollten die Installation nicht reparieren wenn sie nicht funktionierte, oder? Wir wollten uns nicht über vier Räume informieren, Support-Tickets schicken und die Leute bitten, uns zu helfen, oder? Das wollten wir nicht tun. Wir würden es viel vorziehen , wenn die KI es einfach repariert, es alleine macht. Aber so muss es sein, auch wenn es frustrierend ist Ich weiß, dass wir alle einen persönlichen Roboter wollen dass wir alle einen persönlichen Roboter Dinge automatisch und perfekt erledigt, einen GPT-Klon, so einen GPT-Klon, Vielleicht tippt er für dich, vielleicht installiert er Programme Es klingt so cool, oder? Aber hier ist die Sache. volle Kontrolle zu geben KI die volle Kontrolle zu geben ist nicht so, als würde man einen persönlichen Assistenten einstellen. Nein, es ist, als würde man einem Fremden deine Kreditkarte geben , du hast Hausschlüssel, deinen Reisepass und sagst: Hey, tu, was immer du für das Beste hältst. Hier ist die Sache. Wir sind noch nicht da. Und obwohl diese Technologie beeindruckend ist, ist die Technologie fantastisch. Der Sicherheitsteil ist immer noch sehr fragil. Also ja, ich bin voll und ganz für KI. Ich liebe es, es zu benutzen, um meine Arbeit zu beschleunigen. Mir geht es gut, etwas Kontrolle abzugeben, aber ich werde die Kontrolle nicht an irgendeine Art von MCP, irgendeinen Agenten oder was auch immer geben, oder? Ein bisschen mehr Arbeit für meine Hände. Klar, das ist völlig in Ordnung. Tools manuell installieren, Berechtigungen überprüfen, ein paar Anweisungen lesen, das ist nicht das Ende der Welt. Sicher, es dauert länger, aber es kann Ihnen auch die Kontrolle geben. Und wenn es darum geht, ein seriöses Projekt zu starten , sei es eine App, eine Website oder ein Startup, was auch immer, sollte Sicherheit niemals eine Nebensache sein. Wir werden später mehr darüber sprechen. Aber vorerst wollte ich dir sagen, dass wir ein bisschen selbst arbeiten werden, aber ich wollte dir all diese Dinge erzählen weil ich denke, dass es ziemlich wichtig ist. Alles, was wir installiert haben ist erstklassig. Es ist offizielles Zeug. Es sind sehr bekannte Programme. Aber Sie werden im Internet andere Dinge finden , die sozusagen nicht offiziell sind. Sie werden Software von wer weiß wem in einem anderen Teil der Welt finden , die behauptet , Ihren Computer automatisch bedienen zu können. Okay, wer ist diese Person? Was sind diese Entwickler? Wer ist diese Firma? Du kannst dir keine Schlüssel mit einem Lohn wie dem geben. Also nochmal, alles, was wir bisher installiert haben und alles , was wir tun , wird erneut überprüft Es ist sicher und Sie sollten keinerlei Probleme haben Aber tappen Sie nicht in die Falle, dass Sie etwas auf TikTok sehen und, hey, schauen Sie, mein Computer funktioniert automatisch. Installiere das noch nicht. Benutze etwas, das sehr bekannt ist. Verwenden Sie bewährte Methoden. Okay, lass uns weitermachen. 14. 80 % bis 20 %: Willkommen zurück. Lass mich das klarstellen. werden Sie nicht auf eigene Faust 1.000.000.000$ verdienen Mit Vibe-Coding werden Sie nicht auf eigene Faust 1.000.000.000$ verdienen, aber Sie können Produkte, Websites und Apps auf den Markt bringen, die ein großes Eines der Hauptprobleme besteht darin, die letzten zehn bis 20% zu bekommen , die Und der letzte Teil kann unglaublich viel Zeit in Anspruch nehmen. Und viel Frust. Also lass uns das machen. Im Anhang haben Sie diesen Ordner. Es ist eine unserer früheren Websites. Und da ist diese Produktkarte, die anständig aussieht, aber vielleicht wollen wir, dass sie ein bisschen besser aussieht, oder? Das ist also das Ziel. Lass das besser aussehen. Nun, das ist die Art von Dingen, die beim Windsurfen entweder sehr gut oder sehr schief gehen können Windsurfen entweder sehr gut oder sehr schief Also lasst uns das Glück testen. Bitte gehen Sie im Hauptmenü zur Datei und öffnen Sie dann diesen Ordner. Sie haben ein Archiv angehängt , das Sie zuerst entpacken müssen. Okay, jetzt, hier ist die Sache. Wir werden vorerst Cloud 3.7 verwenden, aber Sie werden mit den meisten Modellen, auch neueren, eine ähnliche Erfahrung machen. Jetzt möchten Sie vielleicht diese Website öffnen, damit Sie sehen können, wie meine bestehende Karte aussieht, und ich möchte sie als Referenz verwenden, oder? So etwas würde mich glücklich machen. Okay, jetzt könnten wir möglicherweise alle Änderungen schreiben, die wir wollen, und das würde uns einige Credits sparen. Aber ich werde es Schritt für Schritt machen. Dies führt in der Regel zu besseren Ergebnissen. Nehmen wir für die Bewertungen auf den Produktkarten an, addieren Sie die Produktbewertung mit zwei Ziffern. Machen Sie das Ergebnis fett. Okay, wir gehen zu den Rennen. Es erfordert eine ziemliche Analyse, aber das ist typisch, wenn Sie ein Projekt importieren. wird den gesamten Code durchsehen Es wird den gesamten Code durchsehen und versuchen zu verstehen, was los ist. Okay, schnell vorwärts. Und okay, es ist erledigt. Und genau das meine ich. Das ist mein einziger Punkt. Das sieht nicht nach dem aus, was ich auf meiner Live-Website habe. Sieht es jetzt schrecklich aus? Nein, natürlich nicht, aber ich will es nicht. Und wenn Sie ein Perfektionist sind, können Sie solche Dinge verrückt Wenn Sie möchten, dass die Dinge auf eine ganz bestimmte Art und Weise sind, kann dies eine Menge Proms und eine Menge Mühe kosten Okay, lass uns weitermachen. Lass uns das schreiben. Fügen Sie einen Text mit Details anzeigen hinzu, der orange und fett formatiert ist , ohne Hintergrund, und fügen Sie eine Schaltfläche „Zur Karte hinzufügen “ hinzu, die einen orangefarbenen Hintergrund und weißen Text hat Diese beiden Schaltflächen sollten sich nebeneinander unter der Bewertung Okay. Nun, das ist eine Frage. Könntest du es besser beschreiben? Das ist eine weitere Diskussion. Aber ja, du hast eine Idee im Kopf. In diesem Fall haben wir den Vorteil , die Live-Version tatsächlich sehen. Aber ja, du musst einfach dein Bestes geben und beschreiben, was du willst. Und lass uns sehen, wie das läuft. Okay, nach einer Weile ist es vorbei. Denken Sie daran, immer auf Alle Änderungen akzeptieren zu klicken. Jetzt können wir es aktualisieren. Ja. Nochmal, es ist ziemlich gut. Ist es genau das, was ich will? Nein, nicht wirklich. Das ist die ganze Sache, die du erkennen musst. Klar, das ist eine Frage zur Qualität meiner Anweisungen oder meiner Aufforderung. Ich könnte viel detaillierter beschreiben, was ich will , oder? Geben Sie vielleicht ein Bild als Referenz an, zeigen Sie ihm vielleicht ein Design, das ich für Figma entworfen Sicher. Das könnte möglicherweise funktionieren. Und ich bin nicht gegen mehr Arbeit, aber das versuche ich nicht zu sagen. Ich versuche zu sagen , dass Sie auf diese Arbeitsbelastung vorbereitet sein sollten . kriegt man 80 bis 90% hin, Da kriegt man 80 bis 90% hin, aber der Rest ist echt knifflig. Lassen Sie mich eine letzte Aufforderung versuchen. Verschieben Sie das Gewicht des Produkts die rechte Seite des Preises, richten Sie das Gewicht an der Schaltfläche „Zur Karte hinzufügen“ aus, machen Sie die Schaltfläche „ Zur Karte hinzufügen “ vollständig abgerundet, ändern Sie das Gewicht von „ Details anzeigen“ von fett auf normal. Wie Sie sehen können, stapele ich Anleitungen, richtig? Ein einziger Kredit, aber ich versuche, mehrere Dinge zu reparieren. Sie können das natürlich tun, lassen Sie uns sehen, wie das läuft. Übrigens, Sie könnten zwar 100% einen Shop mit Winserf erstellen, aber ich denke, ich würde immer noch WooCommers auf WordPress-Basis verwenden, aber vielleicht ShopII für ein solches Projekt, einfach weil sie Natürlich, wenn es nur ein einfacher Shop mit nur einem oder zwei Produkten ist, etwas ziemlich Kleines, kannst du genauso gut in WinSerf arbeiten, WinSerf Die einzige Ausnahme wäre ein sehr einfacher Shop, der auf sehr wenigen Produkten basiert Aber ja, wenn ich zurückkomme, das ist wieder anständig. Aber das ist nicht gerade das, was ich will. Wir könnten zehn, 15, 20 weitere Credits ausgeben , oder wir könnten verschiedene Ansätze ausprobieren , um dem, was ich will, näher zu kommen, aber ich würde es viel lieber damit beenden. Sei glücklich damit. Das wird Ihr Projekt weder zum Erfolg noch zum Scheitern bringen. Sei kein Perfektionist. Starte das Projekt so schnell wie möglich, sieh, wie es läuft, finde heraus, was die Leute darüber sagen, und feile es dann Danach solltest du es wieder polieren. Es ist so einfach, sich auf diese Details zu fixieren, aber ich verspreche Ihnen, dass Sie auf lange Sicht einfach den Kürzeren Und ich spreche aus Erfahrung , weil ich auch ein Perfektionist bin Es ist schwer, aber wir müssen es akzeptieren. Starten Sie es und polieren Sie es dann. Und damit machen wir weiter. 15. Von Figma zum Windsurfen?: Willkommen zurück. Der Traum, in wenigen Sekunden ein in Figma hergestelltes Design zu programmieren, ist noch nicht da Zumindest nicht das Windsurfen. Wir haben ein Figma MCP, über das Sie Windsurf-Zugriff auf Ihre Designs gewähren können . Hört sich großartig an Sie müssen ein Token einrichten und haben Figma-Einstellungen. Es ist nicht zu kompliziert, aber du musst ein bisschen Geduld Bitte arbeiten Sie übrigens nicht mit. Nun, hier ist die Sache. Es klingt großartig. Die KI kann jetzt alle unsere Designentscheidungen analysieren und pixelgenau umsetzen. Schließlich haben wir damit zu kämpfen, oder? letzten zehn oder 20%, die Details, aber es funktioniert nicht. Zum Zeitpunkt der Aufnahme macht es wirklich einen furchtbaren Job, egal welches Modell man benutzt. Ich habe es mit Claude, mit Gemini, mit GPT versucht , und die Ergebnisse reichen von schlecht bis hin zu Unfähigkeit, die Aufgabe zu beenden, und ich meine wirklich Der Ablauf ist einfach. Du entwirfst eine schöne Seite in Figma, oder? Du wählst den gesamten Rahmen aus. Dann kopieren Sie diese bestimmte Seite, indem Sie mit der rechten Maustaste klicken und Link zur Auswahl kopieren wählen. Okay. Dann können Sie ein neues Projekt und ein neues Fenster starten, wie immer einen Ordner erstellen und dann dem Modell Ihrer Wahl mitteilen, dass es dieses Design mithilfe von CSS, HTML und JavaScript implementieren soll . Also sehr einfaches Zeug, um die Dinge nicht zu komplizieren, oder? Dann fügst du den Link hinzu. So einfach sollte das sein. Aber aus welchem Grund auch immer, es funktioniert nicht. Auch hier ist es so schlimm, dass es nicht einmal lohnt, es zu zeigen. Es ist einfach schrecklich. Es funktioniert nicht. Nun, hier ist die Sache. Wenn sich die Dinge ändern und Windsurfen, werde ich es dich wissen lassen Aber im Moment glaube ich nicht, dass das gut angelegte Credits sind Auf der anderen Seite kann ich meine Webdesign-Kurse nur empfehlen. Und das liegt nicht daran, dass Sie lernen sollten, wie man Figma benutzt, sondern daran, dass die Designprinzipien den Unterschied ausmachen, Dinge wie Kontrast Damit die Leute sehen, worauf es wirklich ankommt, Hierarchie, um das Auge zu lenken, große Titel, klare Knöpfe, viel Platz Mehr ist offensichtlich besser. Bündeln Sie die Dinge nicht zusammen. Symmetrie, Ausrichtung, halte es sauber, halte es sauber. Typografie, nicht nur schöne Schriften, sondern auch angemessene Größen, Gewichte und Das sind die Prinzipien, die ich unterrichte. Und wie Sie gerade herausfinden, helfen uns diese Codierungsplattformen bei all dem komplizierten Code. Wenn Sie jedoch ein ausgefeiltes Design wünschen, müssen Sie diese Prinzipien kennen damit Sie das Modell leiten können. Man muss wissen, wonach man fragen muss. Dinge wie den Abstand auf der Karte erhöhen oder diesen Text H zwei und dann diesen Text H drei, was auch immer, verwenden diesen Farbcode oder wie einige Schaltflächen gefüllt werden müssen während andere aus reinem Text bestehen sollten Das sind die Dinge, die ich Ihnen in meinen Designkursen beibringe, und ich verspreche, dass dies keine Werbung ist . Das ist es , was du brauchst. Bringen Sie Ihre Designs die nächste Ebene, um Ihre Anweisungen und Eingabeaufforderungen zu verbessern und bessere Ergebnisse zu Es ist das, was Sie benötigen, um Ihre Ideen besser zu beschreiben. Und vor diesem Hintergrund funktionieren Figma und Windsurfen nicht, also lass uns weitermachen 16. Übersicht: Willkommen zurück. Bisher haben wir gelernt, dass Vibe-Coding das Webdesign in Bezug auf die klassische Arbeitsweise im Grunde genommen getötet hat Wireframes, High-Fidelity-Designs und Figma, das die Datei für die Codierung vorbereitet, und dann kommt endlich ein Code rein und implementiert das Projekt tatsächlich in implementiert das Projekt tatsächlich Jetzt würde dieser gesamte Ablauf von einigen Tagen bis zu einigen Monaten dauern , und das ist nicht mehr der Fall Und es tut mir wirklich weh, das zu sagen, weil ich in diesem Bereich seit vielen, vielen Jahren aktiv bin. Aber hier ist die Sache. Als Designer habe ich ziemlich viel Erfahrung darin , Ideen aus meinem Kopf auf eine leere Seite zu übertragen. Normalerweise weiß ich, was ich will. Ich weiß, was gut aussieht und was Kunden normalerweise wollen. Ich werde okay sein. Ich fühle mich mit dieser KI-Welle nicht hundertprozentig wohl, aber weil ich dabei bin, lerne ich, ich wachse. Ich denke, es gibt tatsächlich mehr Möglichkeiten als zuvor. Ich glaube, ich reite auf dieser Welle, und das, obwohl ich viele Projekte verlieren werde . Ich denke, ich werde mit Vibe-Coding großen Erfolg haben. Worüber ich mir eigentlich Sorgen mache, ist, wie meine Freunde, die sich für Coding interessieren, anpassen werden Sehen Sie, zumindest in meinem Land stellt niemand mehr Entwickler ein. Die einzigen Stellen, die verfügbar sind, sind für Super-Führungspositionen und andere Positionen, bei denen jemand normalerweise, sagen wir, 3.000$ pro Monat bekommen würde , jetzt werden nur noch 2.000$ angeboten Das ist ein großer Wandel, weil die meisten Unternehmen nicht so schnell anpassen können Sie sehen, wie milliardenschwere Unternehmen sich auf KI konzentrieren, zum Beispiel Doppeljargon, okay? Aber die meisten Unternehmen können das nicht wirklich tun. Ohne viel Geld, ohne viele erfahrene Entwickler Mitarbeitern, die KI genau übersehen, werden Dinge zwangsläufig schief gehen, und die meisten Unternehmen können sich das nicht leisten, können es sich nicht leisten, etwas mit KI durcheinander zu bringen Ihr Ruf ist alles, oder? Das bedeutet also, dass die meisten Unternehmen im Grunde feststecken. Sie können nicht wirklich Leute auf die klassische Art von Entwicklern einstellen die klassische Art von Entwicklern , weil das veraltet zu sein scheint. Investoren, Aktionäre aller Art, Banken könnten sie ansehen, als würden sie Faxgeräte kaufen. Nun, das wäre natürlich sinnvoll, aber auf der anderen Seite können sie auch nicht wirklich auf KI umsteigen, weil sie wiederum zu empfindlich ist. Es ist früh und Fehler sind unvermeidlich. Das bedeutet also, dass der Arbeitsmarkt für Entwickler grundsätzlich pausiert, zumindest in meinem Teil der Welt. Und deswegen mache ich mir auch Sorgen um Designer, ich denke, sie können umdenken. Sie sind in der Regel einfallsreich und agil. Ich hoffe, dass Entwickler dasselbe tun können. Aber ja, insgesamt sehe ich die Dinge so. Manche Gelegenheiten gehen verloren, aber die neuen sind weitaus interessanter. Insgesamt denke ich also, dass es uns gut gehen wird. Und damit wollen wir weitermachen. 17. Von der Idee über Windsurfen über Vercel bis hin zur Live-Website: Willkommen zurück. Lassen Sie mich erklären , wie Sie eine Live-Website mit in sehr kurzer Zeit eine Live-Website mit Ihrem eigenen Domainnamen erstellen. Wir beginnen also mit einem völlig leeren Projekt und Windsurfen. Erstellen Sie eine funktionierende Version dieser Website, die lokal auf unserem eigenen Computer läuft, mehr nicht. Wenn wir damit zufrieden sind, senden wir es die Cloud, zu Github, ins Internet. Du kannst dir GitHub wie Drawbox oder Google Drive vorstellen. Es ist ein Ort im Internet, an dem Sie Ihre Dateien speichern. Das heißt, Sie haben von jedem Gerät aus Zugriff auf sie, und wenn Sie möchten, können Sie sie mit allen teilen. Es ist ziemlich einfach zu machen. Sobald die Website auf Github ist, senden wir sie an Versell, eine Plattform, die uns helfen wird , sie zu veröffentlichen, damit jeder sie sehen kann Kurz gesagt, Versell ersetzt ein Hosting-Unternehmen. Das ist die Essenz davon. Hier ist die Sache. Nachdem du die Website von Github nach Versell importiert hast, wird sie ziemlich gut laufen, aber du wirst einen hässlichen Link haben, ungefähr so, oder? Aber insgesamt ist es immer noch für alle verfügbar. Sie können es also mit Freunden und Familie teilen, Sie können es Ihrem Kunden zeigen, damit es funktioniert. Aber wenn Sie zum nächsten Schritt übergehen möchten, können Sie direkt in Versell einen Domainnamen kaufen, ein paar Minuten warten, vielleicht ein paar Stunden, und dann haben Sie Ihre eigene Adresse wie cresbarn.com Das war schon vergeben, also habe ich Cresbarndt FYI gekauft Sobald das alles eingerichtet ist und funktioniert, können Sie natürlich zu Winserf zurückkehren und weitere Verbesserungen vornehmen. Das Tolle daran ist, dass Sie Winserf anweisen können , Github zu aktualisieren, und das wird automatisch erledigt Und dann wird Versells auch automatisch funktionieren. Also eigentlich ist es ziemlich einfach. Der schwierige Teil bestand darin zu Beginn des Kurses alles einzurichten. Jetzt ist es eine Methode , die Bewegungen durchzugehen und zu debuggen und kleine Probleme zu beheben, die auftauchen werden Für diese Probleme brauchen wir vielleicht fünf, sechs, zehn Eingabeaufforderungen, vielleicht zehn, 15, 20 Minuten, oder Sie haben vielleicht Vielleicht benötigen Sie 20 Eingabeaufforderungen, vielleicht ein paar Stunden. Aber auf jeden Fall wirst du es schaffen. Das werden wir in diesem Teil des Kurses tun . Um es noch einmal zusammenzufassen: Wir beginnen mit einer guten Aufforderung, etwas mit einer ordentlichen Menge an Details, und dann fangen wir an, in Windsorf zu bauen Wenn wir fertig sind, werden wir auf Github veröffentlichen. Dann nach Versell. Also wird es live sein und mit allen geteilt werden können. Optionaler Schritt ganz am Ende, wir können unseren eigenen Domainnamen kaufen Aber auch das ist optional. Eine schnelle Sache. Warum haben wir uns für Superbse angemeldet oder erneut gesendet? Nun, erneutes Senden wird in diesem Projekt nützlich sein , weil wir ein Kontaktformular haben werden, und dafür ist ein erneutes Senden erforderlich Wenn jemand das Kontaktformular auf der Website verwendet, möchten wir, dass der Kunde diese Nachricht erhält, oder? Dafür ist das erneute Senden also da. SupaBase eignet sich hervorragend, um Benutzern die Möglichkeit zu geben , ein Konto zu registrieren Es wird sich um all die komplizierten Datenbankkram kümmern, und durch die Art und Weise, wie wir alles einrichten, wird es das automatisch erledigen Supbase ist für später. Im Moment werden wir eine solide Website von Anfang bis Ende fertigstellen, und dann können wir mehr über komplizierte Dinge wie Datenbanken, Zahlungen, Registrierung und so weiter chatten über komplizierte Dinge wie Datenbanken, Zahlungen, Registrierung und Lassen Sie uns vorerst an die Arbeit gehen. Lassen Sie uns unsere erste Website veröffentlichen. 18. Lassen Sie uns die Eingabeaufforderung verstehen: Willkommen zurück. Hier ist die Aufforderung , die wir beide verwenden werden. Sie haben es angehängt. Und was das Detail angeht, würde ich sagen, es sind sechs von zehn. Wenn Sie diese natürlich klingende Aufforderung nehmen und versuchen, sie zum Beispiel im Chat GBT zu verbessern , erhalten Sie eine Aufforderung, die viel detaillierter als technisch ist Normalerweise hilft das, aber eine komplizierte Aufforderung wäre etwas überwältigend, also habe ich beschlossen, mich an etwas zu halten, das natürlich klingt Wir gehen, dann rennen wir Schritt für Schritt, richtig? Nun, eines der Probleme ist das, einfach ausgedrückt, ich sage blau, rechts, blau und weiß. Das ist das Farbschema. In der Regel sollten Sie jedoch Farbcodes angeben. Blau kann absolut alles bedeuten von einem superhellen Babyblau bis hin zu einem dunklen, intensiven Marineblau. Behalte das also im Hinterkopf. Je mehr Details Sie angeben, desto besser ist das Ergebnis. Ich möchte Sie daran erinnern, dass , selbst wenn Sie alles perfekt machen meine, selbst wenn Sie alles perfekt machen, auch wenn Sie meine Aufforderung kopieren und einfügen Ihre Website anders aussehen wird als meine, selbst wenn Sie alles perfekt machen, auch wenn Sie meine Aufforderung kopieren und einfügen. Und genau so funktionieren diese Modelle. Und noch etwas, es ist sehr wahrscheinlich, dass Sie andere Probleme haben werden als die, die ich haben werde. Und das ist völlig normal. Auch hier habe ich keine Glaskugel, aber ich arbeite schon lange in Windsor, also weiß ich, dass das unvermeidlich ist Okay, also richte einen neuen Ordner ein und das neue Projekt in Windsurf die Grundlagen Bitte stellen Sie sicher, dass Sie alle Einstellungen aus dem ersten Teil des Kurses abgeschlossen haben alle Einstellungen aus dem ersten Teil des Kurses abgeschlossen GitHub, Python, kein JS, The Works, Power Shell, Docker usw. Apropos Technik: Ich habe in der Eingabeaufforderung ein paar Dinge geschrieben, Next JS und Tailwind verwendet, das Formular erneut gesendet und dann GitHub und Versell Ich habe diese Dinge also klar erwähnt, und hier ist der Grund dafür. Also, wenn du anfängst, schreibst du eine einfache Aufforderung und machst mir eine Website, richtig? Und Sie sehen, wie bestimmte Modelle, zumindest die intelligenteren, mit Ihnen sprechen. Wir haben bereits gesehen, dass sich einige für einfaches HTML, CSS und JavaScript entschieden haben, während andere, intelligentere, genau das empfahlen, was ich hier geschrieben habe. Also hier ist die Sache. Wenn ein Modell dieses Textag bevorzugt , notieren Sie es sich Und schlagen Sie es dann beim nächsten Mal vor. Und genau das habe ich getan. Ich habe mit einigen Programmierern gesprochen, älteren, und sie gefragt, warum Rückenwind? Warum nicht das? Warum nicht das? Warum reagieren? Warum nicht das? Warum nicht das? Kurz gesagt, diese Programmierer haben mir Folgendes erzählt. Jeder hat seine eigenen Vorlieben. Also wie BMW Pepsi und Android, andere Leute wie Mercedes, Doktor Pepper und IOS. Wer hat recht? Natürlich niemand. Es ist das, was du bevorzugst. Es ist das Gleiche hier. Also, wenn dieses Modell es vorzieht, diese spezifischen Text-Tags zu verwenden, okay, lassen Sie uns das machen. Als Nächstes zu der Aufforderung habe ich nach einem PRD gefragt, einem Dokument mit Produktanforderungen Auf diese Weise kann uns das Modell klar sagen, was passieren wird Das PRD klingt schick, aber es ist sozusagen eine Checkliste, wenn Sie so wollen , damit Sie wissen, wo Sie sich also die PRD. Das tut nicht weh, also hab es immer dabei Als Nächstes wollte ich Bilder hinzufügen. Wir könnten zwar ein MCP verwenden, um einige automatisch herunterzuladen. Ich habe das tatsächlich auf Splash.com gemacht. Ich habe ein paar Fotos ausgewählt, die für einen Zahnarzt geeignet wären. Denken Sie übrigens daran, es ist ein Filter. Einige Fotos sind kostenlos, andere kostenpflichtig Verwenden Sie daher unbedingt den Filter. Okay. Und dann wechsle ich zu Leuten, um ein paar Fotos für alle Bewertungen zu bekommen. Nachdem Sie Ihr Projekt auf Ihrem Laufwerk eingerichtet haben, sollten Sie die Adresse kopieren und hier in der Eingabeaufforderung einfügen. Das ist also etwas, was du tun musst. Du musst es ersetzen. Das ist der erste hier, und hier ist der zweite, was ich getan habe, war, einen Ordner in den Hauptordner zu legen. Nur um das klarzustellen, Sie laden Fotos von Osplash herunter. Sie legen sie irgendwo in den Ordner. Ich habe das TMG angerufen und es hier auf meinen Desktop gestellt Als Nächstes müssen wir diesen Ordner vom Desktop dorthin verschieben , wo das Projekt in WinSerf eingerichtet ist In meinem Fall ist das Projekt in Winserf in D Dentist eingerichtet Dort müssen wir also diesen Ordner einfügen. Um nun eine Adresse von einem beliebigen Ort zu erhalten, verwenden Sie diesen Bereich. In meinem Fall ist es D Dentist IMG. Kopieren Sie es also mit Control C, wechseln Sie dann zur Prom-Datei und fügen Sie sie ein. Hier ist es schon eingestellt, aber ich werde es darunter einfügen , damit du es sehen kannst, damit es funktioniert. So bekommst du die Adresse. Und denken Sie daran, in Winserf haben wir einen Zahnarzt eröffnet. Deshalb fügen wir die Fotos dort hinzu. Deshalb lassen wir sie nicht auf dem Desktop. Und für die Bewertungen gilt dasselbe. Gehen Sie in den Ordner und klicken Sie hier, um den Pfad zu sehen. Kopieren Sie es und fügen Sie es dann in die Textdatei ein. Okay, lass uns weitermachen. Okay, der Rest der Eingabeaufforderung besteht nur aus grundlegenden Informationen. Die einzige wichtige Sache , nach der ich frage ist ein Formular zur Terminvereinbarung, aber es hat keine erweiterten Funktionen. Deshalb habe ich kein Drop-down-Menü für die Dienste hinzugefügt, die der Kunde möglicherweise wünscht. Ich habe nicht die Stunde berücksichtigt , zu der wir den Terminplan des Arztes haben müssten Terminplan des Arztes haben , wenn er beschäftigt ist und wann er verfügbar ist. Also habe ich mich für die absolut einfachste Version entschieden, ein einfaches Kontaktformular. Außerdem habe ich die Telefonnummer hinzugefügt damit sie auf diese Weise Anrufe entgegennehmen können. Die Idee ist, du könntest diese Website verkaufen. Solange sie jemanden haben ihre Telefone und E-Mails beantwortet, funktioniert ein einfaches Kontaktformular. Das verspreche ich dir. Jetzt kann das Kabinett den Kunden zurückrufen und nach weiteren Informationen fragen und einen Termin vereinbaren. Also wiederhole ich, obwohl dies die grundlegende, einfachste Form, die einfachste Version ist, können Sie es trotzdem verkaufen. Aber natürlich können Sie auch weitere Features und Funktionen hinzufügen. Sie können dies als Grundlage verwenden und es dann wahrscheinlich anpassen, es an Tierärzte, Restaurants, Anwälte verkaufen , alles, was Ihnen einfällt Auch diese Landingpage ist vielseitig und Sie können dafür sorgen, dass sie funktioniert. Lass uns zur Sache kommen. 19. Starten Sie das Projekt: Komm zurück. Für dieses Projekt werde ich dieses Modell verwenden weil mir seine Persönlichkeit sehr gut gefällt. Wenn ein viel neueres Modell nicht verfügbar ist, verwenden Sie bitte dasselbe. Egal was passiert, Sie werden auf Probleme stoßen, die bei mir möglicherweise nicht auftauchen. Seien Sie also bitte geduldig und bitten Sie um Hilfe. Okay, lass uns anfangen. Auf geht's zu den Rennen. Es ist faszinierend zu sehen, wie das Model denkt und wie oft es Fehler macht. Es versucht zum Beispiel, eine Checkliste zu erstellen, aber es hat nicht zuerst den Ordner erstellt, was ziemlich albern ist, aber das ist das Schlimmste, was es je sein wird. Behalte das im Hinterkopf In ein paar Monaten wird sich das durchsetzen, und dieses Modell wird wie Windows 95 aussehen , wenn Sie so alt sind. Okay, wir haben das PRD, und das ist eigentlich ziemlich detailliert Ich kann den technischen Anforderungen entnehmen , dass es richtig verstanden hat, was ich verwenden wollte Also als nächstes JS, Rückenwind und so weiter. Auch hier bin ich kein Entwickler, aber wenn dieses Modell gerne mit diesen Technologien arbeitet , klar, warum nicht? Okay, ich habe sie mir angesehen. Sie sind modern und haben viele Vorteile gegenüber der einfachen CSS - und HTML-Website. Also ja, insgesamt alles gut. Okay, wir haben einen ersten Befehl für das Terminal. Eventuell könntest du Windsurf so einrichten, dass sie alle von alleine laufen Aber ich überprüfe sie gerne und akzeptiere sie einzeln, eins nach dem anderen. Es ist eine gute Art zu lernen. Eine Sache. Wenn du hier gelb siehst, heißt das, dass du warten solltest. Aber bis jetzt habe ich unzählige Fälle gesehen, habe ich unzählige Fälle gesehen in denen das Terminal einfach gestoppt wurde. Und weißt du, wir warten einfach ab. Eigentlich passiert nichts. Okay, das Modell läuft, aber im Terminal passiert nichts. Es installiert nichts, es bewegt nichts. Es steckt fest. In diesen Fällen, in denen ich einfach nicht weiterkomme, mache ich gerne Folgendes Ich gebe einen einzigen Buchstaben in das Terminal ein und drücke Enter. Normalerweise verwende ich Z. Nun, das ist offensichtlich kein korrekter Befehl, aber er scheint das Modell aufzuwecken. Wenn Sie jetzt die Farbe überprüfen, ist sie grün, was bedeutet, dass es fertig ist, und jetzt kann es weitergehen. Das geht also, ohne das Modell zu stoppen und neu zu starten. Um ehrlich zu sein, habe ich keine Ahnung, ob dies ein gültiger Ansatz ist. Ich habe versucht zu sehen, ob ich das verhindern kann, ob ich verhindern kann, dass das Terminal einfriert, aber ich konnte nichts finden. Also habe ich mir selbst etwas ausgedacht, einen beliebigen Buchstaben eingegeben und die Eingabetaste gedrückt. Aber hier musst du vorsichtig sein. Sie müssen im Terminal tatsächlich die Eingabetaste drücken. Das Model hat den Befehl geschrieben, aber er wartet darauf, dass wir die Eingabetaste drücken. Das ist nicht ganz offensichtlich da wir in anderen Fällen nichts tun müssen. Das ist also etwas, das du dir bewusst sein musst. Wenn nichts passiert, das Modell aber noch läuft, wartet es möglicherweise auf Sie. Okay, schauen Sie also im Terminal nach, ob es irgendwelche Anweisungen gibt oder ob Sie einfach die Eingabetaste drücken sollen. Jetzt, nach einer Weile, passiert dasselbe wieder. Es steckt fest. Also komme ich mit meinem Ziki raus, tippe es ein, drücke Enter und so geht das Modell weiter Um darauf zurückzukommen: Ich mag dieses Modell sehr, weil es ziemlich unabhängig ist Eine Eingabeaufforderung kann Ihnen Dutzende von Aktionen hintereinander geben. Es weiß, was ich will. Es hat die PRD, also führt es Dinge einfach Schritt für Schritt Aber lustig genug, nach 20 Schritten musst du ihm sagen, dass er weitermachen soll Es wäre schlecht fürs Geschäft, wenn Sie mit einem einzigen Kredit eine fertige Website bekommen würden, oder? Wenn Sie also auf Weiter klicken, werden Sie ein anderes Guthaben verwenden. Um ehrlich zu sein, sollten wir uns nicht Verwendung von Krediten verzetteln. Es spielt wirklich keine Rolle Benutze sie einfach. Benimm dich nicht so, als wären sie wertvoll. Sie sind dazu da, benutzt zu werden. Das einzige Mal, dass ich wirklich verärgert war ein offenes KI-Modell, das war ein offenes KI-Modell, das ständig sagte, es würde Dinge tun, aber dann hat es es nicht getan. Oder es sagte mir immer wieder, ich solle das alleine machen, obwohl es mehr als in der Lage war , es alleine zu tun. Also das ist etwas, bei dem man das Gefühl hat, gescannt zu haben, weißt du? Aber dieses Modell, schauen Sie sich nur an wie viele Schritte dieses Modell ohne Unterbrechung durchlaufen hat. Stellen Sie sich vor, wir würden zu einem wechseln, bei dem wir bei jedem Schritt seine Hand halten müssten, sagen wir, nach jedem einzelnen Schritt weitermachen müssten, das wäre unangenehm. Aber ja, hier ist ein Problem. Ich habe dieses Modell gelobt, weißt du, aber jetzt installiert es Super Base, glaube ich. Und das ist komisch, weil ich ihm nicht gesagt habe, dass es das tun soll. Und hier ist ein weiterer automatischer Stopp. Nach etwa 20 Schritten müssen Sie also selbst auf Weiter klicken. Ich werde auch alle bisherigen Änderungen akzeptieren. Ich empfehle Ihnen, das auch zu tun . Nun, hier ist die Sache. Ich beschloss, auf die natürliche Pause zu warten und dann nach Superbse zu fragen, was nicht in den Anforderungen enthalten ist Nun, ich könnte es sofort beenden, aber es besteht die Möglichkeit, dass es mehr Bugs und mehr Problemen Und ich denke, ich habe das Richtige getan, weil das Modell anscheinend noch viel mehr Arbeit vor sich hat. Es ist in einem Gedankengang, und es zu stoppen, um Superbase zu entfernen , könnte das sogar stören. Selbst wenn Sie Ihren Computer neu starten oder was auch immer, haben Sie natürlich Ihren Computer neu starten oder was auch immer, Ihren Gesprächsverlauf, und jedes Modell kann die gesamte Codebasis überprüfen und weiterarbeiten. Aber ich fand es ideal. Aber du hast es seinen Gedankengang beenden lassen. Es scheint, als hätte es etwa 15 weitere Schritte, also überlasse ich es einer Sache. Okay, jetzt kommt der interessante Teil. Ich habe tatsächlich ein größeres Projekt für einen Zahnarzt gemacht, und ich habe dasselbe Modell und dasselbe Programm verwendet Ich glaube, ich habe einen ähnlichen Namen für den Ordner verwendet Windsurfen hat jetzt die Fähigkeit, Erinnerungen zu schaffen. es also eine Weile funktioniert hat und bestimmte Ergebnisse erzielt hat, wird es eine Erinnerung hinterlassen Dies hilft ihm, weniger Ressourcen zu verbrauchen. Stellen Sie sich das also so vor. Sagen wir, es kann sich nur an 100 Nachrichten in unserer Konversation erinnern , richtig? Dies ist nur ein Beispiel, damit Sie verstehen können, wie es funktioniert. Wenn Sie also fünf weitere Nachrichten hinzufügen, die ersten fünf, die ersten fünf verloren. Es ist wie ein Nebel des Krieges, wenn Sie Strategiespiele mögen. Aber was ist, wenn diese ersten fünf Nachrichten etwas Wichtiges enthalten? Nun, da kommt eine Erinnerung ins Spiel. Sie speichern diese wichtigen Informationen getrennt, unabhängig von diesen 100 Nachrichten, und das macht alles intelligenter. In gewisser Weise ist es, als würden Sie Ihrem Arzt sagen , dass Sie wirklich allergisch gegen Schalentiere sind, oder? Nun, der Arzt vergisst vielleicht andere Dinge, die Sie sagen, aber wenn der Arzt seine Notizen überprüft, wird er feststellen, dass Sie allergisch sind und er wird entsprechend handeln Nun, das ist natürlich eine stark vereinfachte Erklärung, aber ich hoffe, sie ergibt Sinn Das ist es, was Erinnerungen bewirken. Sie helfen Windsurfern, sich wichtige Informationen zu merken. Nun, als ich SupaBase benutzt habe, hatte ich viele Probleme damit Es hat nicht gut funktioniert. Das Model sah, wie ich damit zu kämpfen hatte. Es versuchte immer wieder, es zum Laufen zu bringen, und es lief nicht gut. Super Base funktionierte nicht gut. Und nachdem ich es eine Weile versucht hatte, wurde mir das in Erinnerung gerufen. Und jetzt kam diese Erinnerung ins Spiel. Es ist wirklich super aufregend und faszinierend, auch wenn es nicht ideal für unser Projekt ist. Machen wir eine Pause, und dann werde ich gleich weitermachen. 20. Wie man mit Fehlern umgeht: Willkommen zurück. Bugs sind unvermeidlich. Man könnte sagen, wenn künstliche Intelligenz es zu 100% schreibt , wird sie es auch richtig machen, oder? Aber das ist nicht der Fall. Zum jetzigen Zeitpunkt nicht. Bugs sind unvermeidlich, aber die gute Nachricht ist, dass sie ziemlich einfach zu beheben sind. Also zurück zum Projekt, unser Modell hat einen ziemlich guten Job gemacht. Es hat die gesamte Website mit sehr wenigen Proms erstellt. Ohne also eine Menge Geld auszugeben, können Sie feststellen, dass es fertig ist, wenn Sie einen Überblick darüber sehen , was es geschafft hat Nun, einige Modelle bieten diesen Einblick nicht , aber dieses schon. Sie können diese beiden wichtigen Schaltflächen auch sehen, Vorschau öffnen oder in einem externen Browser öffnen. Jetzt verwende ich gerne einen externen Browser , weil die meisten Leute die Website so sehen werden. Deshalb bevorzuge ich diesen sauberen Look ohne Ablenkungen. Okay, das ist ein Fehler, aber wir werden ihn in einer Sekunde beheben Also vorerst zurück nach Windsor. In der Übersicht können Sie nun sehen, dass das Modell uns mitteilt die nächsten Schritte zwei und drei alle gut sind Github und Versel. Okay? Dann teste das Formular, damit es richtig funktioniert. Cool. Aber Schritt Nummer eins ergibt keinen Sinn. Superbse sollte nicht hier sein, auch wenn Sie kein Techniker sind Sie können deutlich sehen, dass das ein Problem ist , weil es nirgends erwähnt Aber nehmen wir an, Sie haben keine Ahnung, oder? Genauso wie Sie nichts über React Next JS, Rückenwind oder was auch immer wissen React Next JS, Rückenwind oder was auch immer Wenn das Modell sie auswählt, weiß es es vielleicht am besten, oder? Nun, hier ist die Sache. Sprich damit, als würdest du mit einem Entwickler sprechen. Frag ihn einfach genau das. Warum hast du Super Base benutzt? Für das Formular, sagte ich, sollten wir Resend verwenden Und dann schau, was da steht, oder? Übrigens, so habe ich gelernt. Ich habe es nach React, Next JS, VT, Rückenwind und all diesen Dingen gefragt Next JS, VT, Rückenwind und all diesen Dingen Ich habe das Model danach gefragt. Warum hast du es benutzt? Und das Model sagte: Es ist eine gute Wahl. Es ist eine bewährte Methode, so weiter und so fort. Es hat viele Vorteile. Okay, damit das Model sagen kann: Hey, ich habe die richtige Entscheidung getroffen. Ich habe die richtige Wahl getroffen , wenn das Sinn macht, oder? Nun, hier ist es eigentlich ziemlich lustig. Da steht, ich habe absolut recht. Und ich entschuldige mich für die Verwirrung. Es hat Super Base aufgrund seiner Speicher implementiert . Und hier ist die Sache. Es wird den Code von selbst reparieren. Beachten Sie, dass wir nicht einmal aufgefordert werden, es zu validieren. Es weiß, was es falsch gemacht hat. Es weiß, was es tun muss, und das tut es einfach. Und jetzt werden viele, viele Dateien bearbeitet. Nun, ich bin mir sicher, dass Sie diese Art von Problem nicht haben werden, aber ich wollte Ihnen diesen Fall wirklich zeigen. Ich wollte Ihnen zeigen, dass einige Probleme völlig unerwartet sind. Aber ja. Okay, lass uns weitermachen. Schnell vorspulen und fertig. Es hat also viele Dinge ersetzt. Es hat die Dokumentation aktualisiert, ziemlich viel Zeug. Jetzt werde ich es natürlich akzeptieren, aber hier ist die Sache. Ich wette, der Fehler in meinem Browser ist immer noch da. Schauen wir uns das mal an. Übrigens immer auffrischen. Aber ja, es ist immer noch da. Also hier ist, was du tun musst. Wählen Sie also all diesen Text aus und fügen Sie ihn einfach mit oder ohne Kontext in Windsurf ein, in diesem Fall macht das wirklich keinen großen Unterschied Nun, hier ist die Sache. Das Modell versteht sofort das Problem und beginnt , es zu lösen. Lassen Sie uns in der Zwischenzeit über das erneute Senden sprechen. Um es kurz zu machen: Wir müssen unser Projekt mit dem erneuten Senden verbinden Es ist, als würde man es anschließen. Damit das passiert, um es zu verbinden, brauchen wir den Schlüssel. Unsere Website wird diesen Schlüssel also verwenden, um Zugriff auf das erneute Senden zu erhalten Das bedeutet, dass sie in der Lage sein wird, zu kommunizieren, um sie erneut zu senden, und das ermöglicht das Hin- und Hersenden von E-Mails Um den aktuellen Schlüssel zu erhalten, Sie nur noch auf eine Schaltfläche klicken Wie ich bereits sagte, sieht man ihn normalerweise nur einmal. Wenn du ihn verlierst, musst du einen neuen machen. Jetzt mach dir keine Sorgen. Es kostet nichts, aber es ist keine gute Idee, zurückzukommen, um sie erneut zu senden und 15 Schlüssel zu finden, und Sie wissen nicht, welcher welcher ist, oder? Welches ist für dieses spezielle Projekt. Okay, noch etwas, ich werde meine Schlüssel unkenntlich machen, weil sie meiner Kreditkartennummer ähneln Ja, sobald du es hast, musst du es hier hinzufügen und schon hast du ein Projekt Sie können Winserf tatsächlich anweisen, es für Sie hinzuzufügen, oder Sie könnten diese Datei möglicherweise selbst finden und einfügen Normalerweise werden alle vertraulichen Informationen in einer Datei namens dot ENV gespeichert Hier werde ich meinen Schlüssel einfügen. Jetzt gibt es hier zwei weitere Felder. Diese sind spezifisch für den erneuten Versand. Von E-Mail stammt unsere Website. Sie können sehen, dass das Model tatsächlich eine gefälschte E-Mail dafür erstellt hat, aber das ist offensichtlich nicht echt. Es wird nicht funktionieren. per E-Mail wird das Formular die Nachricht senden, im Grunde an den Zahnarzt, die Rezeptionistin, was auch immer In diesem zweiten werde ich also meine E-Mail-Adresse angeben, damit wir sie testen können Und im ersten Fall müssen wir eine spezielle Adresse Namen Delivered at resend dot V verwenden. Wenn Sie sich entscheiden Super Base oder Firebase oder Recent oder was auch immer zu verwenden, müssen Sie selbst ein wenig über diese Plattform lernen ein wenig über diese Plattform Okay, gehen wir zurück zu unserer Website. Also ist es jetzt live. Aber ist es das, was wir wollen? Lass uns gleich einen Blick darauf werfen. Machen wir eine kurze Pause. Y y 21. Das Formular richtig arbeiten lassen: Willkommen zurück. Unsere Website sieht auf den ersten Blick okay aus, oder? Was wir hier sehen, ist professionell, ziemlich sauber und sehr gut für den Zahnarzt geeignet. Es gibt einige Probleme mit dem Text. Das ist ein bisschen zu hell und du kannst es nicht lesen. Und die Fotos scheinen nicht richtig geladen zu werden. Die Seite ist auf Englisch, aber die Preise und Namen sind in meiner Landessprache. Ich glaube, das hat es getan, weil es die Adresse des Kabinetts gesehen hat. Ein geschäftlicher Wandel, etwas, das repariert werden muss , aber trotzdem interessant ist. Der Klebriegel unten ist cool. Die Karte funktioniert gut. Insgesamt macht mich das also glücklich. Das ist ein guter Anfang. Als Erstes möchte ich sicherstellen, dass die Bilder geladen werden und dass das Formular korrekt funktioniert. Also lass uns das eintippen. Also hier ist der Deal. Sie können eine Liste der Änderungen in einer einzigen Aufforderung bereitstellen. Sie könnten sogar zehn, 20 Dinge schreiben , die Sie ändern möchten, und es besteht eine gute Chance, dass sie korrekt ausgeführt werden , jedes einzelne davon, oder? Aber wenn Sie auf Nummer sicher gehen wollen, sollten Sie Schritt für Schritt vorgehen. Normalerweise konzentriert sich das Modell etwas besser und Sie erhalten vorhersehbarere Ergebnisse Okay, meine Aufforderung ist startklar. Lass uns sehen, was passiert. stellen Sie sicher, dass Sie bei Ihrer zweiten Besichtigung weiterarbeiten . Okay. Übrigens, eine Sache, du hast vielleicht etwas gesehen bei dem du mit einem Mikrofon sprechen kannst und Windsurf es dann versteht So kannst du direkt mit der KI sprechen. Aber ich kann es eigentlich nicht empfehlen. Für die Vibe-Codierung ist es eine gute Idee, deine Gedanken aufzuschreiben, sie zu überprüfen, Änderungen vorzunehmen, weitere Details hinzuzufügen, Dinge auszuschneiden und dann deine Aufforderung einzureichen Sprechen mag in den anderen Fällen toll sein, aber ich verwende es nicht gerne für die Vibe-Codierung Okay, jetzt zu den Fotos Ich denke, das wird sie ziemlich schnell reparieren Aber ich glaube, nach einer Weile werden wir dasselbe Problem mit dem Hängen haben. Ja, bitteschön. Das Terminal hat angehalten. Wir können sehen, dass es alle Dateien kopiert hat. Okay, alles gut. Also worauf warten wir dann? Also nochmal, gib einen beliebigen Buchstaben Z oder was auch immer ein und drücke Enter. Und jetzt, ja, ist es wieder auf Kurs. Es scheint, dass das etwas komplizierter war, als ich dachte. Es gibt viele Dateien , die angepasst werden müssen. Aber ja, insgesamt ist uns das wirklich egal, oder? Es ist noch nicht einmal eine halbe Stunde und wir haben schon etwas Supersolides. Also lass uns weitermachen. Lass uns schnell vorspulen. Das Modell ist also fertig, oder? Es hat viele Änderungen vorgenommen. Es hat meinen Schlüssel zum erneuten Senden und so weiter hinzugefügt. Ich habe es verwischt Aber weil es fertig ist, bin ich wirklich versucht, zu meinem Browser zurückzukehren und meine Seite zu aktualisieren bin ich wirklich versucht, zu meinem Browser zurückzukehren und meine Seite zu aktualisieren . Das ist instinktiv Aber hier ist die Sache, es wird nicht funktionieren. Das ist ein großartiger Moment für den Unterricht. Wenn du nicht aufpasst, kannst du mit Windserf streiten Hey, es funktioniert nicht. Es ist eine leere Seite. Was ist los? Aber hier ist die Sache. Tatsächlich hat es den lokalen Server neu gestartet und den Link leicht geändert Aus diesem Grund sollten Sie Open External Browser verwenden , falls das passiert Okay, lassen Sie uns das Formular schnell testen und sehen, ob das funktioniert. Die Bilder, ich bin mir sicher, dass sie in Ordnung sein werden, das sollte kein Problem sein. Ich werde meine Daten verwischen, weil der Browser meine tatsächlichen Daten gespeichert hat. Okay, aber hier ist die Sache Es funktioniert eigentlich nicht. Es gibt ein Problem. Das kannst du unten links sehen. Ein Problem. Also klicken Sie darauf und wir werden sehen, dass hier eine Nachricht erscheint. Die Nachricht macht nicht viel Sinn, aber lassen Sie uns sie kopieren und in Windsurf einfügen . Und hier ist die Sache Auch wenn die Nachricht nicht so nützlich ist, überprüft das Modell möglicherweise den gesamten Code. Es kann eine Reihe von Dateien überprüfen. Und ja, genau das passiert hier, Schritt für Schritt, um mögliche Probleme zu prüfen . Und eigentlich liebe ich diesen Ansatz. Ich finde es fantastisch. Und ja, es wurde festgestellt, dass es ein Problem gibt, und es geht um den Domainnamen. Es ist nicht verifiziert und durch erneutes Senden ist es nicht möglich, was wiederum großartig ist, da dies eine sehr schnelle Lösung ist Im mittleren Teil können Sie sehen, wie die ursprüngliche Zeile mit smile care.com, die nicht existiert, rot hervorgehoben ist Das bedeutet, dass sie entfernt wird. Der nächste ist mit dieser E-Mail-Adresse beim Einsteigen bei Resend Dot DV Tolles Zeug. Nur um das klarzustellen, ich habe nicht aufgepasst und den Domainnamen , den es nicht gibt, smileca.com, hinterlassen es nicht gibt, smileca.com, Das ist eine gefälschte Domain , die es nicht gibt, die das Model selbst eingerichtet hat erneutes Senden wird es natürlich nicht zugelassen, da es nicht verifiziert ist Es ist eine gefälschte Domain, oder? Aber wir hatten das Glück , dass Winserf die gefälschte Domain durch die richtige durch die aus der Dokumentation durch die offizielle ersetzt die gefälschte Domain durch die richtige durch die aus der Dokumentation durch die offizielle Deshalb hat es wegen dieser falschen Adresse, smilecare.com , nicht funktioniert falschen Adresse, smilecare.com , Um ehrlich zu sein, habe ich hier einen kleinen Fehler gemacht. Ich habe mit Winserf gestritten , dass es immer noch nicht funktioniert, aber hier ist der Deal. Ich habe viele E-Mail-Adressen. Ich habe vergessen, welches ich für dieses Resend-Konto verwendet habe. Zu Testzwecken dürfen Sie also E-Mails an Ihre eigene Adresse senden , mit der Sie sich angemeldet Da ich etwas durcheinander geraten bin, habe ich es noch ein paar Mal versucht, und ich habe den gleichen Fehler bekommen. Am Ende habe ich diese Änderung vorgenommen. Um das zweite Feld per E-Mail zu versenden, habe ich die richtige E-Mail eingerichtet. Ich habe die verwendet, die ich verwendet habe, als ich mich für den erneuten Versand angemeldet habe. Das war also das Problem. Das ist also eine der Gefahren, von denen ich gesprochen habe. Du vermasselst es. Es liegt ganz bei dir. Es ist dein Problem, aber du redest weiter mit Winserf. Du sprichst weiter mit dem Model, oder? Und das Model hat keine Ahnung. Es versucht, den Code zu überprüfen, es versucht, mögliche Korrekturen zu finden, Workarounds, es wird verschiedene Dinge ausprobieren Aber offensichtlich wird es scheitern. Es wird keinen Erfolg haben. Es ist auf deiner Seite. Es ist dein Problem. Die gute Nachricht ist, dass Sie die Nachricht direkt hier im Terminal sehen können . Hallo, du kannst nur Test-E-Mails an diese Adresse senden, und sie sagt dir tatsächlich die E-Mail-Adresse. Solange Sie also unvoreingenommen sind und sich nicht von Frustration leiten lassen, sollte es Ihnen gut gehen. Ich war ziemlich entspannt. Ich habe auf das Terminal auf der rechten Seite geschaut. Ich habe nach möglichen Lösungen gesucht. Aber die Sache ist, wenn du dich aufregst und rot siehst, kannst du hier für Stunden oder sogar Tage feststecken. Aber ich freue mich, sagen zu können, dass Sie diesen Fehler nur einmal machen werden. Jetzt können Sie Resend für all Ihre Projekte verwenden , ohne sich Sorgen machen zu müssen Und nur um zu bestätigen, dass es funktioniert, habe ich meine persönliche E-Mail geöffnet, und ja, die E-Mail, die eingegangen ist, können Sie auch erneut senden und das auch bestätigen Warum haben wir das alles gemacht? Denn wenn das ein echter Kunde wäre, ein echter Zahnarzt, würde er es natürlich vorziehen, all seine Nachrichten per E-Mail zu erhalten , oder? Also herzlichen Glückwunsch. Das Formular funktioniert Erneut senden funktioniert. Denken Sie daran, den Schlüssel zum Projekt hinzuzufügen und ihn geheim zu halten. Verwenden Sie ihre spezielle E-Mail-Adresse im ersten Feld. Und für das zweite Feld verwenden Sie Ihre E-Mail-Adresse, der Sie sich für den erneuten Versand angemeldet haben. Okay, tolles Zeug. Lass uns nach der kurzen Pause weitermachen. 22. Laden Sie Ihre Website auf GitHub hoch: Willkommen zurück. Die Seite sieht ziemlich gut aus und funktioniert gut. Wir haben das Formular getestet und es ist in Ordnung. Jetzt könnten wir das Design möglicherweise verbessern, aber das ist ziemlich einfach. Du gehst zurück zum Windsurfen und sagst, was du ändern willst, und das war's Jetzt werden wir das ganz am Ende machen. Aber jetzt möchte ich Ihnen zeigen, wie wir es in nur wenigen Schritten live schalten können. Der erste ist also GitHub. Denken Sie daran, dass diese Seite funktioniert, aber sie ist nur auf unserem lokalen Computer verfügbar. Um sie zu veröffentlichen, verwenden wir Versell, aber ein Zwischenschritt ist Mehr dazu in einer Sekunde. Lassen Sie uns dem Modell vorerst mitteilen , dass wir bereit sind, weiterzumachen. Ich werde genau das sagen. Lassen Sie uns mit den nächsten Schritten fortfahren. Bitte lade es auf Github hoch. Ich mache eine Pause. Ich will hier wenig Arbeit wie möglich machen, oder? Deshalb sage ich dem Modell lieber, Github MCP zu verwenden. Das bedeutet weniger Arbeit uns und weniger potenzielle Probleme Andernfalls könnten wir aufgefordert werden, dorthin zu gehen, ein neues Projekt zu erstellen, ein paar Einstellungen vorzunehmen und so weiter Das möchte ich nicht tun. Okay. Dann werde ich dem Model sagen, dass ich Versell verwenden werde, um es zu veröffentlichen, damit es mir helfen kann, falls ich nicht weiterkomme Übermäßiges Teilen ist jetzt kein Problem mehr. Nein, weit davon entfernt. Je mehr Details, desto besser. Okay, und wir machen uns auf den Weg zu den Rennen. Es wird in meinem Konto, meinem Github-Konto nachschauen, was los ist, und ganz von selbst ein neues Projekt erstellen. Das wird als Repository bezeichnet. Das ist der richtige Begriff Repository oder Repo. Okay, aber du kannst dich daran erinnern wie an ein Projekt. Projekt, Repo ist dasselbe. Jetzt bleibt das Modell leider wie immer hängen Aber lassen Sie uns es mit einem zufälligen Befehl im Terminalbereich zurückbringen . Okay, einfach so mit BO Track. Also hier ist, was passiert. Wir laden all unsere Dateien von unserem Computer hoch, von unserem lokalen Computer in die Cloud zu Github, wobei wir das Projekt quasi klonen Jetzt sind Sie vielleicht nicht mit Github vertraut. Ich bin es auch nicht. Ich bin kein Programmierer. Aber hier ist das Coole . Du musst nichts über Github wissen. Du wirst das Modell einfach in Winserf verwenden . Falls Sie neugierig sind, können Sie jetzt in Ihren Repositorien nach diesem Projekt suchen, das in Ihrem Fall das einzige sein sollte Ich habe tatsächlich viel geladen weil ich Github ziemlich oft benutze Aber ja, wenn du es einmal gesehen hast, kannst du alle Dateien sowie einige Anweisungen sehen , die das Model für dich mit anderen Leuten geschrieben hat. Also, das ist fantastisch. Nun, warum hilft Github? Nun, hier wird GitHub zu mehr als nur einem einfachen Mittelsmann Wenn dein Projekt auf Github verfügbar ist, hast du ein Versionskontroll-Backup erstellt , das je nachdem, was du wählst, öffentlich oder privat ist Also, Schritt für Schritt, was ist Versionskontrolle? Nehmen wir an, das ist Virgin O. Mit einem Formular, das so einfach wie möglich ist. Nichts so ausgefallenes, oder? Jetzt können wir ein viel fortgeschritteneres Formular erstellen, in dem der Besucher, ich weiß nicht, die Dienste wählen kann, er kann die Uhrzeit und das Datum wählen und so weiter, oder? Etwas Fortgeschritteneres. Und hier ist die Sache. Das machen wir. Wir bringen es dann zum Kunden. Du machst es lebendig. Aber nach einer Weile bekommst du diesen gefürchteten Anruf. Hey Chris, weißt du was? Das neue Formular funktioniert nicht. Ich habe tatsächlich weniger Termine. Die Leute benutzen es nicht, aus welchem Grund auch immer. Gehen wir also zurück zum alten, weil die Leute es einfach nicht mögen Du kannst fragen, ist es kaputt? Funktioniert es nicht? Nein, nein, es ist in Ordnung, aber die Leute bevorzugen den alten. Kannst du den alten zurückbringen? Ah. Okay, das wäre schmerzhaft. Du müsstest zurück zum Windsurfen gehen ganzen zusätzlichen Code weglassen Das kann zu Bugs führen. Das Formular kann kaputt gehen. Die gesamte Website kann kaputt gehen , aber das ist eigentlich überhaupt kein Problem. Hier kommt die Versionskontrolle ins Spiel. Mit GitHub kehren Sie einfach zur vorherigen Version oder zu einer beliebigen Version zurück, um ehrlich zu sein, da Sie mehrere haben können. Sie können auch separate Versionen haben, auf einem Farbschema basieren, auf Funktionalität und Layouts basieren. Sie können tun, was Sie wollen. Du nennst. Github hilft dir also dabei, all das zu organisieren. Sie können zu einer Version zurückkehren, die gestern , eine Woche zuvor, einen Monat zuvor, vor fünf Jahren war, es ist wirklich so einfach. Und es ist einfach so. Also, ist es unglaublich einfach? Nein, aber da ist es nicht schwierig, denn hier ist die Sache. Du hast Windsurfen Sie haben die KI auf Ihrer Seite. Sag ihr einfach, sie soll tun, was auch immer du willst. Geh zurück zum roten Wind, geh zurück zur Jungfrau mit dem einfachen Kontaktformular. So funktioniert es also. Das ist Versionskontrolle. GitHub gibt uns Versionskontrolle. Jetzt, öffentlich oder privat. Okay, öffentlich bedeutet, dass andere Leute dich bei der Arbeit sehen können, dass sie dieses Projekt sehen können. Und das ist super nützlich, wenn du einen Job bekommen willst oder wenn du mit anderen Leuten zusammenarbeiten willst, vielleicht einem Team, so etwas, oder? Aber wenn du es verkaufen willst, wenn du selbst Kunden gewinnen willst, wenn du eine Agentur haben willst oder so, wenn du ein Freelancer sein willst , wirst du es höchstwahrscheinlich privat halten Also, ja, das ist die Wahl, öffentlich oder privat. Okay. Versionskontrolle, öffentlich oder privat. Das ist GitHub. Es hat viel mehr Funktionen, aber kurz gesagt, das ist die Sache. Aber jetzt zurück zu unserer KI-Geschichte, hier ist der Überblick, hier ist das Wichtigste GitHub ist die perfekte Brücke zwischen deinem lokalen Code in Windsurf und seiner Online-Bereitstellung auf Versell . Hier ist die Situation Plattformen wie Versell sind tief in Github integriert. Wenn Ihre Website bereit ist, live zu gehen, schaut Versell einfach auf Github und er sieht : Oh, okay, hier sind all Ihre Dateien Hier sind all deine Einstellungen. Ich sehe die neuesten Änderungen. Lass es mich live stellen. Das bedeutet, dass Sie keine Dateien hochladen müssen. Sie müssen keine Einstellungen ändern. Sie müssen nichts tun. Sie verbinden Versell einfach mit Ihrem Github-Repo, und das war's Das erledigen wir übrigens in ein paar Minuten. Wir werden sie verbinden. Aber ja, so wird Ihre Website live geschaltet. Das ist leistungsstark, weil dadurch alles automatisiert und sauber bleibt. Wenn Sie später in Windsurf auf Ihrem Computer Änderungen an Ihrem Projekt vornehmen , bitten Sie das Modell einfach, das Github-Projekt zu aktualisieren Und wenn Sie das tun, wird automatisch ein Signal an Versell gesendet, um die Live-Version Ihrer Website zu aktualisieren Mit diesem zusätzlichen Code. Es ist fantastisch. Es gibt keine zusätzlichen Schritte. Du tippst etwas in Windsurf ein und alles in wenigen Sekunden, vielleicht ein paar Minuten, ist es live und du musst dir darüber keine Gedanken machen Es ist alles miteinander verkabelt. Einfach ausgedrückt: Windsurf ist der Ort, an dem Sie die Website erstellen Github ist der Ort, an dem Sie sie im Internet speichern, und dann ist Versell der Ort, an dem Sie sie veröffentlichen, damit die Welt sie sehen kann Stellen Sie sich das wie ein Hosting-Unternehmen vor. H, Sie haben übrigens eine schrittweise Anleitung in der Kaskade, sodass Sie nachlesen und es langsam angehen lassen können Okay, tolle Arbeit bis jetzt. Ich freue mich wirklich, dass du es bis zu diesem Punkt geschafft hast. Machen wir eine kurze Pause und wir sehen uns in einer Sekunde. Denken Sie daran, an Ihrer zweiten Besichtigung weiterzuarbeiten. 23. Veröffentlichen Sie Ihre Website mit Vercel & beheben Sie Fehler: Willkommen zurück. Lassen Sie uns rekapitulieren Also haben wir mit moderner Technologie eine Website erstellt. Wir haben dafür gesorgt, dass es gut funktioniert. Wir haben es dann auf Github hochgeladen und sind jetzt bereit, es zu veröffentlichen, damit wir es mit der Welt teilen können. Jetzt sagen Entwickler nicht wirklich, veröffentlichen. Sie sagen bereitstellen. Lassen Sie uns also das Deployment mit Versell durchführen, sollte bereits ein Konto falls Sie dem gefolgt sind In Versll wirst du vielleicht aufgefordert, Github zu verbinden, aber das ist ganz einfach. Es sind nur ein paar Klicks. Nichts Wichtiges, kein Schlüssel, nichts dergleichen. Solange du eingeloggt bleibst, bist du Gold. Okay, hier fängt der Fonds an. Wir wollen das Projekt importieren , weil wir Versell mit Github verbunden haben Wir sehen alle unsere Projekte. Das ist mein Name hier. Nun, der Name, den ich in Github eingegeben habe, damit ich ihn wiedererkenne. Und mehr noch, ich kann sehen, dass es ein neues Projekt gibt , das ich gerade hochgeladen habe. Also werde ich auf Import klicken. Hier müssen wir uns nur um ein paar Dinge kümmern. Versell gibt einem Projekt also selbst einen Namen , und das ist völlig in Ordnung Es erkennt das Framework an. Als nächstes JS. Okay, gutes Zeug. Es ist uns wirklich egal. Das einzige, was wir hinzufügen müssen, sind diese Umgebungsvariablen. Und das klingt kompliziert, aber in Wirklichkeit ist es das, was Windsurf uns sagt Gehen Sie also zurück und Sie werden sehen, dass Sie den API-Schlüssel und zwei Felder aus E-Mail und E-Mail hinzufügen müssen Das ist also eigentlich ganz einfach. Es ist eine Frage des Kopierens und des Einfügens, und die KI sagt dir genau, was du einfügen musst Also der erste Teil im linken Feld, der Name der Sache, und auf der rechten Seite der Wert, auch bekannt als der Schlüssel Also lass mich genau das tun. Auch hier werde ich aus Sicherheitsgründen meinen Schlüssel unkenntlich machen. Oh, stellen Sie sicher, dass Sie die empfohlenen Werte verwenden. Also im Absender-E-Mail-Feld ist es die Standardadresse. Bei Resend Dot Dev hierher geliefert, wurde ich tatsächlich von Windsurf verwirrt und ich habe eine andere Adresse verwendet, aber ich denke, das funktioniert auch Okay. Und in den beiden E-Mails ist es die E-Mail, mit der Sie sich für den erneuten Versand anmelden. Und jetzt sind wir bereit für den Einsatz. Verwenden Sie diese große Schaltfläche, um unsere Website zu veröffentlichen. Aber hier ist die Sache. Bitte beachten Sie, dass es ein paar Minuten dauert. Manchmal zwei, drei, vier, es kommt wirklich darauf an. Wenn Sie jetzt nach unten scrollen, können Sie tatsächlich einen Timer und den aktuellen Status sehen. Wenn wir Glück haben, erhalten wir vielleicht in etwa 40 bis vielleicht 50 Sekunden eine Erfolgsmeldung. Aber in den meisten Fällen, um fair zu sein, werden die Lebensmittel ein paar Mal ausfallen. Nun wollen wir sehen, ob wir Glück haben. Okay, nein, es ist tatsächlich gescheitert. Wir können sehen, dass es ein paar Probleme damit gibt. Aber hier ist die Sache. Wir haben oben rechts ein Kopiersymbol, also benutzen wir es. Lustigerweise kann ich sehen, dass es mit den Testimonials zusammenhängt. Ich hatte in der Vergangenheit etwas Ähnliches . Hier sind die lustigen Sachen. Wenn Sie also Testimonials hinzufügen, fügen Sie normalerweise ein Zitat hinzu, um zu zeigen, was die Leute über das Unternehmen sagen, oder fügen Sie normalerweise ein Zitat hinzu, um zu zeigen, was die Leute über das Unternehmen sagen, oder? Ein Zitat, richtig? Nun, diese Anführungszeichen , dieses Zeichen, nun, wenn es nicht richtig formatiert ist, brechen diese Zeichen den Code Es ist also wirklich albern, aber ja, ich musste fünf bis zehn Eingabeaufforderungen verwenden, um das gesamte Projekt zu überprüfen und zu bereinigen Obwohl einige dieser Modelle unglaublich intelligent sind, machen sie manchmal dumme Fehler Aber ja, zurück zur Sache. Hier ist, was passiert. Windsurf überprüft also die Dateien und repariert fast alles es glücklich ist, wird es auf Github gepusht, was bedeutet, dass es GitHub mit dem neuesten Code mit allen Fixes aktualisiert GitHub mit dem neuesten Code mit allen Fixes Natürlich kann das Terminal anhalten, aber geben Sie etwas ein, drücken Sie die Eingabetaste und der Vorgang sollte fortgesetzt werden. Okay, startklar. Aber ja, sobald der Code von unserem Computer auf Github hochgeladen wurde, erhält Versell den neuen Code auch automatisch Okay, das Modell sagt, dass es fertig ist, und es heißt, wir sollten es in Versell erneut versuchen Okay, ich werde hier auf GoTo Project klicken. Hier, ich weiß, es ist dein erstes Mal, aber es ist eigentlich ganz einfach Wenn Sie diesen Teil bemerken, ist er gelb, was bedeutet, dass er versucht, das Projekt erneut zu erstellen. Es ist also ein aktiver Prozess. Aber ja, nach ein paar Sekunden schlägt es wieder fehl, also ist es rot. Auch das ist typisch. Also lasst uns klicken und uns das Protokoll ansehen. Es scheint sehr ähnlich zu sein. Ja, es ist wahrscheinlich dasselbe Problem, aber hier ist die Sache. Machen Sie sich nicht die Mühe, das Protokoll zu oft zu lesen. Kopieren Sie es einfach und fügen Sie es wieder in Winserf und wir werden sehen, was was ist. Nehmen Sie sich Zeit damit Und inzwischen sollten Sie an diesen Ablauf gewöhnt sein, bei dem Winserf Dinge repariert, das Terminal hängen bleibt, das Terminal hängen bleibt, Sie es wieder aufnehmen und dann alles wieder auf Github hochgeladen wird Okay, lass uns jetzt zu Versell zurückkehren und hier solltest du dich darauf konzentrieren Das ist mein Konto, und das ist das aktuelle Projekt, und das ist die aktuelle Bereitstellung, die fehlgeschlagen Wir kehren also zum Projekt zurück, indem wir hier auf den Namen des Projekts klicken. Denken Sie daran, so oft wie nötig eine Pause einzulegen , bis Sie das Video zum zweiten Mal ansehen. Okay. Sobald Sie klicken, können Sie sehen, dass die neue Version gerade erstellt wird. Weil wir GitHub aktualisiert haben, Versel das gesehen und es veröffentlicht es automatisch Jetzt kannst du natürlich damit aufhören, aber ja, das ist normalerweise das, was du tun willst Jetzt wollen wir sehen, ob wir Glück haben. Wir können hier warten oder wir können darauf klicken. Lass uns sehen, was drin ist. Also der Status hier ist gelb, also müssen wir noch ein bisschen warten. Aber ja, nach ungefähr einer Minute oder so, okay, noch ein paar Probleme. Nochmal, klassisch. Nun, lustig genug, es geht um Super Base. Okay, ich dachte, wir hätten es entfernt, aber es scheint, dass einige Dateien immer noch etwas damit zu tun haben. Also, das ist ein bisschen frustrierend, oder? Die KI hat in unserem Projekt viele schlechte Sachen gemacht. Ich bin mir sicher, dass Sie dieses spezielle Problem nicht haben werden. Vielleicht hattest du Glück und vielleicht hat es beim ersten Mal funktioniert. Aber auf der anderen Seite denke ich, dass das nützlich ist. Sie können Debugging in Aktion sehen. Nun, ich wollte diese Probleme nicht aus der Aufzeichnung des Kurses entfernen diese Probleme nicht aus der Aufzeichnung des , weil ich denke, es ist wichtig, dass Sie verstehen, dass dies normal ist Das ist völlig in Ordnung. Das wird erwartet. Je mehr Sie sich mit diesem Ablauf vertraut machen, Sie auf alles vorbereitet. Aber du musst entspannt sein. Du musst nicht nervös sein. Du musst kein Rot sehen. Du musst nicht wütend werden. Sie müssen sich keine Gedanken über die Kredite und darüber, wie Sie Geld konsumieren. Das wird nicht helfen. Aber ja, schneller Vorlauf und noch ein Fehlschlag, aber ich werde nicht verzweifeln. Ich werde weiter daran arbeiten und weiter aktualisieren. Ich werde weiter daran arbeiten, es zu reparieren. Obwohl es mich einige Credits und einige Minuten kostet , bin ich damit einverstanden Versuchen Sie, mit einem Freelancer aus einem anderen Teil der Welt für, sagen wir, 50 Dollar die Stunde zu arbeiten , und Sie werden schnell feststellen , dass das unendlich besser ist Es ist nicht großartig. Es ist kein Zuckerschlecken, aber die Alternative ist viel schlimmer. Aber ja, nach so viel Mühe haben wir endlich grünes Licht Die Website ist fertig. Sie ist live. Sie können es jetzt hier anklicken und es in Aktion sehen. Und hier ist es in seiner ganzen Pracht. Sie können es jetzt mit Ihren Freunden und Ihrer Familie teilen . Aber hier ist die Sache. Bevor ich irgendwas mache, lass uns sehen, ob die E-Mail ankommt. Also hat Wserf es vorgeschlagen. Denken Sie daran, dass wir eine andere E-Mail verwendet haben, die wir nicht zugestellt haben Wir haben Onboarding verwendet. Schauen wir uns also schnell um, ob das funktioniert. Und ja, der Sieg. Das Formular funktioniert immer noch. Die Website ist live. Das Formular funktioniert. Herzlichen Glückwunsch. Okay, lass uns nach der kurzen Pause weitermachen. 24. Veröffentlichung der Website unter Ihrem eigenen Domainnamen: Willkommen zurück. Wir haben es geschafft, unsere Website auf GitHub hochzuladen und sie dann mit Versell bereitzustellen Wenn du zu Versell zurückkehrst, kannst du hier eine temporäre Adresse sehen Es ist natürlich nicht schön anzusehen, aber es ist live Es funktioniert. Du kannst es mit Leuten teilen. Du kannst jetzt aufhören, zu Winserf zurückkehren und ein paar andere Änderungen vornehmen die Website zu verbessern, mehr Seiten hinzuzufügen, mehr Funktionen hinzuzufügen, das Design zu verbessern, es in deine eigene Sprache zu übersetzen , das funktioniert, Aber nur für den Fall, dass Sie neugierig sind, möchte ich Ihnen zeigen, wie Sie von einer temporären Adresse, einem hässlichen Link, zu etwas wie cresbarn.com wechseln können von einer temporären Adresse, einem hässlichen Link, zu etwas wie cresbarn.com wechseln einem hässlichen Link, zu etwas wie Also dein eigener Domainname. Gehen Sie zurück zu Versell zu Ihrem Projekt und Sie haben etwas namens Domain Klicke darauf. Das ist genau das, wonach wir suchen. Hier kann ich den sehen, den Versell für mich selbst gemacht hat. Auch das ist nicht schlecht, aber ich will etwas, das mir gehört Klicken wir also auf Nach Domain. Und nach ein paar Sekunden können Sie nach etwas suchen , Ihrem eigenen Domainnamen. Jetzt sind die besten natürlich schon vergeben, aber Sie können Ihren eigenen Namen verwenden. Also werde ich Chris Barn schreiben, aber ich weiß, dass.com schon vergeben ist, weil ich es zuvor gekauft Nun, was ich an Versell liebe, ist , dass es Ihnen viele mögliche Optionen zeigt, von from.ai bis hin zu etwas Klassischerem wie.net Dies sind alle verfügbaren Optionen , und Sie können eine fundierte Entscheidung treffen da die Preise tagesklar sind Offensichtlich ist Chris Barry and.ai für 149 Dollar etwas zu teuer Also werde ich mich für etwas anderes entscheiden. Lassen Sie uns mit FYI beginnen, was zu Ihrer Information eigentlich FYI bedeutet Das macht nicht viel Sinn, aber hey, es sind 6$, Also lass uns darauf klicken und kaufen. Wie Sie sehen können, sind es sechs Dollar und etwas Kleingeld. Okay, das ist pro Jahr. Okay, cooles Zeug. Ich werde hier klicken, um es zu kaufen, und jetzt muss ich durch erneutes Klicken bestätigen . Okay, mach dir keine Sorgen. Jetzt muss ich meine Kreditkarte und meine Rechnungsinformationen hinzufügen . Das wird eine Weile dauern. Aber ja, mach dir keine Sorgen. Es ist unkompliziert. Ich muss natürlich auch bei meiner Bank nachfragen, die Transaktion bestätigen, das funktioniert. Nichts allzu Wichtiges. Es ist wie bei jedem anderen Online-Kauf. Nun, hier ist die Sache. Es hat mir tatsächlich diese Botschaft gegeben, was nicht gut ist. Aber hier ist die Sache. Ich habe gesehen, dass das Geld gestohlen wurde, aber ja, Versell hat mir diesen Fehler gegeben Also, in diesen Fällen musst du ruhig bleiben. Das sind seriöse Unternehmen und Sie sollten sich keine Sorgen machen. Gehen wir also zurück zu Domains. Dann ja, hier ist meins. Chris Barron Zu Ihrer Information. Alles gut Ich möchte Sie daran erinnern, dass Versell Ihr Hosting-Unternehmen ersetzt Sie müssen also keinen Hosting-Plan, einen VPS, einen gemeinsam genutzten Server oder was auch immer kaufen VPS, einen gemeinsam genutzten Server oder was auch immer Okay, jetzt lass uns darauf zurückkommen. Kehren wir zu unserem Projekt zurück, indem wir hier oben links klicken. Ich habe nur ein Zahnarztprojekt, also lass uns darauf klicken. Okay, wir sind startklar. Klicken wir jetzt auf Domains und wir sind wieder da, wo wir angefangen haben. Aber dieses Mal werden wir keine kaufen. Wir werden einen hinzufügen. Klicken Sie also hier und wählen Sie das aus, das Sie gerade gekauft haben. Für mich ist das Chris Barron FYI. Hier gibt es eine Einstellung, die empfohlen wird . Lass es angekreuzt. Okay, jetzt werde ich nicht näher darauf eingehen, was das bedeutet , denn das wird uns ablenken. Lass es überprüft Okay, klicken Sie auf Domain hinzufügen und Sie müssen auswählen, und Sie müssen auswählen welche Version des Projekts Sie veröffentlichen möchten. Natürlich werden wir es bei der aktuellen Version, die gerade in Produktion ist , einfach halten . Gehen Sie auf Nummer sicher und jetzt haben wir ein paar Anweisungen für uns. Nichts Wichtiges, aber wir werden selbst etwas tun müssen. Bisher war es einfach, aber jetzt liegt es an uns, diesen C-Namensdatensatz hinzuzufügen. Auch hier müssen Sie nicht wissen , was das ist. Lassen Sie mich Sie Schritt für Schritt durch das Ganze führen. Was Sie also tun müssen, ist, sich diese drei Bits, diese drei Elemente, zu notieren . Sie können sie in einen Notizblock oder was auch immer kopieren. Jetzt ist die erste Zeile bereits festgelegt, also mach dir darüber keine Sorgen Wir müssen nur den zweiten machen. Falls Sie neugierig sind und den Status überprüfen möchten, ohne etwas zu tun , wird es offensichtlich nicht funktionieren. Ungültige Konfiguration natürlich. Offensichtlich funktioniert es nicht, weil wir es nicht eingerichtet haben. Also hier ist, was Sie tun müssen. Gehen Sie zurück zur Domain-Seite. Schauen Sie sich die Navigation hier an. Sie sollten es ohne allzu große Probleme finden. Verwenden Sie dann die Punkte auf der rechten Seite Ihres Domainnamens. Hier wollen wir es konfigurieren. Wir wollen es einrichten. Scrollen Sie ein bisschen nach unten, und unter DNS DNS haben wir diese Felder, mit denen wir die Details von zuvor hinzufügen können. Um ehrlich zu sein, hätte Verl das auch alleine machen können, aber hey, das ist in Ordnung Geben Sie also WWW in das erste Feld ein. Wählen Sie dann für das Drop-down-Menü den C-Namen aus. Und schließlich fügen Sie für den Wert diesen Text hinzu, aber achten Sie darauf, dass Sie den Punkt am Ende hinzufügen. Der Punkt wird tatsächlich benötigt. Okay, ändere sonst nichts. Klicken Sie stattdessen auf Hinzufügen und ob Sie es glauben oder nicht, das war's. erhalten Sie eine Erfolgsmeldung Unten rechts erhalten Sie eine Erfolgsmeldung und Sie können sehen, dass der Eintrag jetzt gespeichert ist. Nun, hier ist die Sache. Sie freuen sich vielleicht darauf, Ihren eigenen Domainnamen zu besuchen, oder? Aber es ist noch nicht fertig. Es ist im Ofen. Das dauert eine Weile. In der Regel zwischen 4 Stunden und 24 Stunden. Das ist der offizielle Leitfaden. Seien Sie also nicht enttäuscht, wenn es nicht sofort funktioniert. Bei mir hat es ungefähr zehn bis 15 Minuten gedauert. Aber denk dran, du musst geduldig sein. Geh nicht Sachen wechseln. Beschweren Sie sich nicht bei Windsor über einen Fehler, der nicht funktioniert. Nehmen Sie sich Zeit damit . Bleib ruhig. Aber ja, bitte. Lass mich schnell vorspulen. Chris Barron ist jetzt live. Die Website sieht gut aus. Wir sind Gold wert. Herzlichen Glückwunsch. Sie haben jetzt von Anfang bis Ende Ihre eigene Website, ohne zu wissen, wie man programmiert. Ah, eins. Sie können sich wie verrückt aktualisieren, richtig, in den ersten Sekunden oder Minuten. Es dauert ein paar Minuten, bis das SSL installiert ist. Ihr Antivirenprogramm zeigt Ihnen also möglicherweise am Anfang erneut einige Warnungen an, oder Sie erhalten möglicherweise eine kaputte Website, wenn Sie beim Aktualisieren ständig auf eine Fünf klicken. Aber nach ein paar Minuten oder vielleicht ein paar Stunden wird es perfekt funktionieren, wird es perfekt funktionieren, ohne irgendwelche Warnungen oder was auch immer. Das ist völlig normal. Jeder klassische Programmierer oder jedes klassische Hosting-Unternehmen würde genauso funktionieren Es gibt also keine Nachteile. Okay, nehmen wir uns einen Moment Zeit und feiern 25. Änderungen an unserer Live-Website vornehmen: Komm zurück. Es spielt keine Rolle, ob Sie Ihren eigenen Domainnamen gekauft haben oder ob Sie den verwenden, den Versell für Sie erstellt hat, Sie können die Website trotzdem weiter verbessern Für mich gibt es einen Bereich mit superhellem Text , der schwer zu lesen ist, also muss ich das korrigieren Lassen Sie mich Ihnen zeigen, wie einfach es ist, wenn alles eingerichtet ist. Auch dies funktioniert mit einer benutzerdefinierten Domain oder mit einer Basisdomain, die Versell angegeben hat Also werde ich zunächst einen Screenshot von Firefox machen einen Screenshot von Firefox Sie können jede Art von Browser-Plugin verwenden. Es liegt wirklich an dir. Ich weiß, dass einige Leute Safari, Chrome, Brave Edge und vieles mehr verwenden , also werde ich mich nicht mit Plugins befassen , die Screenshots machen. Mach einfach einen Screenshot und fertig. Dann zieh es ins Windsurf in dieses Feld. Es wird so aussehen Aber nur damit es nicht zu überwältigend ist, lassen Sie uns eine große Veränderung vornehmen, etwas, das wirklich dramatisch sein wird Lassen Sie uns also das Modell bitten, das Farbschema von Blau auf Rot zu ändern das Farbschema von Blau auf Rot zu Das sollte einen großen Unterschied machen. Das wird ziemlich offensichtlich sein. Okay, drücken wir die Eingabetaste und los geht's zu den Rennen. Also analysiert das Modell die gesamte Website und bereitet alles vor. Es ist eigentlich nicht so einfach, wie ich es mir vorgestellt habe. Das Modell ändert also einige Dateien. Also, um ehrlich zu sein, interessiert es uns wirklich? Nein, nicht wirklich. Es macht alles alleine mit einer einzigen Aufforderung. Fairerweise muss man allerdings sagen, dass wir nach einer Weile einen weiteren Kredit ausgeben müssen , denn bei diesem Tempo geht es tatsächlich um ziemlich viele Dateien. Und ja, hier ist es. Zur Erinnerung: Nach etwa 20 Schritten fragt Sie Wind Surf, ob Sie fortfahren möchten. Das wird dich einen weiteren Kredit kosten. Und ja, es wird weitergehen, und ja, es macht eine Menge. Aber ja, ich hoffe, Sie können spüren, wie Sie Ihre Website möglicherweise beschädigen könnten , wenn Sie so viele Dateien ändern. Wenn Sie mit so vielen Dateien arbeiten und Dinge ändern, kann das ein bisschen gefährlich sein. Und hier ist die Sache. Ab einem bestimmten Punkt benötigt das Modell einige Zeit. Sie können es hier sehen. Ich war also wirklich besorgt , dass es gerade feststeckt. Aber ja, vorher war das Terminal das Problem, und wir haben einfach einen beliebigen Buchstaben eingegeben, und es war in Ordnung Aber in diesem Fall scheint das Modell eine Weile nachzudenken Aber nein, wir haben Glück, wir haben Glück. Es ist alles gut. Ich schätze die Datei war ziemlich groß mit irgendwas, und deshalb hat es einige Zeit gedauert. Auch hier musst du entspannt sein. Sei deswegen nicht nervös . Werd nicht nervös. Aber auch hier bin ich ehrlich gesagt überrascht, wie viele Dateien sich für den einfachen Farbcode ändern Das hängt wahrscheinlich mit der Textstruktur zusammen, die wir verwenden. Hier würde sich etwas Programmiererfahrung als nützlich erweisen. diesem Grund haben Entwickler sechsstellige Beträge pro Jahr gezahlt , oder früher waren sie es sowieso. Sie wissen, wie man Dinge optimiert. Sie können Dinge mit weniger Ressourcen schneller bauen. Aber was noch wichtiger ist, sie können Projekte erstellen , die einfach zu verwalten sind. Ich hatte also Projekte , bei denen ich einen einzigen farbigen Code in einer Zeile bearbeiten konnte , und die gesamte Website wurde aktualisiert. Hier scheinen wir es mit weit über 15 Dateien zu tun zu haben, vielleicht sogar mit mehr. Nun, noch einmal, interessiert es uns wirklich? Wirkt es sich auf uns aus? Nein, nicht wirklich. Würde es den Kunden interessieren? Nein, natürlich nicht, nicht wirklich. Das sind ein paar zusätzliche Minuten für uns. Vielleicht ein paar zusätzliche Eingabeaufforderungen, aber es ist keine echte Arbeit, weißt du, wir arbeiten nicht wirklich Wir warten nur. Okay, wir müssen wohl noch einmal weitermachen. Aber ich denke, wir sind ziemlich nah am Ende, glaube ich. Ja, Nachricht schnell vorspulen. Und ja, lass uns alles auf GitHub pushen. Das macht es natürlich automatisch, also ist das super cool. Das ist die Macht, Dinge richtig einzurichten. Das kann ich nicht genug betonen. Ich bin mir sicher , dass Sie nicht so begeistert waren, all diese Tools zu installieren , um all diese MCPs und so einzurichten. Aber ja, es zahlt sich aus. Und es sieht so aus, als wäre es fertig. Sie könnten sich die Website ansehen und sie aktualisieren, aber die Änderung wird offensichtlich nicht sofort wirksam, da sie auf einem Server live ist. Sie ist live im Internet. Gehen wir also zurück zu Versell und sehen uns den Rechnungsstatus an. Nachdem Sie es richtig installiert haben, besteht im Allgemeinen eine sehr gute Chance, dass es nicht fehlschlägt Es ist sehr wahrscheinlich, dass es immer läuft solange Sie keine gravierenden größeren Änderungen vornehmen. Jetzt dauert es ungefähr die gleiche Zeit, 30 bis 50 Sekunden zu erstellen. Aber ja, insgesamt denke ich, dass es grünes Licht bekommen wird. Und ja, hier ist es. Schauen wir uns die Website an. Und ja, es ist rot. Um fair zu sein, es ist nicht nur rot. Es sind Rottöne. Ich könnte also möglicherweise verstehen, warum es so lange gedauert hat. Aber ja, eine Aufforderung, ein paar wenige sind weiterhin fair, und wir haben eine signifikante Änderung an unserem Design vorgenommen . Und es ist alles live. Um fair zu sein, der tolle Text scheint immer noch da zu sein. Ich bin mir nicht sicher, warum das Model es vergessen hat. Aber ja, lass uns noch einen Screenshot machen. Aber dieses Mal werde ich direkter sein. Ich werde Folgendes sagen. Machen Sie diesen Text 22, zwei, und das ist ein sehr dunkler Farbcode, den ich auswendig kenne. Das garantiert ein solides Ergebnis. Natürlich. Auch wenn es eine kleine Änderung ist, hier ist die Sache. Wir müssen immer noch zu Github wechseln. Versil muss einen weiteren Einsatz durchführen. Idealerweise würden Sie also viel mehr Änderungen vornehmen und dann zu GitHub Aber ja, für den Moment, zu Testzwecken , ist das völlig in Ordnung. Also mach dir keine Sorgen. Insgesamt fliegen wir. Wir sind fertig. Der Text ist jetzt dunkelgrau. Es ist leicht zu lesen und wir haben von Anfang bis Ende eine solide Website. Und natürlich können Sie es auf diese Weise weiterhin aktualisieren. Wenn du damit zufrieden bist, schiebe es auf Github und fertig. Du musst nicht nach jeder einzelnen Änderung pushen , es liegt wirklich an dir. Ja, lass uns eine kurze Pause machen. Nochmals herzlichen Glückwunsch. Das ist ein solider Sieg. 26. Schwimmen im Ozean: Willkommen zurück. Ich möchte auf etwas hinweisen. Als ich gelernt habe, Vibe-Code zu programmieren, habe ich versucht, Projekte zu verwenden, die meiner Art von Entwicklern erstellt wurden Diese Leute waren erfahrene Entwickler mit viel Wissen, aber sie haben einen großen Fehler gemacht Sie haben keinerlei Notizen hinterlassen. Jetzt kann ich in GitHub in meinem eigenen GitHub auf 30, 40 Projekte zugreifen , die sie erstellt haben, aber hier ist die Sache. Ich weiß nichts über sie. Also, als ich anfing, habe ich versucht, sie zu aktualisieren und zum Laufen zu bringen. Sie wurden 2018, 2019 hergestellt, sind also offensichtlich ziemlich alt. Und hier ist die Sache. Kurz gesagt, ich habe versagt. Ich habe viel Zeit, viele Credits aufgewendet, und es war sehr nervig. Und dann habe ich versucht, meinen ersten Tipp zu machen. Also habe ich meinen Ansatz geändert und gesagt: Okay, lass uns meinen ersten Tipp selbst machen. Aber ich werde einen vorhandenen Code verwenden, oder? Also werde ich etwas von Github verwenden. Denken Sie daran, dass einige Projekte öffentlich sind. Das heißt, du kannst sie kopieren und darauf aufbauen, oder? Und ich dachte mir, das würde mir eine Menge Zeit und Mühe und natürlich verschwendete Credits ersparen mir eine Menge Zeit und Mühe und . Aber hier ist die Sache Ich bin wieder einmal gescheitert. Und nicht das Scheitern ist das Problem, sondern wie ich mich gefühlt habe, und das möchte ich mit Ihnen teilen. Hier ist die Sache. Ich habe mit offenen KI-Modellen gearbeitet, Modellen, die zu der Zeit kostenlos waren, vier und 4.1. Und ich habe ständig Bugs ausgemerzt, Teile repariert, Teile für Teile repariert Das Problem war, ich hatte keine Ahnung, ob ich fünf von 50 oder fünf von 50.000 auf BG von 50 oder fünf von 50.000 Ich hatte keinen Bezugspunkt. Es war, als würde ich im Meer schwimmen , mit viel Nebel um mich herum. Ich konnte das Ufer nicht sehen. Ich konnte den Strand nicht sehen. Ich wusste nicht, ob ich in die richtige Richtung schwamm. Vielleicht war ich ein paar Paddel vom Strand entfernt. Vielleicht war ich meilenweit entfernt. Und es war sehr anstrengend, Aufforderung nach der anderen zu benutzen und verschiedene Dinge auszuprobieren Und das ist das Problem. Ich wusste nicht, ob ich näher gekommen bin, ob ich dem Endziel, das Projekt tatsächlich zum Laufen zu bringen , näher gekommen bin. Ich hatte keine Ahnung. Und hier ist die Sache. Wenn Sie nicht weiterkommen und sich nicht sicher sind, können Sie jederzeit ein neues Gespräch beginnen. Du kannst einfach hier klicken. Ein neues Modell wird viel hilfreicher sein. Wenn ich zum Beispiel den Galeriebereich zur Zahnarzt-Website hinzufügen würde , würde ich eine neue Konversation beginnen, indem ich hier klicke. Dies ist die empfohlene Methode. Sie teilen das Projekt in Teile auf. Wir haben jetzt eine Stiftung. Wir haben es veröffentlicht. Cool. Dann möchten wir vielleicht was auch immer hinzufügen, eine Galerie, dann Google Analytics-Tracking, dann vielleicht ein komplizierteres Formular. Okay, nun, diese Dinge können drei verschiedene Konversationen sein. Denken Sie daran, dass Sie dieselbe Menge an Credits verwenden. Es gibt keine Nachteile, aber ein neues Gespräch bedeutet ein neues Modell. Es ist nicht müde von den vorherigen Eingabeaufforderungen. Aber um auf meinen Punkt zurückzukommen: Wenn Sie das Gefühl haben, in einem Meer zu schwimmen und keine Ahnung haben, wo Sie sich befinden, müssen Sie eine Pause einlegen und es sich neu überlegen Sie müssen das Modell wechseln oder ein neues Gespräch beginnen. Ich neige bisher dazu, zu denken dass es viel besser ist, bei Null anzufangen. Habe das Modell, erschaffe alles von Null auf eigene Faust. Aber natürlich können Sie auf ein Projekt verweisen. Auch hier gilt: Verwenden Sie es als Inspiration, und das Modell wird dies zur Kenntnis nehmen. Aber importieren Sie keinen Code, dann wird er hoffentlich ausgeführt. Hoffentlich kannst du darauf aufbauen. Normalerweise wird das nicht funktionieren, besonders zu Beginn Ihrer Karriere. Also mein Rat: Fangen Sie mit kleinen, lustigen Projekten bauen Sie sich dann Ihren Weg nach oben. Ermüden Sie sich nicht, indem Sie zu viel ins Unbekannte schwimmen. Ja, hab Geduld. Aber wenn Sie das Gefühl haben, keine guten Fortschritte zu machen, sollten Sie innehalten und nach einem anderen Weg suchen. 27. Was kommt als Nächstes?: Willkommen zurück. Herzlichen Glückwunsch. Du hast es bis zum Ende geschafft, und das ist eine große Sache. Sie haben nicht nur ein paar Websites erstellt. Sie haben tatsächlich die Fähigkeiten entwickelt, die dahinter stehen. Sie haben gelernt, die KI mit klaren Anweisungen zu steuern, zielgerichtet zu stylen, Dinge besser aussehen und sich besser anfühlen zu lassen Und das, ohne in komplexen Code einzutauchen, ganz ohne jegliche Codierung Am wichtigsten ist, dass du jedes Mal ein bisschen übst, ein paar Eingabeaufforderungen, hier und da ein paar Optimierungen. Und so wird man gut. Nicht durch Zuschauen , sondern durch Üben. Also was jetzt? Also, du musst weitermachen. Du musst dir eine brandneue Idee aussuchen. Du kannst eine Marke kreieren, ein persönliches Projekt. Sie starten einen neuen Ordner und arbeiten einfach. Sie probieren die Eingabeaufforderung aus, fügen sie ein, polieren sie, veröffentlichen sie und machen sie zu Ihrer eigenen. Im Grunde sind Sie bereit, echte Dinge für sich selbst zu bauen , dann für Kunden, vielleicht nur zum Spaß. Aber was auch immer Sie tun, denken Sie daran, Sie müssen Vertrauen haben. Du musst Geduld haben. Und ja, man braucht nicht wirklich einen Entwickler, um schöne Dinge zu bauen. Sie müssen nur wissen, wie man mit diesen Tools spricht. Danke, dass du diese Zeit mit mir verbracht hast. Geh und erschaffe etwas , auf das du stolz bist. sich die Dinge ändern, werde ich den Kurs weiter aktualisieren. Ich werde neue Projekte hinzufügen, ich werde neue Funktionen hinzufügen, mehr Übungen. Aber ja, vorerst musst du weiter üben. Du hast das. Das ist Chris Barron, der sich abmeldet. Ich danke dir vielmals