Informatik wird ein halbes Jahr unterrichtet. Die Note am Ende des Jahres setzt sich aus ⅓ Klassenarbeit, ⅓ Mappe und ⅓ Mündliche Mitarbeit zusammen.
Die Mappe soll als Webseite gestaltet werden. Damit das funktioniert, ohne dass wir zuerst HTML, CSS und Javascript (also die Sprachen von Webseiten) lernen, nutzen wir KI-Tools.
Webseiten bestehen normalerweise aus verschiedenen Dateien. Die Struktur der Webseite ist in einer (oder mehreren) HTML-Seiten abgespeichert. HTML besteht dazu aus Text und aus Befehlen. HTML-Befehle sind immer Tags, also durch spitze Klammern gekennzeichnet; z.B. <HTML>
Wenn ein HTML-Befehl <Name> sich auf einen Bereich bezieht (Anfang und Ende hat), dann wird er mit </Name> geschlossen, z.B. <h1>Überschrift</h1>
Wenn ein HTML-Befehl zusätzliche Informationen braucht, erhält er dies durch Attribute, das sind Bereiche in der spitzen Klammer der Form Name="Wert", z.B. <img src="Bild.jpg">
CSS legt die Form und das Aussehen der HTML-Strukturen fest. Das kann alles sein, von Schriftart und -größe über Farben und Ausrichtung und Anordnung, Rahmen und vieles mehr.
Javascript ist notwendig, wenn Webseiten dynamisch reagieren sollen, also auf Mausklicks (oder Bewegungen oder Tastaturbefehle oder Handybewegungen oder anderes) reagieren sollen.
Webseiten benötigen fast immer zwei beteiligte System: Den Server und den Client. Der Server ist der Rechner, auf dem die Daten liegen. Dieser wird im Netzwerk über eine URL angesteuert. Darüber werden Daten untereinander ausgetauscht. Auf dem Server liegen die HTML/CSS und Javscript-Daten (wie auch Bilder, Videos, etc) so dass die meisten Daten vom Server zum Client fließen. Der Client stellt meist nur Anfragen, aber auch Informationen, die in Formulare eingetragen werden, oder hochgeladene Dateien fließen in die andere Richtung.
Auf dem Client befindet sich eine geschützte Umgebung, Server können hier keine beliebigen Programm ausführen. Das dient zum Schutz, damit man gefahrlos im Internet surfen kann, ohne, dass alle Daten des Rechners sofort bereitstehen. Auf dem Client können nur Javascript Programme laufen. Das optische Design von Webseiten bezieht sich also auf den Client.
Auf dem Server können beliebige Programme laufen. Hier muss der Provider, also der Betreiber des Servers für Sicherheit sorgen. Den Betrieb einer Seite im Internet nennt man Hosting, und Backup-Konzepte gehören zu einem Hosting.
Wenn das so kompliziert ist, wie können wir das dann selber machen? Dabei hilft ein Open Source-Programm:
Hier können wir auch die komplette Client-Server-Struktur abbilden, indem wir die Erweiterung
als Erweiterung einbinden. Mit dem Knopf "Erweiterungen" in Visual Studio Code geht das einfach. Man kann sich Webseiten auch ohne einen Server ansehen (deswegen oben nur "Fast immer"), aber dann nutzt der Browser nicht das http://, sondern das file:// Protokoll. Auch wenn das manchmal gleich aussieht, gibt es damit öfters Probleme: Über das File-Protokoll ist man nicht in einer geschützten Umgebung, dann kann man z.B. private Bilder einbinden, die bei der Veröffentlichung der Webseite verschwinden. Die zweite Erweiterung ist
Dies ist eine Schnittstelle zu einer Künstlichen Intelligenz (Chatbot/KI). Phind ist aufs Programmieren spezialisiert. Man kann damit beliebigen Code bekommen und sich bei der Fehlersuche unterstützen lassen. Damit habe ich diese Seite geschrieben. Man muss sich allerdings mit einer e-Mail-Adresse anmelden, ich habe einfach die IServ-Adresse genutzt.