intro merdascript

<!DOCTYPE html>
<html>
    <head>
        <title>
            Introduzione a MerdaScript
        </title>
        <meta charset="utf-8" />
    </head>
    <body>
        <div id="main">
            <h1>Merdascript</h1>
            <p>
                Per costruire un sito web è necessario conoscere HTML.
                Per farlo "bello" si usa CSS.
                Per aggiungergli delle funzionalità interattive si usa EcmaScript (volgarmente conosciuto come JavaScript).
            </p>
            <ul>
                <li>
                    <p>
                        HTML: linguaggio di <b>FORMATTAZIONE</b>.
                        Serve solo a specificare cosa è la porzione di testo racchiusa in un tag.
                    </p>
                </li>
                <li>
                    <p>
                        CSS: <b>foglio di stile a cascata</b>.
                        Si tratta di una serie di indicazioni date al browser che specificano come mostrare la porzione di codice interessata da quelle regole.
                    </p>
                </li>
                <li>
                    <p>
                        EcmaScript: linguaggio di <strong>MERDA</strong> ovvero di <strong>SCRIPTING</strong>.
                        In pratica si crea solo il codice (script) necessario per quella specifica funzionalità perché al resto ci pensa il browser.
                        Quando si scrive codice JavaScript è opportuno accertarsi che quel codice funzioni su tutti i browser che si vuole supportare.
                        Infatti ci sono differenze tra Safari, Chrome, Firefox, Edge ed altri e non è detto che le stesse regole valgano ovunque.
                    </p>
                </li>
            </ul>
        </div>
        <div id="form">
            <!--
                Metodo GET e metodo POST
                GET -> usa una linea di comunicazione visibile a tutti (crea dei parametri nel URL)
                POST -> non mostra i dati inseriti dall'utente nel form.
            -->
            <form action="#" onsubmit="stampaPorcoDio()" method="post">
                <div class="form-input">
                    <label for="nome">Nome utente</label>
                    <input type="text" name="utente" id="nome" placeholder="Inserisci qui il tuo nome">
                </div>
                <div class="form-input">
                    <label for="age">Anni</label>
                    <input type="number" name="vecchio" id="age" placeholder="Quanti anni hai?">
                </div>
                <button type="reset">Pulisci modulo contatti</button>
                <button type="submit">Invia dati</button>
            </form>
        </div>
        <script src="./main.js"></script>
    </body>
</html>