* HTML
  * CSS (Cascade Style Sheet)
  * JS (JavaScript)

  * Browser loop -> Video

In VSCode die Extension «Live Server» installieren.

[[https://fginfo.ksbg.ch/dokuwiki/doku.php?id=lehrkraefte:blc:informatik:ffprg1-2024:htmlinteraction|erste HTML interaktion]]


[[https://fginfo.ksbg.ch/dokuwiki/doku.php?id=lehrkraefte:blc:informatik:ffprg1-2024:cheat-sheet|Cheat-Sheet]]


====== Temperatur-Rechner ======

<code html>
   Grad Celsius <input type="number" id="grad"><br>
   Grad Fahrenheit <input type="number" id="fahrenheit"><br>

</code>

<code javascript>
window.addEventListener('load',function() {
    let grad = this.document.getElementById('grad');
    let fahrenheit = this.document.getElementById('fahrenheit');

    function c2f() {
        let f = Number(grad.value)*1.8+32;
        fahrenheit.value=f;
        console.log(`Die Umrechnung gibt ${f}`);
    }

    grad.addEventListener('input', c2f);

    function f2c() {
        let c = (Number(fahrenheit.value)-32)/1.8;
        grad.value=c;
        console.log(`Die Umrechnung gibt ${c}`);
    }
    fahrenheit.addEventListener('input', f2c);

});
</code>