JavaScript TODO APP programmieren & hochladen

Published: 11 February 2024
on channel: Coding - kurz und knapp
3,814
124

🚀 Holt euch den Hostinger Business-Plan zum Hosten der Todo-App: https://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: https://coding-kurzundknapp.com

Ressourcen
✅ Beide Icons bekommt ihr bei https://fonts.google.com/icons
👉 Code-Editor Visual Studio Code: https://code.visualstudio.com
👉 Webhosting zum Hochladen der Todo-App: https://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: https://www.udemy.com/course/coding2g...

👉 Verwandte Tutorials:
Portfolio Website erstellen und hochladen:    • Portfolio Webseite Erstellen und Hoch...  
Card Design:    • CSS Card Design mit hover effect Anim...  
Flexbox Tutorial:    • CSS Flexbox in 5 Minuten erklärt | CS...  
Grid Layouts Tutorial:    • CSS Grid Layouts in 7 Minuten erklärt...  
Kostenloser CSS Kurs:    • Lerne CSS in 40 Minuten (CSS Kurs für...  

#todo-app #praxisprojekt #javascript

Lizenzen für Hintergrund-Musik im Video

Track: "Little Things"
Music provided by https://Slip.stream
Free Download/Stream: https://get.slip.stream/QmMj1I

Track: "Scared Of The Glizzy"
Music provided by https://Slip.stream
Free Download/Stream: https://get.slip.stream/xPJ3rV

Track: "Luz Solar"
Música proporcionada por https://Slip.stream
Descarga gratuita/transmisión: https://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 😉


On this page of the site you can watch the video online JavaScript TODO APP programmieren & hochladen with a duration of hours minute second in good quality, which was uploaded by the user Coding - kurz und knapp 11 February 2024, share the link with friends and acquaintances, this video has already been watched 3,814 times on youtube and it was liked by 124 viewers. Enjoy your viewing!