jnaapti

Practical technology training

Course outline for Gatsby

Connect the concepts, work through practical problems, and choose a training plan that fits your goals.

Technology
Gatsby
Duration
2-3 days
Level
Prerequisites listed

About Gatsby

Gatsby combines React, a build-time data layer, and plugins for content-driven websites. Build a small site from local content, inspect how pages and assets are generated, and evaluate plugin compatibility and hosting requirements before choosing a production workflow.

Gatsby Course Objectives

  • Configure a Gatsby project and its plugin dependencies.
  • Source content and query the build-time data layer.
  • Generate pages and reusable React layouts.
  • Test accessibility, assets, and build behavior.
  • Compare static hosting with features requiring a runtime.

Pre-requisites

  • Working knowledge of React, JavaScript, and HTML/CSS.
  • Basic Node.js, Git, and package-management experience.
  • GraphQL concepts are introduced through supplied queries.

Lab Setup

  • Supported Node.js release, editor, Git, and browser developer tools.
  • Version-pinned Gatsby starter, local Markdown/data files, and compatible plugins.
  • Use local content and static previews; no CMS subscription or discontinued hosting service is required.

Detailed Course Outline

Gatsby Concepts and Setup

  • Content-driven rendering and generated assets
  • Project files and Gatsby configuration
  • Development server and production builds
  • Checking supported dependencies and plugins

React Pages and Layouts

  • Page components and navigation
  • Shared layouts and reusable components
  • Styling and global assets
  • Accessible links and page structure

Content Sources and Plugins

  • Filesystem sources and transformer plugins
  • Markdown and structured content
  • Node creation and stable identifiers
  • External CMS integration responsibilities

GraphQL Data Layer

  • Schema inspection and page queries
  • Static queries and query variables
  • Filtering, sorting, and relationships
  • Handling missing or inconsistent content

Programmatic Page Creation

  • Build APIs and page templates
  • Dynamic paths and page context
  • Slug validation and redirects
  • Content changes and rebuild behavior

Images, Metadata, and Performance

  • Image processing and responsive assets
  • Metadata and canonical URLs
  • Prefetching and bundle inspection
  • Measuring browser behavior rather than relying on scores alone

Testing and Deployment

  • Component and page checks
  • Build failures and plugin compatibility
  • Static output and runtime-dependent features
  • Hosting portability and content-release checks

Practical Exercise

  • Build a searchable content catalog from local files
  • Generate detail pages with stable paths and metadata
  • Check broken references, missing content, and accessibility
  • Produce a static preview and document rebuild and hosting assumptions

How we train

Online training for Gatsby

  • Instructor-led live cohorts
  • Self-paced learning with expert coaches
  • 24x7 cloud labs with end-to-end examples

All sessions are 100% hands-on. Labs and activities are derived from real-world work our engineers deliver.

Classroom training

Available for corporate teams in:

  • Bengaluru
  • Chennai
  • Hyderabad
  • Mumbai
  • Delhi/Gurgaon/NCR
  • Pune

Note: Classroom training is for corporate clients only.

Self-paced hands-on sessions are delivered via VirtualCoach.

Related Technologies