mitmario.dev
Neu im Premium Konto

Bau was Eigenes.
Mio baut mit.

Derselbe Editor wie in den Kursen, mit Vorschau, Console und Mio. Nur steht da keine Prüfliste, sondern deine Idee: eine Projektseite, ein Spiel, das Quiz für den Verein.

Premium Konto ansehen
gespeichert Als ZIP laden
3 Dateien geändert seit dem letzten Stand
Mio Verlauf
Bau mir eine Seite für meine Projekte. Kacheln mit Bild, Titel und einem Satz. Mach ich. Ich lege die Seite an und setze die Kacheln mit Grid. Plan Seite mit Raster anlegen Kacheln in style.css Link von index.html angelegt projekte.html +32 geändert style.css +18 −2 schreibt index.html… Frag Mio oder sag, was als Nächstes kommt Direkt schreiben ▾ ⇧ Tab
index.html projekte.html style.css
<!doctype html>
<html lang="de">
<head>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <h1>Was ich gebaut habe</h1>
  <main class="raster">
    <article class="kachel">
      <div class="bild wetter">Wetter</div>
      <h2>Wetter-App</h2>
      <p>Holt die Vorhersage mit fetch.</p>
    </article>
    <article class="kachel">
      <div class="bild quiz">Quiz</div>
      <h2>Vereinsquiz</h2>
    </article>
  </main>
</body>
</html>
Browser Console Netzwerk Debug
/projekte.html
Seite aktuell Stand 14:32 · 3 Dateien · HTML · UTF-8

Beispiel, kein echtes Projekt.

  1. Mio baut mit Er macht einen Plan, legt Dateien an und sagt, was er geändert hat. Wie ein Kollege, der mittippt.
  2. Du sagst, wie viel Nur reden, erst zeigen oder direkt schreiben. Umschalten geht jederzeit, auch mitten im Projekt.
  3. Deine Dateien Ordner, Bilder und Schriften wie auf dem eigenen Rechner. Was Mio geschrieben hat, ist grün markiert.
  4. Vorschau mit Werkzeug Browser, Console, Netzwerk und Debug, dieselben Reiter wie in den Kursen.
  5. Es bleibt liegen Gespeichert wird beim Tippen, jeder frühere Stand steht im Verlauf.
meine-projektseite
Mio Code Browser
Mio Verlauf
Bau mir eine Seite für meine Projekte. Kacheln mit Bild, Titel und einem Satz. Mach ich. Ich lege die Seite an und setze die Kacheln mit Grid. Plan Seite mit Raster anlegen Kacheln in style.css Link von index.html angelegt projekte.html +32 geändert style.css +18 −2 schreibt index.html… Frag Mio oder sag, was als Nächstes kommt Direkt schreiben ▾ ⇧ Tab

Beispiel, kein echtes Projekt.

  1. Mio baut mit. Er macht einen Plan, legt Dateien an und sagt, was er geändert hat. Wie ein Kollege, der mittippt.
  2. Du sagst, wie viel. Nur reden, erst zeigen oder direkt schreiben. Umschalten geht jederzeit, auch mitten im Projekt.
  3. Code und Browser liegen auf den Segmenten daneben, mit Console, Netzwerk und Debug.

So läuft es

HTML, CSS, JavaScript im Browser
01

Anfangen

Beschreib Mio, was du bauen willst, fang leer an oder nimm eine gelöste Aufgabe mit. Aus dem Kartenraster im CSS-Kurs wird so deine Projektseite.

02

Bauen

Du schreibst selbst, und Mio hilft so viel, wie du willst. Bilder und Schriften lädst du hoch oder ziehst sie einfach rein.

03

Behalten

Mit „Stand speichern“ hältst du fest, was läuft. Im Verlauf holst du jeden früheren Stand zurück, und als ZIP nimmst du alles mit.

Was drin ist

im Premium Konto
1 GB Platz für deine Projekte So viele Projekte, wie reinpassen, jedes mit eigenen Ordnern, Bildern und Schriften.
400 Fragen an Mio im Monat Mio sieht deine Dateien und die Console. Jede Nachricht zählt als eine Frage, egal wie viel er schreibt.
3 Modi Nur reden, erst zeigen, direkt schreiben „Erst zeigen“ legt den Vorschlag als Änderung in den Editor, du übernimmst jede Stelle einzeln.
Verlauf Nichts geht verloren Jede Änderung von Mio und jede Tipppause legt einen Stand an. Zurückholen geht für alles oder nur eine Datei.
4 Reiter Browser, Console, Netzwerk, Debug Dieselben Werkzeuge wie in den Kursen, du musst nichts neu lernen.
Aus dem Kurs Als Projekt weiterbauen An jeder gelösten Aufgabe im HTML-, CSS- und JavaScript-Kurs, mit deinem Code als Anfang.

Deine Projekte bleiben 30 Tage lesbar, und als ZIP kannst du sie jederzeit mitnehmen. Danach werden sie gelöscht. 7 Tage vorher kommt eine Mail.

Was als Nächstes kommt, steht im Fahrplan.

Zwei Konten, dieselben Kurse

Beide Konten arbeiten in derselben Lernumgebung. Der Unterschied ist, wie viel Zeit du auf dem Server hast und wie oft du Mio fragen kannst. Dazu kommt mit Premium die Werkstatt, in der du eigene Projekte baust.

Merkmal Basis Konto Kostenlos dauerhaft, keine Karte nötig Premium Konto 29 € regulär 39 € Launch-Preis im Monat, monatlich kündbar · oder 290 € im Jahr, 2 Monate geschenkt Der Launch-Preis gilt für die ersten 100 Abos und bleibt, solange dein Abo läuft.
Fortschritt auf jedem Gerät ja ja
Übungen im Browser unbegrenzt unbegrenzt
Server-Sandbox auf einem echten Rechner 1 Stunde im Monat 60 Stunden im Monat
Mio, dein Lernbegleiter 20 Fragen im Monat 400 Fragen im Monat
Sandbox läuft beim Tippen mit ja
Bestandene Lösungen behalten, mit ZIP ja
Eigene Projekte in der Werkstatt Neu ja

Ganz ohne Konto kannst du den Katalog, jede Kursseite und den Artikel jeder Lektion lesen. Für den Editor, die Aufgaben und die Tests brauchst du das Basis Konto, und das kostet nichts.

Preise sind Endpreise, gemäß § 19 UStG ohne Umsatzsteuer.