🚀 Holt euch den Hostinger Business-Plan zum Hosten der Todo-App: www.hostinger.de/kurzundknapp
👌 Coupon code: KURZUNDKNAPP (10% Rabatt auf alle Webhosting-Pakete mit einer Laufzeit von 12 Monaten und mehr)
In diesem JavaScript Praxisprojekt für Anfänger programmieren wir eine Todo-Listen-Applikation (todo app) mit HTML, CSS und JavaScript (JS) und laden diese anschließend mit dem Webhosting-Dienst Hostinger hoch. Du lernst dabei wichtige und professionelle Konzepte wie CSS Variablen (custom properties), CSS Flexbox Layouts, Responsive Webdesign, weil wir die Webseite / Web app responsive für Desktop, Tablet und Smartphone (mobile Variante) machen. Du lernst in diesem deutschsprachigen Anfänger Praxisprojekt wichtige JavaScript Konzepte wie Event-Listener, DOM-Manipulation, LocalStorage, Elemente erstellen, löschen, speichern. In HTML und CSS benutzen wir moderne Icons mit SVG Elementen von Google Fonts Icons / Material Icons, erstellen unsere eigene custom checkbox (input checkbox stylen) und designen die responsive todo app mit media queries und Flexbox.
👉 Source Code auf unserer Webseite: coding-kurzundknapp.com
Ressourcen
✅ Beide Icons bekommt ihr bei fonts.google.com/icons
👉 Code-Editor Visual Studio Code: code.visualstudio.com
👉 Webhosting zum Hochladen der Todo-App: www.hostinger.de/kurzundknapp
🔥 Nutze den Code KURZUNDKNAPP für 10% Rabatt
⏱️ Timestamps:
00:00 Endprodukt Todo-Liste vorstellen
03:07 Vorbereitungen Google Icons herunterladen
04:01 HTML Code
08:52 CSS Code
20:47 Responsive Settings
22:10 JavaScript Logik implementieren
31:07 Todo-App Daten speichern mit LocalStorage
39:28 So geht Webhosting mit Hostinger | Todo App hochladen
👉 Lerne HTML5 und SEO in unserem englischen Udemy Kurs:
- Link: www.udemy.com/course/coding2g...
👉 Verwandte Tutorials:
- Portfolio Website erstellen und hochladen: • Portfolio Webseite Ers...
- Card Design: • CSS Card Design mit ho...
- Flexbox Tutorial: • CSS Flexbox in 5 Minut...
- Grid Layouts Tutorial: • CSS Grid Layouts in 7 ...
- Kostenloser CSS Kurs: • Lerne CSS in 40 Minute...
#todo-app #praxisprojekt #javascript
Lizenzen für Hintergrund-Musik im Video
Track: "Little Things"
Music provided by Slip.stream
Free Download/Stream: get.slip.stream/QmMj1I
Track: "Scared Of The Glizzy"
Music provided by Slip.stream
Free Download/Stream: get.slip.stream/xPJ3rV
Track: "Luz Solar"
Música proporcionada por Slip.stream
Descarga gratuita/transmisión: get.slip.stream/V75Tso
Welche Themen werden behandelt?
Todo list, todo-list-application, todo app, praxisprojekt, javascript, html, css, JS, responsive, javascript projekt, web dev project, anfänger projekt, tutorial deutsch, localStorage, daten Speichern, Todos speichern, für anfänger, CSS Flexbox, CSS Variablen, CSS Custom properties, webseite hochladen, web hosting, hostinger, webseite online stellen, todo web app
👍 Abonnieren und Liken, wenn es euch gefallen hat 😉