This workshop has already been published as a course!
Introduction to Gatsby, v2
By participating along with us in the workshop, you'll learn:
- Learn how to leverage free, open source tools including Gatsby, React, and GraphQL to build high-performance websites.
- Deliver an excellent experience to your users by providing only critical assets on load and prefetching assets for subsequent page loads.
- Implement performance best practices to improve key metrics including first contentful paint.
- Learn to build and deploy websites in the fraction of time.
- Create websites quickly with performance baked in.
- Deploy your sites for free in minutes with Netlify.
Your (Awesome) Instructor
Spend A Full Day Immersed in Gatsby with Jason Lengstorf
In this workshop, learn to build apps and websites with React using Gatsby, a Jamstack metaframework. Shipping great web experiences quickly is one of the biggest factors in our success as frontend developers. Using Gatsby provides a strong set of guidelines and foundational work that enables developers to work extremely quickly, delivering fast apps and websites on short timelines.
We've already held over 300 workshops with thousands of attendees in-person and online. In this time we've discovered ways to schedule the day, so it goes smoothly and efficiently. Regardless if you're in-person or participating with us online you'll have the full ability to replay things you missed, get your questions answered LIVE and interact with the teacher throughout the day.
- 9:45AMInitialize a new Gatsby site, get familiar with how Gatsby projects are organized, and get local development working.
- 10:00AMLearn how creating pages works in Gatsby, and how to set up navigation between pages.
- 10:30AMCreate a shared layout to manage components that appear on all pages of the site, such as the header and footer.
- 10:45AMAdd styles to the site, both using global, shared styles and scoped, component-specific styles.
- 11:00AMIntroduce Gatsby's GraphQL layer, the GraphiQL Explorer, and the basics of querying for data. Add our first custom data to the site by adding SEO metadata to the site config.
- 11:30AMBuild an SEO component for the site by querying the Gatsby GraphQL layer.
- 1:00PMIntroduce images in Gatsby, starting with a static image and adding the placeholder and other settings to optimize image performance.
- 1:30PMUse the MDX plugin to create a Markdown + React blog.
- 2:00PMAdd images to our Markdown and convert it to optimized images
- 3:00PMAdd content from a third-party source plugin
- 3:30PMUse collection routes to generate pages from third-party data.
- 4:00PMDeploy the site to Netlify
- 4:30PMWrap Up and Q&A
Interact with the Instructor
Is This Workshop for Me?
This workshop is for developers who build websites or apps for their companies or clients and need those websites to be extremely fast.
- Installations of Node 12+, Git, amd either npm or Yarn.
- Some familiarity with the command line, GraphQL, Node.js.
- Attendees will also need permission to install Node packages globally on their computer (i.e. not a locked down company computer).
One Full Day Workshop Session
Replay Videos (available immediately)
August 11, 2021 - 9:30am to 5:30pm Central Daylight Time
Attend online on our full HD live stream