kurse:ef05a-2021:js:start [https://fginfo.ksbg.ch Fachgruppe Informatik der KSBG]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== JavaScript im Browser ======
Im Gegensatz zu NodeJS, das eine eigenständige Programmiersprache wie Python ist, fokussieren wir uns auf JavaScript im Browser. Hauptunterschiede sind der fehlende Zugriff auf Systemfunktionen (wie z.B. Dateien lesen und schreiben), dafür stehen alle Browserfunktionen wie die Darstellung und Formatierung von Text und Bildern zur Verfügung.

===== Zutaten =====
  * Browser
  * TextEditor (z.B. NotePad++, auf jeden Fall etwas mit UTF-8 Support).
  * evtl. WebServer (aus Sicherheitsgründen laden die Browser aus javascript heraus keine dynamische Daten via ''file''-Protokoll).
===== Lerneinheiten =====
  * [[.:intro|Intro]]
  * [[.:helloworld|Hello World]]
  * [[.:jsbasics|Grundlegendes JavaScript]]
  * [[.:htmlmanip|HTML Manipulationen]]
  * [[.:utf8|Zeichencodierung, ASCII, Unicode und UTF8]]
  * [[.:dynload|Daten dynamisch nachladen]]


  * [[.:webserver|Daten auf den Webserver laden]]

===== Empfehlenswerte Webseiten, Beispiele =====
  * Weitere Beispiele: https://fginfo.ksbg.ch/~ivo/js/
  * https://www.w3schools.com/js/default.asp
  * https://developer.mozilla.org/en-US/docs/Web/JavaScript
  * Stackoverflow (Achtung: Datum des Posts beachten, für Lösungen, die älter als 10 Jahre sind, gibt es heute wohl einfachere Varianten).

===== Videos =====
  * Wie funktioniert JavaScript genau im Browser? 
    * ein bisschen älter, einfacher: https://www.youtube.com/watch?v=8aGhZQkoFbQ
    * ein bisschen moderner, tiefer: https://www.youtube.com/watch?v=cCOL7MC4Pl0
===== git unter Windows einrichten =====
Hilfe gibt es z.B. hier:
  * Erst mal git installieren: https://git-scm.com/downloads
  * https://medium.com/devops-with-valentine/2021-how-to-set-up-your-ssh-key-for-github-on-windows-10-afe6e729a3c0 

===== Projektideen =====
  * Projekt-Repository: https://github.com/ivo-bloechliger/js-projekt
  * Kleines Spiel im Browser, z.B. TicTacToe, 4-gewinnt o.ä.
  * Demo für Zeichenerkennung auf der Smartwatch
  * Generator für ein Labyrinth
  * Pac-Man
  * 10-Fingersystem Trainer.
  * [[.:projekte:jumpnrun|Pong]]
  * [[.:projekte:jumpnrun|Kleines Jump'n Run]] (à la Google Dinosaurier, wenn das Netz streikt)
  * [[.:projekte:memory|Memory]]
  * [[.:projekte:calculator|Taschenrechner]]
  * [[.:projekte:snake|Snake]]
  * [[.:projekte:mouseevents|Maus-Interaktion]]
  * [[:.projekte:wordle|Wordle]]
  * [[:.projekte:rechentrainer|Rechentrainer]]