Slide 1

Slide 1 text

Gatsby Gatsby is a free and open source framework based on React that helps developers build blazing fast websites and apps

Slide 2

Slide 2 text

Gatsby is a "static" website generator

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

1. Modern web tech without the headache 2. Speed past the competition 3. Progressive Web App by default 4. Bring your own data https://www.gatsbyjs.org/

Slide 6

Slide 6 text

Content is the king (Data sources)

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

https://www.gatsbyjs.org/docs/how-plugins-apis-are-run/

Slide 9

Slide 9 text

Node runner Data sources Create node (reducer) Call onCreateNode Provide data to query Build

Slide 10

Slide 10 text

How to query the data

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

Data can be queried inside pages, components, or the gatsby-node.js file, using one of these options: 1. The pageQuery component 2. The StaticQuery component 3. The useStaticQuery hook

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

Performance Optimization Performance is hard. Let’s make Gatsby do the work.

Slide 17

Slide 17 text

https://www.gatsbyjs.org/blog/2017-09-13-why-is-gatsby-so-fast/#reach-skip-nav

Slide 18

Slide 18 text

Image performance Ohhh myyyyy

Slide 19

Slide 19 text

https://using-gatsby-image.gatsbyjs.org/ The problem: Large, unoptimized images dramatically slow down your site.

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

Everything is a plugin 1480 plugins today

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

Nothing is perfect Pages (solves with a plugin), variables inside query), cache and build time problems on deploy (netlify)

Slide 25

Slide 25 text

Why we should use at CKL?

Slide 26

Slide 26 text

Real world projects

Slide 27

Slide 27 text

Questions?

Slide 28

Slide 28 text

Thanks