Transkripte
1. Einführung in den Kurs: Willkommen zum Kurs Launch Your Website with
GitHub Pages. Ich bin Anna Pretoris,
eine IT-Freelancerin und ehemalige
Informatiklehrerin Und in diesem Kurs werde ich Sie durch eine
der einfachsten und
effektivsten Möglichkeiten
führen der einfachsten und
effektivsten Möglichkeiten Ihre
allererste
Website online zu veröffentlichen Wenn Sie jetzt bereits
eine Website oder ein Projekt zur Bereitstellung
bereit haben , sind
Sie hier genau richtig. Sie benötigen lediglich einen Computer mit
Internetverbindung, mehr nicht. GitHub Pages ist jetzt kostenlos, schnell und ideal für Anfänger, die eine
persönliche Website, ein
Portfolio oder ein Projekt
mit Zuversicht veröffentlichen
möchten . In diesem Kurs
lernst du nun, wie Github funktioniert, wie GitHub Pages Websites hostet und wie du deine Website
unter deinem Benutzernamen dotgigub dot veröffentlichst Jetzt werde ich Sie Schritt für Schritt
durch alles führen und jedes
Konzept auf klare und
einfache Weise
erklären, damit Sie sich bei dem, was Sie tun,
immer sicher fühlen Sie werden lernen, wie
Sie Ihre Dateien hochladen,
Ihr Projekt verwalten, Aktualisierungen vornehmen und dafür sorgen, Ihre Website am
Leben bleibt
und organisiert bleibt. Jetzt
beinhaltet jede Lektion
praktische Übungen, um Ihr
Verständnis im Laufe der Zeit zu vertiefen. Und am Ende des Kurses wissen
Sie nicht nur, wie
Sie Ihre Website veröffentlichen,
sondern auch, wie Sie sie pflegen und
jederzeit verbessern können. Sobald Sie den Bereich
Projekte und Ressourcen erreicht haben, werden
Sie alles
zusammenstellen, indem Ihr eigenes Abschlussprojekt
erstellen,
eine Live-Website, die personalisiert,
funktionell und bereit
ist , mit der Welt
geteilt zu werden. Dieser Kurs umfasst
praktische Laborübungen und acht Schwerpunktlektionen
,
die Sie in einem angenehmen
und gleichmäßigen Tempo durch den Prozess führen sollen . Ich bin hier, um die Webentwicklung und -bereitstellung einfach
und unterhaltsam zu gestalten, unabhängig von Ihrem Erfahrungsniveau. Vertrauen Sie mir also, Sie sind in guten Händen und wir
sehen uns auf dem Kurs.
2. Erstellen Sie ein kostenloses GitHub-Konto: Hallo zusammen. Willkommen
zur nächsten Vorlesung, die sich auf die
Erstellung eines kostenlosen GitHub-Kontos konzentrieren wird . Nur um Ihnen einige
Informationen auf GitHub zu geben: GitHub ist im Wesentlichen eine Website, ist im Wesentlichen eine Website die
Git-Repositorys online hostet Es ist im Grunde
wie Cloud-Speicher und soziale Netzwerke für Code. Was Sie also mit GitHub
tun können, ist dass Sie Ihre
Projekte sicher speichern können. Sie können sie auch mit
anderen teilen und mit Teams
auf der ganzen Welt
zusammenarbeiten. In Ordnung. Also lass uns weitermachen
und anfangen. Sie möchten zunächst zu github.com
gehen. Dann kannst du sagen, melde dich an. Und dann kannst du dich bei GitHub
anmelden. Sie können entweder mit Google
weitermachen. Wenn Sie Ihr Google-Konto haben, oder Sie können manuell ein E-Mail-Passwort,
einen Namen und Ihre Region
eingeben . Sie können auch entscheiden, ob Sie die
E-Mail-Einstellungen so einrichten möchten, dass E-Mail-Einstellungen so einrichten möchten gelegentlich
Produktupdates und Ankündigungen
erhalten, und Sie können
Ihr Konto erstellen, oder? Also, was ich
hier tun werde, ist, diese Felder hier
auszufüllen und es manuell zu machen, und dann werde ich ein Konto
erstellen. Also lass uns weitermachen und das
einrichten. In Ordnung. Also habe ich
hier
einige Basisinformationen eingegeben , nur auf manuelle Weise. Und jetzt werde ich sagen, Konto erstellen. Die Überprüfung wird einen
Moment dauern. Okay. Und natürlich müssten Sie
normalerweise auch ein Rätsel lösen und von diesem Punkt aus
weitermachen. Warten wir also einfach, bis der
Prozess hier abgeschlossen ist, und dann können wir weitermachen
. In Ordnung. Jetzt, da unser Browser verifiziert
wurde, können
wir unser Konto entweder
über ein visuelles Rätsel
oder ein Audiorätsel verifizieren . Also werde ich jetzt mein Konto verifizieren und wir sehen uns dann
in der nächsten Phase. Ordnung, also nachdem Sie Ihr Konto
verifiziert
haben, müssen Sie dann
Ihre E-Mail-Adresse verifizieren Also gehe ich zu einer Beispiel-E-Mail-Adresse
, die ich hier habe, und werde sie einfach neu laden Hier haben wir einen
Startcode, den wir verwenden können. Ich wollte
es beenden. In Ordnung. Wir können jetzt sehen, dass
unser Konto
erfolgreich erstellt wurde , und jetzt
können wir uns anmelden, um fortzufahren. Jetzt
möchten Sie nur noch
Ihren Benutzernamen oder Ihre
E-Mail-Adresse eingeben und dann hier
ein Passwort eingeben, das Sie zuvor bei der Einrichtung Ihres Get
up-Kontos
festgelegt haben . Ordnung. Sobald Sie Ihre Zugangsdaten
eingegeben haben, können
Sie einfach „
Anmelden“ sagen. Und da haben wir's. Jetzt befinden wir uns auf unserem
GitHub-Dashboard wo wir
unser Repository erstellen und loslegen können . Das war's für dieses Video. So können
Sie
ein kostenloses GitHub-Konto erstellen . Jetzt bin ich natürlich
ausführlicher
darauf eingegangen, um sicherzustellen, dass Sie GitHub mit allen erforderlichen Schritten
so einfach wie möglich einrichten können . Wenn Sie
sich nun entscheiden, mit
Google fortzufahren, anstatt
all die manuellen Schritte wie ich durchzuführen, können
Sie
das natürlich Google fortzufahren, anstatt all die manuellen Schritte wie ich durchzuführen, auch tun. Aber ich
wollte einfach so sein, wie ich kann, aber so
kannst du weitermachen und dein kostenloses GitHub-Konto
einrichten.
3. Erstellen eines GitHub-Repositorys: Hallo zusammen und willkommen
zur nächsten Vorlesung, die sich auf
die
Erstellung eines Github-Repositorys konzentrieren wird . Sie fragen sich wahrscheinlich,
was das GitHub-Repository ist? Ein GitHub-Repository
ist einfach wie ein Ordner auf Github, in dem sich
Ihr Projekt befindet, und dieser wird
Ihren Quellcode
und all Ihre Codedateien enthalten . Am einfachsten kann man es sich als eine Projektbox
vorstellen , in
der
alles, was mit
Ihrem Projekt zu tun hat,
gespeichert und organisiert wird. Heutzutage bezeichnen die
Leute
GitHub-Repositorys normalerweise als Repos Wenn du jemals den Begriff
Repos hörst, der häufig verwendet wird,
synchronisiere das GitHub-Repository
in diesem Kontext Okay, lassen Sie uns weitermachen
und unser Repository erstellen. Sie können hier sagen, dass Sie ein
Repository erstellen. Dann siehst du es auf
der linken Seite, lass es mich hier ein bisschen zoomen. der linken Seite
siehst du den Benutzernamen, den du mit
deinem GitHub-Konto verknüpft hast, und dann musst du hier
einen Repository-Namen angeben. Du kannst weitermachen und
hier klicken und ich nenne dieses Beispiel Okay. Und das wird mein
Repository-Name sein,
Beispiel, wir können es als Beispiel
Sample Repo nennen Dann kannst du hier eine
Beschreibung geben. Also werde ich
es sehr einfach halten. Ich werde nur
Portfolio-Anwendung sagen. Sehr einfach. Und dann können Sie hier die
Sichtbarkeit wählen. Wenn Sie also weitermachen und
Ihren Quellcode in
dieses Repository übertragen , das hier
als Beispiel-Repo bezeichnet wird, können
Sie
den Status entweder auf öffentlich setzen, was bedeutet, dass natürlich jeder
auf Ihr Repo zugreifen und es sich ansehen
kann auf Ihr Repo zugreifen und es sich ansehen Das wird öffentlich sein, oder Sie können es auf privat setzen der Öffentlichkeit kann also jeder
im Internet Ihr Repository sehen. Und im privaten Modus
wählst du aus, wer dieses Repository sehen und
sich darauf einschreiben kann .
Die Wahl liegt bei dir. Nun, in öffentlichen Fällen ist
es angemessen, wenn
Sie eine Reihe von
Portfolio-Websites haben ,
die Sie möglichen
Mitarbeitern
präsentieren möchten und so, oder wenn Sie nur ein bisschen Ihre
eigenen persönlichen Tests durchführen und nicht mit etwas umgehen, das
Sie als sensibel bezeichnen könnten Ich würde sagen, das
wäre meiner Meinung nach
eher im öffentlichen
Szenario. Alles, was
natürlich, sagen wir,
Teil Ihrer eigenen
Organisation ist oder etwas, natürlich privat ist, wie wir hier
sehen können, sollte privat sein. Es kommt also nur
darauf an, was Sie
gerne machen würden. Wenn Sie nicht möchten, dass es jemand
sieht und Sie nicht Absicht
haben,
Ihr Projekt
zu
zeigen , müssen Sie es natürlich auf privat setzen. Wenn Sie
beabsichtigen, es zu präsentieren, können
Sie es öffentlich zugänglich machen Also werden wir es
einfach halten und vorerst nur
öffentlich sagen Dann können Sie eine Readme-Datei hinzufügen
. Nun, ich füge das immer
gerne hinzu, und eine Readme-Datei ist einfach sehr nützlich, wenn sich jemand
nur einen kurzen Überblick über
Ihr Repository oder Ihr Projekt verschaffen möchte sich jemand
nur einen kurzen Überblick über , sollte ich sagen, nur um einige Informationen über
Ihr Projekt zu
sehen und darüber, was Sie verwenden und worum
es geht. Nur ein einfacher Überblick. Im Grunde wie ein Textdokument. Sie können hier auch eine
G-Ignorierdatei hinzufügen, was sehr nützlich ist,
wenn
Sie beispielsweise mit
Umgebungsvariablen arbeiten und diese DENV-Datei ignorieren
möchten , die
Umgebungsvariablendatei handelt Dann können Sie auch eine Lizenzierung hinzufügen
, wenn Sie
Ihren Code auf irgendeine Weise lizenzieren gibt es einige Optionen für Sie Hier gibt es einige Optionen für Sie, die Sie auch nutzen können. Aber wir werden
es hier einfach ganz einfach halten .
Stellen Sie sicher, dass Sie Ihren Repository-Namen,
eine Beschreibung und die Sichtbarkeit hinzugefügt
haben . Ich mache es öffentlich und du hast die Option „Read Me“
hinzugefügt. Dann kannst du einfach sagen, Repository
erstellen. Da haben wir's. Wir können jetzt sehen, dass es öffentlich zugänglich ist und wir können jetzt sehen, dass
wir alle startklar sind. Wir können die
Readme-Informationen
hier mit dem Beispiel-Repo
und der Beschreibung
, die wir hinzugefügt haben, sehen hier mit dem Beispiel-Repo und der Beschreibung
, die wir hinzugefügt haben, Das ist alles, was Sie wissen
müssen. Sie können
weitermachen und ein
GitHub-Repository erstellen
4. Konfigurieren von GitHub Desktop und Synchronisierung unseres Quellcodes: Hallo zusammen und willkommen
zur nächsten Vorlesung, die sich auf
die Konfiguration von
GitHub Desktop und
später auch auf die Synchronisation
unseres Quellcodes
konzentrieren wird GitHub Desktop und
später auch auf die Synchronisation
unseres Quellcodes Lass uns anfangen.
Als Erstes möchten Sie eine Google-Suche
nach GitHub Desktop durchführen,
zu der Sie
auf den entsprechenden Link klicken können
, der
GitHub Desktop herunterladen
lautet ,
zu der Sie
auf den entsprechenden Link klicken können
, . Um Ihnen hier
etwas Klarheit zu verschaffen, können
Sie entweder für Windows
herunterladen oder nach unten scrollen
und für macOS herunterladen. Die Optionen sind für Sie da. Ich möchte
Ihnen nur ein wenig
Klarheit darüber geben , was
GitHub Desktop ist. Es handelt sich im Wesentlichen um eine kostenlose
App, die, wie Sie sehen, sowohl von
Windows- als auch von MacOS-Computern verwendet werden
kann. Sie bietet Ihnen eine sehr
einfache visuelle Oberfläche, Sie bietet Ihnen eine sehr
einfache visuelle Oberfläche um GitHub zu verwenden, ohne Befehle in
das Terminal
eingeben zu müssen, wenn Sie Git nur nativ verwenden würden Lass uns weitermachen
und es herunterladen. Ich bin auf Windows. Ich werde
es für Windows herunterladen. Es wird einen
Moment dauern, geben Sie ihm etwas Zeit. Und sobald es heruntergeladen ist, können
wir weitermachen und darauf klicken. Was dann passieren wird, ist die GitHub Desktop-Anwendung selbst installiert wird. Es ist also sehr
intuitiv. Wir müssen
es nicht drücken oder irgendetwas tun. Wie Sie hier sehen können, wird GitHub
Desktop installiert und es wird
gestartet, sobald es fertig ist. Wir müssen nur warten. Normalerweise können Sie
unter
Windows den
Fortschritt hier unten sehen . Wie Sie sehen können,
wird es
mit dem kleinen Fortschrittsbalken abgeschlossen . Also müssen wir nur
darauf warten. Okay. In Ordnung, los geht's. Also willkommen auf GitHub Desktop. Was wir
jetzt tun können, ist,
weiterzumachen und zu entscheiden, wie
wir vorgehen wollen. Richtig. Sie möchten sich
also bei github.com anmelden Okay. Und wir wollen unsere Sitzung
verifizieren. Da wir also bereits angemeldet sind, können wir, wie Sie sehen,
weitermachen und Weiter sagen. Und wir möchten
GitHub Desktop jetzt mit
unserem Wie kann ich sagen mit unserem Benutzer autorisieren unserem Wie kann ich sagen mit unserem Benutzer Zu unserem Benutzernamen können
Sie also unseren Benutzernamen für unser
Konto sehen Und hier können wir den
Zugriff auf die Repositorien kontrollieren. Standardmäßig ist
es also öffentlich und
privat und Sie können hier weitere
Informationen dazu lesen Und wir werden GitHub Desktop einfach
autorisieren. Und dann können wir einfach sagen, öffnen es wird
hierher zurückgeleitet und hier haben wir es Jetzt kannst du hier sehen,
dass wir Git konfigurieren wollen. Jetzt nur ein bisschen Klarheit über Git. Git ist im Grunde ein
Versionskontrollsystem und das wird dir
helfen,
Änderungen in deinem Quellcode nachzuverfolgen , verschiedene Versionen
eines Projekts zu
speichern und so weiter. Wir möchten meinen
GitHub-Kontonamen und meine
E-Mail-Adresse verwenden , um
Git zu konfigurieren . Wir
werden sehen, dass es hier automatisch eingestellt wird, und dann kannst du einfach „
Fertig“ sagen. Und da haben wir es. Jetzt haben wir
das alles eingerichtet,
und wir können hier auch
unser Repository sehen, bei dem es sich natürlich um
das Repository
handelt, das wir zuvor erstellt haben und
das Sample Repo
heißt Also können wir das
jetzt schließen. Also gut, da haben wir es. Wir können auch sehen, dass es
jetzt auf unserem Desktop ist, GitHub Desktop, so wie es sein sollte, und sind bereit,
mit dem nächsten Prozess fortzufahren. Also gut gemacht, du hast es
erfolgreich konfiguriert, GitHub Desktop auf deinem System. Als Nächstes
wollen wir
natürlich unseren Quellcode synchronisieren Richtig. Als
Nächstes wollen wir unser Repository
klonen. Klonen eines Repos oder
Repositorys bedeutet eine vollständige Kopie
eines GitHub-Repositorys, einschließlich aller Dateien oder
allem, was sich
derzeit darin befindet, auf unseren Computer herunterzuladen, damit wir lokal
daran arbeiten können Wie wir sehen können, haben wir hier nur eine einfache Readme-Datei Das ist alles, was wir haben. Wir möchten also
unser Repository auswählen , wie
wir hier sehen können. Dann können wir klonen sagen dann möchten Sie
den Pfad festlegen , in dem
es sich befinden soll, Klon zwei. Wie wir sehen können, ist dies in der URL
automatisch ausgewählt. Wenn es nicht ausgewählt ist, können
Sie es auswählen. Und wir können sehen, dass
dies die Repository-URL
oder der GitHub-Benutzername und das entsprechende
Repository sein wird, und dies wird
der Pfad sein , in dem der zweite Klon gespeichert
wird. Du kannst „Wählen“ sagen, und ich wähle
hier den Desktop und sage „Ordner auswählen“, sodass der Ordner auf meinem Desktop angezeigt wird. Und dann sage ich Klon. Jetzt klont es
Sampoepo, los geht's. Wir können sehen, dass wir uns
derzeit in Sam Por Repo befinden. Wir können sehen, dass wir beabsichtigen
, in unsere Hauptzweige vorzudringen. Wir können hier alle Dateien sehen , die wir geändert haben,
alle lokalen Änderungen, und hier können wir unsere Änderungen übernehmen und ihnen
eine Beschreibung hinzufügen Wenn ich das jetzt minimieren würde, kann
ich jetzt auf meinem Desktop sehen, ich habe Sam Prepo und
wenn ich das öffne, können
wir sehen, dass wir natürlich
die ReadMe-Datei
haben , und natürlich die
Punkt-Git-Datei nicht für dich angezeigt, aber weil
ich sie auf meinem PC so eingestellt habe, dass
alle versteckten Dateien angezeigt werden, wird
sie standardmäßig angezeigt. Das ist nur etwas, das man im
Hinterkopf behalten sollte. Aber wir haben das
Read-Refol und
das ist natürlich die
Standarddatei, die wir
hier sehen können, die von Gitub selbst geklont wurde Als Nächstes möchten
Sie unseren Quellcode synchronisieren . Wie wir hier sehen können, nenne
ich sozusagen mein Projekt Und ich habe das
in Visual Studio-Code geöffnet und habe drei
Dateien: Index Dot HML, Script Dot JS und Style Dot CSS Das wird Ihnen nur etwas Klarheit
über den Umfang der Anwendung
geben , mit
der wir arbeiten Es ist also eine sehr einfache
Frontend-Anwendung mit einer HTML-, CSS- und JavaScript-Datei, die
alle miteinander verknüpft sind Denken Sie also
hier daran, wenn Sie
mit der Anwendung, die Sie bereitstellen
möchten
,
ein bisschen höher hinaus wollen mit der Anwendung, die Sie bereitstellen
möchten
, . Behalten Sie das also
einfach im Hinterkopf. Richtig. Als Nächstes
möchte ich all diese Dateien in das
Repository hier verschieben. Also werde ich das
Beispiel-Repo öffnen. Und dann werde ich auch mein Projekt öffnen. Und was ich tun möchte, ist diese zur Seite zu
legen. Ich werde nur die Dateien
, die ich habe,
hierher verschieben. Ich werde
sie hervorheben und sie einfach
in mein Repository verschieben , das ich
klone, das als Beispiel-Repo bekannt ist Sie können das schließen
und das schließen. Wenn wir jetzt zu GitHub Desktop gehen, können
wir jetzt sehen, dass
es Änderungen gibt. Hier wurde also festgestellt
, dass drei Dateien geändert
wurden. Mit anderen Worten, drei
Dateien wurden
in den Beispiel-Repo-Ordner verschoben , also Index bei HML, Script Dot JS und Star Dot CSS Wie Sie sehen können, können wir
alle Anpassungen hier sehen. Das Plus-Symbol hier
zeigt also natürlich
Dinge an, die
hinzugefügt wurden, und natürlich wird das Minuszeichen angezeigt, wenn
Dinge entfernt wurden. Okay, richtig. So
können wir weitermachen und unseren
Quellcode effektiv
synchronisieren Jetzt ist es also Teil
unseres Repositorys und wir sind alle startklar Als Nächstes
möchten wir sicherstellen, dass die möchten wir sicherstellen Änderungen hier in unserem Repository
hier auf Github selbst
widergespiegelt werden . Also wollen wir zunächst
das folgende Feld hier ausfüllen und wir wollen diese Dateien im Wesentlichen in
unseren Hauptzweig hier
übernehmen , damit sie sichtbar sind. Also werde ich hier einfach einen Namen
hinzufügen. Also normalerweise wird das
der Name dessen sein , was du tust. Also hier, ich sage hier
nur Dip Initial. Ich nenne das
erste Bereitstellung. Jetzt können Sie entscheiden, als was
Sie das einstellen möchten. Normalerweise, wenn Sie etwas
ändern, vielleicht einen Index oder eine HTML-Datei, sagen
wir, Sie ändern
die Überschrift oder Sie ändern den Hero-Bereich, fügen
Sie das einfach
als Haupttitel
für das hinzu, was Sie ändern, und dann fügen
Sie eine Beschreibung mit weiteren Details hinzu Hier wird dies
die erste Bereitstellung sein. Dies ist die Anwendung hier. Die Beschreibung hier ist,
ich werde sagen, eine
Beispielanwendung mit einer hinzugefügten HML-, CSS- und JS-Datei. Okay. Und dann können wir diese drei Dateien in unseren Hauptzweig übertragen, also können wir Commit sagen. Und wenn Sie dann mit allem
zufrieden sind, können
Sie das
jetzt in Ihr GitHub-Repository verschieben . Es wird zum Ursprung
gepusht, der sich in unserem Hauptzweig befindet. Okay, da haben wir's.
Und wie Sie sehen können, gab es in letzter Zeit keine
Änderungen, also können wir loslegen. Gehen wir zurück zu unserem Repository. Lass uns die Seite aktualisieren. Und wie Sie
jetzt sehen können, hat unser Repository jetzt die Indexpunkt-HTML-Datei, den Skriptpunkt gsle und unsere
Style-Punkt-CSS-Datei,
und wir können sehen, dass
wir diesen Commit vorgenommen haben Und wie Sie sehen können, war der Name
hier die Erstbereitstellung. Das war also der Name unserer Commit-Überschrift, und dann können wir die
Beschreibung hier unten sehen und sehen, was wir hinzugefügt haben und auch,
ob etwas entfernt wurde. Und unser Benutzer hier
hat
laut unserem Benutzernamen diese Datei übernommen und wir
können das Datum sehen, an dem das passiert ist. Der letzte Commit und wir können die Informationen
auch
hier sehen. Erster Einsatz.
So können wir GitHub Desktop konfigurieren und
auch
unseren Quellcode
entsprechend synchronisieren . Das ist das
5. Starten Sie Ihre erste Website: Und willkommen zum nächsten Vortrag
, der sich
auf den Start unserer ersten Website konzentrieren wird . Also lasst uns anfangen. Gehen wir nun davon aus
, dass Sie
Ihren Quellcode synchronisiert haben , lassen Sie uns weitermachen und GitHub Pages
verwenden Sie möchten also
sicherstellen, dass Sie sich
im ausgewählten Repository befinden im ausgewählten Repository Dann können wir zu den Einstellungen gehen. Dann sehen Sie auf der linken Seite einige Optionen. Sie möchten nach unten scrollen,
bis Sie Seiten sehen, und Sie möchten diese Option
auswählen. Nun, um Ihnen hier einen
Einblick zu geben. GitHub Pages ist im Grunde ein kostenloser Webhosting-Dienst
, der von GitHub angeboten wird und mit dem Sie
Ihr Projekt wie eine Website
direkt aus Ihrem
GitHub-Repository
in eine öffentliche Live-Webseite verwandeln können Ihr Projekt wie eine Website in eine öffentliche Live-Webseite . Was wir also tun können, ist hier
unter Build end Deployment sicherzustellen, dass es so eingestellt
ist, dass es von einem Branch aus bereitgestellt wird, was eine Standardoption ist. Dann möchten Sie
es aktivieren. Wie wir sehen können,
heißt es, dass GitHub Pages derzeit deaktiviert
ist. Wir möchten unten
eine Quelle auswählen, um GitHub Pages
für dieses Repository zu aktivieren. Sie möchten also auf das
Drop-down-Menü klicken und es an
den Hauptzweig senden. Es wird
im Stammverzeichnis sein, und dann willst du Speichern sagen. Dann kannst du Speichern sagen. Wir können sehen, dass der Quelltext von GitHub Pages gespeichert wurde. Dann können wir zum Code zurückkehren. Und dann, wie Sie hier sehen können, steht dieses gelbe Symbol noch aus. Also
lass uns das auswählen. Und wir können hier sehen
, dass es Seiten,
Build und Deployment heißt , sodass
wir Details auswählen können. Und hier können wir
sehen, dass der Build für die Bereitstellung unserer Anwendung
gestartet wurde . Es wird also gebaut, alles für uns
eingerichtet und unseren
Quellcode für die Bereitstellung kompiliert. Es wird
einige wichtige Phasen durchlaufen. Wie Sie hier sehen können, gibt es
eine Checkout-Phase, eine Bauphase und natürlich auch
eine Artefakt-Phase Wie Sie sehen können, ist
es ziemlich schnell. Da ist also die Bauphase. Dann wird es
den Abschnitt „Build-Status“ für den Bericht erstellen danach unsere Anwendung
bereitstellen. Okay, wir können sehen, dass es sich jetzt unter dem Bericht Build-Status befindet, sodass wir den Job einrichten, den Build-Status
melden und den Job
abgeschlossen haben können. Jetzt tauchen wir hier natürlich tief
in GitHub Pages
ein. Nur um dir einen kleinen
Einblick zu geben ist alles, was
in dieser Phase hier passiert, es ist das Erstellen unseres Quellcodes, Kompilieren, Vorbereiten und dann wird
es ihn bereitstellen Wie Sie sehen können, war jeder
Job hier ein Erfolg. Jetzt können wir zu den Einstellungen zurückkehren. Dann können
Sie hier auf der linken Seite zu den Seiten gehen. Und hier kannst du sehen, dass unsere Website jetzt in
deinem nächsten Bereich live ist, und wir können unsere Seite besuchen oder du kannst mit der rechten Maustaste auf
Link im neuen Tab öffnen klicken. Wir können sehen, wann sie zuletzt
bereitgestellt wurde und von welchem Benutzer, und Sie können auch die Veröffentlichung
Ihrer Website rückgängig machen Also haben wir das alles eingerichtet. Also habe ich meine Beispiel-Website. Ich möchte das jetzt anklicken und in einem neuen Tab
öffnen. Und hier habe ich meine
Website fertig eingerichtet und einsatzbereit. Hier haben wir es. Es ist eine
sehr einfache Anwendung, wie wir hier sehen können,
und sie hat auch hier
ein bisschen Licht im Dunkelmodus, das ist ganz nett, aber da hast du
sie und du kannst die folgende UrrAlm auf deine Website
zugreifen, die dir natürlich zur Verfügung gestellt wird Und da hast du es. So
können Sie sich absichern und Ihre
allererste Website starten. Da hast du es also. ist
hier die URL dafür. Natürlich können Sie das mit jedem
teilen, überall teilen, und das war's. So einfach
ist es, sich abzusichern und Ihre Website
einzurichten und kostenlos zu
starten Das war's
natürlich.
6. Bearbeiten von Aktualisierungen Ihrer Website: Hallo zusammen und willkommen
zur nächsten Vorlesung, die sich mit dem Umgang mit
Aktualisierungen Ihrer Website befassen wird . Nehmen wir zum Beispiel an, Sie möchten etwas
an Ihrer Anwendung ändern. Hier heißt es also, Hol Mino, wir entwickeln Propresion über
sauberen Code Nehmen wir an, ich möchte etwas
ändern,
etwas, das mir nicht gefällt Also gehe ich zu
Visual Studio-Code
und
ändere einfach den Ordner, und
ändere einfach in dem ich mich befinde. Das Repo hier
heißt also Beispiel-Repo. Also sage ich einfach Datei, Ordner
öffnen, und ich werde
etwas für Repo öffnen Das kann in jedem
Coding-Editor sein,
den Sie haben Gehen wir zu Index on HML
und schauen wir uns an, was
ich ändern möchte Ich möchte das hier ändern. Ich wollte meinen vollen Namen eingeben. Wie Sie sehen können, heißt
es derzeit nur Hallo, ich bin Anu, dann bin ich hier ein Webentwickler, der sich für sauberen Code
und Design
begeistert . Natürlich kann
ich das ändern. Ich kann sagen, ein Webentwickler, sauberen
Code und Design
begeistert. Hier werde ich Cloud in SZSt
sagen. Und ich sage hier und
ein Cloud-Enthusiast. Okay, sehr einfach. Das
werde ich mir sparen. Und es wird natürlich mit der
Quellcodeverwaltung
synchronisiert, natürlich mit GitHub Desktop Und jetzt, mit diesen Änderungen, kann
ich zu GitHub Desktop gehen
und wir können sehen, dass wir eine Änderung
vorgenommen haben Dieses gelbe Symbol
hier bedeutet also geändert, und Sie können sehen, dass
ich das DG entfernt habe, und das grüne Symbol hier
ist, was ich hinzugefügt habe. Also hier sage ich einfach
aktualisiert
, wie kann ich sagen ,
die Index-HML-Datei zum Beispiel und eine
Beschreibung hier, ich werde sagen,
füge sie im Nachnamen hinzu und zusätzliche Informationen darüber, was ich bin Also ein Cloud-Enthusiast. Dann kann ich sagen,
eine Datei an Main übergeben, und dann kann ich sie in meinen Hauptzweig verschieben Okay, es wurde
verschoben. Wenn ich jetzt hier zu meinem Repository
zurückkehre, kann
ich einfach mein Repo aktualisieren Und wir können sehen, dass der
Commit hier durchgeführt wurde, der Index auf
HTML
aktualisiert wurde und dass er jetzt nicht abgeschlossen ist, und wir können sehen, dass
er bereits aussteht Es erstellt unseren
Quellcode, kompiliert, stellt
sicher, dass er funktioniert, und
dann wird er bereitgestellt Es wird hier also
ein paar Augenblicke dauern. Natürlich können Sie darauf
klicken und alle
Details
sehen, wie Sie möchten. Und alles, was
wir tun wollen, ist nur zu warten ,
natürlich bleibt die URL dieselbe. Wir können also einfach warten, bis
dies abgeschlossen ist, und dann können wir weitermachen. Also gut, willkommen zurück, wie wir sehen können, ist es jetzt grün. Ich empfehle
Ihnen natürlich, einfach hier zu aktualisieren, und dann
sehen Sie hier das grüne Symbol. Okay, das heißt,
es war ein Erfolg. Jetzt können wir
auf unsere Website gehen und Sie möchten nur Ihre
Webseite neu laden, und los geht's Wir können es in Pretorius sehen, also mein voller Name und
ich bin Cloud-Enthusiast,
sodass wir sehen können, dass das Update berücksichtigt wurde also mein voller Name und
ich bin Cloud-Enthusiast,
sodass wir sehen können, dass das Update berücksichtigt wurde
. In Ordnung. Also da hast du es. Nun, eine andere Möglichkeit
, mit
Updates umzugehen , ist, wenn es hier eine bestimmte Datei
gäbe , die Sie ändern möchten. Nehmen wir an,
Sie können den
Index zur HML-Datei hier
in Ihrem Repository auswählen Und Sie können diese Datei direkt
bearbeiten. Das ist also eine andere
Möglichkeit, es zu tun. Obwohl ich diesen Weg nicht
empfehlen würde, ist
es besser, lieber in einem Code-Editor
weiterzumachen und einfach Ihre Anpassungen vorzunehmen oder in der Datei, in der
Sie sich befinden, nur um diese
Änderungen vorzunehmen und so. Das ist also etwas anderes , das du auch tun kannst, wenn du
nur eine Änderung vornehmen möchtest, aber es ist am besten, sie dort
zu aktualisieren wo immer du deine
Anwendung geöffnet hast,
und
sie dann einfach
mit GitHub Desktop zu pushen, um sie entsprechend mit
deinem Github-Repository zu synchronisieren. Leute. Das war's also für
diesen speziellen Vortrag? Das ist so, dass Sie
Updates an Ihrer Website verwalten können.
7. Erstellen eines eigenen Projekts: Hallo zusammen und willkommen
zur nächsten Lektion, in
der es darum geht, dein eigenes Projekt zu erstellen. Richtig, erstelle dein eigenes Projekt. Jetzt, da Sie über all
diese neuen Fähigkeiten verfügen ,
die Sie erworben haben, ist
es
an der Zeit, all das zu nutzen und
Ihr eigenes Projekt zu erstellen. Was Sie jetzt tun können,
ist,
im Abschnitt Projekt und
Ressourcen
dieses Kurses
weitere Informationen darüber zu im Abschnitt Projekt und
Ressourcen dieses Kurses
weitere Informationen darüber wie Sie
sicherstellen können , dass Sie
das Projekt verfolgen, und dann auch, wie Sie es teilen können,
damit ich es mir ansehen
und mein Feedback hinterlassen kann. Stimmt, Leute. Das
war's für diese Lektion.
8. Vielen Dank!: Hallo, alle zusammen. Und nur
eine letzte Anmerkung von mir, und das ist nur ein Dankeschön, dass Sie sich
für diesen
Kurs entschieden haben. Ich hoffe wirklich, dass es Ihnen geholfen hat aufschlussreiches Wissen
zu erlangen Nochmals vielen Dank,
und ich freue mich sehr, dass Sie sich entschieden haben, sich
mit mir auf diese Reise einzuschreiben Eine weitere Sache, die ich erwähnen
möchte, ist Sie erwägen,
eine Bewertung für diesen Kurs Es wäre sehr willkommen. musst du nicht, wenn
du nicht willst, aber
in meinem Fall ist es immer nützlich, zu versuchen, das
Feedback zu verstehen, das mir
gegeben wird, und zu versuchen, meinen Unterricht
besser zu verbessern. Nochmals vielen Dank und
viel Glück auf Ihrer Reise.