+49 911 65008-222 info@it-seminare.de

Erstellen von Webseiten mit Gatsby

Seminardauer: 2 Tage

Das Seminar "Erstellen von Webseiten mit Gatsby" ist seitens des Herstellers nicht mehr verfügbar, bzw. abgekündigt. Wir können Ihnen diese Schulung in Form eines Workshops in Ihrem Unternehmen oder in unserem Schulungszentrum anbieten.

Seminarinformationen

Seminar - Ziel

In diesem 2-tägigen Seminar "Erstellen von Webseiten mit Gatsby" erhalten Sie einen modernen Einblick in die Entwicklung von Weblösungen, die den Wandel von einem monolithischen CMS hin zu einem Content Mesh mit einer entkoppelten Infrastruktur für Websites widerspiegeln.

Der Kurs startet mit einer Einführung in Gatsby, einschließlich der Installation, dem Anlegen von Projekten mit der Gatsby CLI, der Erstellung statischer Seiten sowie dem Design von Layouts und Styling. Sie bekommen einen Überblick über die Gatsby-Architektur, erfahren, wie Sie Daten mit GraphQL abfragen, und arbeiten mit Bildern sowie Markdown-Inhalten. Zum Abschluss werden die Veröffentlichung der Website in der Produktionsumgebung und die Optimierung für Progressive Web Apps (PWA) behandelt.

Teilnehmer - Zielgruppe

  • Entwickler

Kurs - Voraussetzungen

Für eine optimale Teilnahme am Kurs empfehlen wir folgende Vorkenntnisse:

  • Erfahrung in der JavaScript-Entwicklung
  • Erfahrung mit React ist hilfreich, aber nicht erforderlich.

Seminardauer

  • 2 Tage
  • 09:00 Uhr bis 17:00 Uhr

Schulungsunterlagen

  • nach Absprache

Seminar-Inhalt / Agenda

Einführung in Gatsby

  • Der JAM-Stack
  • Headless CMSes
  • Gatsbys Nutzenversprechen
  • Das Gatsby-Ökosystem

Erste Schritte

  • Installation von Gatsby
  • Erstellen eines Projekt mit Gatsby CLI
  • Benutzung eines Starters

Statische Seiten erstellen

  • Erstellen Sie eine Seite
  • Verwendung von statischen Assets
  • Erstellen von Komponenten mit React

Layouts und Styling

  • Hinzufügen globaler CSS-Stile
  • Verwendung von CSS-Modulen
  • Verwendung einer CSS in JS-Bibliothek
  • Verknüpfung zwischen Seiten mit
  • Hinzufügen einer Layout-Komponente

Gatsby Architektur

  • Datenquellen, Knotenpunkte und GraphQL
  • Quellen-Plugins und Transformator-Plugins
  • Verstehen des Erstellungsprozesses von Gatsby

Abfragen von Daten mit GraphQL

  • Verstehen von GraphQL
  • GraphQL-Abfragen von Seiten erstellen
  • Rendering der empfangenen Daten
  • Behandlung von Fehlern und Verzögerungen
  • Statische Abfragen vs. Seitenabfragen
  • Abfragen von Komponenten mit <staticquery></staticquery> durchführen
  • Verwendung des useStaticQuery-Befehls

Weitere Datenquellen abfragen

  • Abfrage von Daten aus dem Dateisystem
  • Verstehen des Nodes Namespace und des Speichermodells
  • Abfrage von Bilddaten
  • Verbindung mit einem Headless CMS

Arbeiten mit Images

  • Responsive Design für Images
  • Bandbreite und Ladezeit
  • Abfrage von Images mit GraphQL
  • Image-Transformationen
  • Rendering von Images

Arbeiten mit Markdown

  • Erstellen eines Blogs
  • Umwandlung von Markdown in HTML
  • Einführung in MDX
  • Anwendung von MDX

Programmgesteuertes Erstellen von Seiten

  • Gatsbys Bootstrap-Phase
  • Verstehen von gatsby-node und Gatsby's APIs
  • Erstellen von "Slugs" für generierte Seiten
  • Generieren der Seiten

Paginierung über Listen

  • Paginierung in GraphQL
  • Abfrage einer Liste
  • Rendering einer paginierten Liste

Umstellung auf Production

  • Erstellen eines Production-Builds
  • Ausliefern des Production-Builds
  • Hosting der Site
  • Verteilen auf Netlify

Verbesserung der Unterstützung für Progressive Web Apps (PWA):

  • PWAs
  • Ausführen eines Lighthouse-Audits
  • Hinzufügen eines Manifests
  • Hinzufügen von Offline-Unterstützung mit einem Service Worker

Weitere Schulungen zu Thema React

Jakarta EE - Moderne Full Stack Entwicklung mit React und MongoDB

- u.a. in Nürnberg, Berlin, Stuttgart, München, Köln

In diesem 5-tägigen Seminar "Jakarta EE – Moderne Full Stack Entwicklung mit React und MongoDB" erhalten Sie einen umfassenden Überblick über aktuelle Webtechnologien und sind danach in der Lage, ein komplettes Webprojekt mit modernen Tools umzusetzen. Der ...

ASP.NET Core-Entwicklung mit React und Redux

- u.a. in Nürnberg, Berlin, Stuttgart, München, Köln

In diesem 5-tägigen Seminar "ASP.NET Core-Entwicklung mit React und Redux" erlernen Sie die notwendigen Fähigkeiten, um eine moderne Webanwendung zu entwickeln, die JavaScript auf der Client-Seite und ASP.NET Core im Backend nutzt. Sie erhalten grundlegende Kenntnisse in der ...

React und TypeScript

- u.a. in Berlin, Köln, Düsseldorf, Essen, Jena

In diesem 3-tägigen Seminar "React und TypeScript" erhalten Sie eine fundierte Einführung in die grundlegenden und spezifischen Eigenschaften von React, einer der führenden Bibliotheken zur Entwicklung von Single-Page-Anwendungen (SPAs). Neben den allgemeinen ...

React und Redux (mit TypeScript)

- u.a. in Stuttgart, Paderborn, Düsseldorf, Darmstadt, Virtual Classroom

In diesem 4-tägigen Seminar "React und Redux (mit TypeScript)" erhalten Sie umfassende Einblicke, wie Sie die Kombination aus React und Redux nutzen, um anspruchsvolle Frontend-Anwendungen zu entwickeln. Diese Technologien werden erfolgreich von großen Plattformen wie Airbnb ...