Seminarinhalt
Dieses Training bietet eine umfassende Einführung in moderne Webentwicklung mit HTML5, aktuellen JavaScript-Standards (ES2024) und CSS3. Die vermittelten Grundlagen sind essentiell für die Entwicklung moderner Web-Anwendungen, Progressive Web Apps (PWAs) und Single Page Applications (SPAs).
Es werden aus dem Bereich moderner Frontend-Entwicklung folgende Themen abgedeckt:
Semantisches HTML5, moderne CSS-Layout-Techniken (Grid, Flexbox), ES2024+ JavaScript-Features, Komponenten-basierte Entwicklung, State Management, Build-Tools und moderne Entwicklungsworkflows, Performance-Optimierung, Accessibility (a11y) und moderne Web-APIs.
Das Training verwendet aktuelle Best Practices und moderne Entwicklungstools wie Vite, TypeScript und moderne Browser-APIs. Es wird gezeigt, wie Prinzipien und Technologien der modernen Webentwicklung angewendet werden, um skalierbare und wartbare Webanwendungen zu erstellen.
Nach Abschluss dieses Trainings haben die Teilnehmer*innen Wissen zu folgenden Themen:
Es werden aus dem Bereich moderner Frontend-Entwicklung folgende Themen abgedeckt:
Semantisches HTML5, moderne CSS-Layout-Techniken (Grid, Flexbox), ES2024+ JavaScript-Features, Komponenten-basierte Entwicklung, State Management, Build-Tools und moderne Entwicklungsworkflows, Performance-Optimierung, Accessibility (a11y) und moderne Web-APIs.
Das Training verwendet aktuelle Best Practices und moderne Entwicklungstools wie Vite, TypeScript und moderne Browser-APIs. Es wird gezeigt, wie Prinzipien und Technologien der modernen Webentwicklung angewendet werden, um skalierbare und wartbare Webanwendungen zu erstellen.
Nach Abschluss dieses Trainings haben die Teilnehmer*innen Wissen zu folgenden Themen:
- Erstellen semantischer und zugänglicher HTML5-Strukturen
- Moderne CSS-Layout-Techniken (CSS Grid, Flexbox, Container Queries)
- JavaScript ES2024+ Features und moderne Sprachkonstrukte
- Verwenden von GitHub Copilot zur Code-Generierung und -Vervollständigung
- Asynchrone Programmierung mit Promises, async/await und moderne APIs
- Komponenten-basierte Architektur und State Management
- Progressive Web Apps (PWAs) und Service Workers
- Performance-Optimierung und Core Web Vitals
- Moderne Build-Tools und Entwicklungsworkflows
- TypeScript Grundlagen für typsichere Entwicklung
- Testing und Debugging moderner Webanwendungen
- Web Security und HTTPS
- Responsive Design und Mobile-First Entwicklung
Programm
Moderne HTML5 und Semantic Web
- Semantische HTML5-Elemente und Zugänglichkeit (a11y)
- Web Components und Custom Elements
- Progressive Enhancement und Graceful Degradation
- SEO-optimierte HTML-Strukturen
- ARIA und Accessibility Best Practices
- Moderne Entwicklungsumgebung (VS Code, Extensions, DevTools)
- ES2024+ Syntax: Optional Chaining, Nullish Coalescing, Top-level await
- Modules (ESM) und moderne Import/Export-Patterns
- Template Literals und Tagged Templates
- Destructuring, Spread/Rest Operators
- Arrow Functions und Lexical Scoping
- Classes, Inheritance und Private Fields
- Promises, async/await und moderne Asynchronous Patterns
- Iterators, Generators und Async Iterators
- CSS Grid Layout für komplexe Layouts
- Flexbox für flexible Komponenten-Layouts
- CSS Custom Properties (CSS Variables)
- Container Queries und Element Queries
- CSS Logical Properties für Internationalisierung
- CSS Cascade Layers und @layer
- Modern CSS Selectors (:has(), :is(), :where())
- CSS Houdini und Paint API
- PostCSS und CSS-in-JS Ansätze
- Mobile-First Design Patterns
- Advanced Media Queries und Breakpoint-Strategien
- Viewport Meta Tag und moderne Viewport-Einheiten
- Touch-Gesten und Mobile Interaction Patterns
- Performance für Mobile Geräte
- Progressive Web App (PWA) Design Principles
- Fetch API und moderne HTTP-Client-Patterns
- Aufruf von OpenAPI aus dem Browser
- Web Storage (localStorage, sessionStorage, IndexedDB)
- Intersection Observer für Performance-optimiertes Scrolling
- Resize Observer und Mutation Observer
- Web Workers und Shared Workers
- Service Workers für Offline-Funktionalität
- Push Notifications und Background Sync
- WebAssembly (WASM) Integration
- File System Access API
- Web Share API und Navigator APIs
- Promise Patterns und Error Handling
- async/await Best Practices
- RxJS und Reactive Programming
- State Management Patterns (Redux, Zustand, Context API)
- Event-driven Architecture
- WebSockets und Server-Sent Events (SSE)
- Real-time Data Synchronization
- Vanilla JavaScript Components
- Web Components (Custom Elements, Shadow DOM, HTML Templates)
- Component Lifecycle und State Management
- Props, Events und Component Communication
- Styling Strategies für Components
- Testing von Komponenten
- Service Worker Lifecycle und Caching Strategies
- App Manifest und Installation
- Offline-First Design Patterns
- Background Sync und Push Notifications
- PWA Performance Optimization
- App Shell Architecture
- Core Web Vitals (LCP, FID, CLS)
- Critical Rendering Path Optimization
- Lazy Loading und Code Splitting
- Image Optimization (WebP, AVIF, Responsive Images)
- Bundle Analysis und Tree Shaking
- Performance Monitoring und Analytics
- Lighthouse und Web Vitals Measurement
- Vite und moderne Build-Tools
- Aspire CLI für lokale Entwicklung
- Einsatz von GitHub Copilot für HTML, CSS, und JavaScript
- Package Managers (npm, yarn, pnpm)
- TypeScript Grundlagen und Integration
- ESLint, Prettier und Code Quality Tools
- Git Workflows und Collaboration
- CI/CD für Frontend-Projekte
- Testing (Jest, Vitest, Playwright, Testing Library)
- Content Security Policy (CSP)
- Cross-Origin Resource Sharing (CORS)
- Authentication Patterns (JWT, OAuth)
- HTTPS und TLS Best Practices
- XSS, CSRF und andere Sicherheitslücken
- Secure Coding Practices
- TypeScript Typen und Interfaces
- Generics und Advanced Types
- Type Guards und Type Assertions
- Module System und Declaration Files
- Integration mit JavaScript-Projekten
- Migration Strategies von JavaScript zu TypeScript
- Unit Testing mit Jest/Vitest
- Integration Testing mit Testing Library
- End-to-End Testing mit Playwright/Cypress
- Browser DevTools Advanced Features
- Performance Profiling und Memory Debugging
- Error Monitoring und Logging
- Static Site Hosting (Netlify, Vercel, GitHub Pages)
- CDN und Edge Computing
- Environment Management
- Monitoring und Analytics
- Performance Budgets und Continuous Performance
Zielgruppen
- Entwickler*innen mit grundlegenden Programmierkenntnissen, die moderne Webentwicklung lernen oder ihre Frontend-Skills auf den neuesten Stand bringen möchten. Ideal für:
- Fullstack-Entwickler, die ihre Frontend-Kenntnisse vertiefen wollen
- Backend-Entwickler, die in die Frontend-Entwicklung einsteigen
- Bestehende Frontend-Entwickler, die moderne Technologien und Best Practices lernen möchten
Vorkenntnisse
- Grundlegende Programmiererfahrung** in einer beliebigen Sprache
- Verständnis von Web-Grundlagen**: HTTP, URLs, Browser-Funktionsweise
- Basis HTML-Kenntnisse**: Grundlegende Tags und Dokumentstruktur
- Basis CSS-Kenntnisse**: Selektoren, Properties, Box Model
- Grundlegendes Verständnis von Versionskontrolle** (Git)
- Kommandozeile/Terminal** Grundkenntnisse
Der Kurs vermittelt einen guten Überblick über die Möglichkeiten von HTML5, CSS3 und Javascript. Es gibt viel Raum zum Probieren. Der Trainer ist sehr kompetent. Buch zum Kurs und Unterlagen… mehr
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
17.09.2021Der Kurs vermittelt einen guten Überblick über die Möglichkeiten von HTML5, CSS3 und Javascript. Es gibt viel Raum zum Probieren. Der Trainer ist sehr kompetent. Buch zum Kurs und Unterlagen sind auch nach dem Kurs verfügbar, sodass man auch lange danach noch nachschlagen kann - darin gibt es Beispielcode und detaillierte Erklärungen zu jedem Modul. Insgesamt empfehlenswerter Kurs.
— Radisav S.Die Umgebung, mit der die Beispiele gemacht werden, sollte prominenter angegeben werden.
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
17.09.2021Die Umgebung, mit der die Beispiele gemacht werden, sollte prominenter angegeben werden.
— Erich O.Guter Überblick. Kompetenter Vortragender. Viel Praxis und Hintergrundwissen. Vortrag ist abwechslungsreich und war nie langweilig. Durch die Breite der Thematik sind einige Bereiche nur mit viel Vorwissen verständlich, daher ideal… mehr
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
07.06.2021Guter Überblick. Kompetenter Vortragender. Viel Praxis und Hintergrundwissen. Vortrag ist abwechslungsreich und war nie langweilig. Durch die Breite der Thematik sind einige Bereiche nur mit viel Vorwissen verständlich, daher ideal als Auffrischung und Update.
— David R.Sehr informatives und tolles Seminar! Herr Nagel hat den Kurs sehr interessant gestaltet und alle gestellten Fragen zur Gänze beantwortet. Sehr interessant waren auch die Neuerungen der verschiedenen Technologien und… mehr
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
07.05.2021Sehr informatives und tolles Seminar! Herr Nagel hat den Kurs sehr interessant gestaltet und alle gestellten Fragen zur Gänze beantwortet. Sehr interessant waren auch die Neuerungen der verschiedenen Technologien und wie sich diese entwickelt haben. Die Übungen sind sehr lehrreich und leicht verständlich. Dank dieses Seminars habe ich meine html, css & js-Kenntnisse aufgefrischt und einige neue Dinge lernen dürfen. Besonders gefallen haben mir die html5 und css3 Neuerungen. MfG.
— Thomas W.Gutes Seminar! Nur würde ich es besser finden wenn nicht von HTML zu CSS und dann zu JavaScript und wieder von vorne gesprungen wird, sondern dies gebündelt wird. Aber ansich… mehr
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
07.05.2021Gutes Seminar! Nur würde ich es besser finden wenn nicht von HTML zu CSS und dann zu JavaScript und wieder von vorne gesprungen wird, sondern dies gebündelt wird. Aber ansich sehr gutes Seminar!
— Jonas S.Sehr gute Einführung und Überblick für Einsteiger, sowie auch guter Überblick von Erneuerungen in HTML5 und CSS 3. Es wird auch ein sehr guter Überblick gegeben über Advanced Topics wie… mehr
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
07.05.2021Sehr gute Einführung und Überblick für Einsteiger, sowie auch guter Überblick von Erneuerungen in HTML5 und CSS 3. Es wird auch ein sehr guter Überblick gegeben über Advanced Topics wie Websockets, Verarbeitung von Aufgaben mit mehreren Threads und Offline/Verf[gbarkeit.
— Bernhard P.Super Kurs. Top-Trainer!
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
28.05.2020Super Kurs. Top-Trainer!
— Michael G.Kursinhalt strukturell verständlich aufgebaut, Der Trainer sehr kompetent durch die Erfahrung in der IT und behandelt gern praxisbezogene Probleme und bringt einfach umsetzbare Lösungen mit
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
05.03.2020Kursinhalt strukturell verständlich aufgebaut, Der Trainer sehr kompetent durch die Erfahrung in der IT und behandelt gern praxisbezogene Probleme und bringt einfach umsetzbare Lösungen mit
— Tarik P.Guter und übersichtlicher Kurs! Viel Bezug zur Praxis, verständliche Übungen und super Trainer.
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
03.03.2020Guter und übersichtlicher Kurs! Viel Bezug zur Praxis, verständliche Übungen und super Trainer.
— Irene T.Kurs gibt einen schönen Überblick! Der Inhalt konnte gut vermittelt werden.
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
25.02.2020Kurs gibt einen schönen Überblick! Der Inhalt konnte gut vermittelt werden.
— Alen V.Super Trainer, Inhalt gut aufbereitet und rüber gebracht! Empfehlenswert!!
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
24.04.2019Super Trainer, Inhalt gut aufbereitet und rüber gebracht! Empfehlenswert!!
— Dominik R.Spitzen Trainer! Interessante Inhalte gut übermittelt!
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
25.01.2019Spitzen Trainer! Interessante Inhalte gut übermittelt!
— René S.Super Kurs! Inhalt sehr gut aufgebaut und verständlich. Sehr hoher Praxisbezug. Ausgezeichneter, sehr kompetenter Trainer!
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
16.11.2018Super Kurs! Inhalt sehr gut aufgebaut und verständlich. Sehr hoher Praxisbezug. Ausgezeichneter, sehr kompetenter Trainer!
— Alexander S.Inhalte gut vermittelt - Interessant
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
17.11.2017Inhalte gut vermittelt - Interessant
— Wolfgang K.Perfekter Kurs. Trainer war einfach Top
Moderne Webentwicklung mit HTML5, JavaScript und CSS3
17.11.2017Perfekter Kurs. Trainer war einfach Top
— Martin K.