The document discusses the integration of Rain, a Drupal installation profile, with GatsbyJS to facilitate faster site building for various organizations, including B2B, B2C, education, and nonprofits. It highlights the benefits of using Gatsby as a web compiler for performance, improved staffing options, and security while addressing challenges with monolithic CMS builds. Additionally, it provides a demo and step-by-step guidance on connecting Drupal 8 to Netlify and deploying Gatsby.

1. Rain + GatsbyJS:
Fast Tracking to Drupal 8
May 21, 2019

2. | 2
Today’s Team
Preston SoJay Callicott Mark Casias

3. | 3
Who We Are
Mediacurrent is a full-service digital agency that
implements world class open source software
development, strategy, and design to achieve
defined goals for enterprise organizations
seeking a better return on investment.

4. | 4
Today’s Agenda
I. Speaker Intros
II. Rain Overview
III. Why Gatsby?
IV. Setup
V. Q&A

5. | 5
/in/jay-callicott-8535ba1
@drupalninja

6. | 6
Rain Starter Profile

7. | 7
Why We Created Rain
The Rain installation
profile packages and
configures the best
solutions the Drupal
community has to offer to
help build new sites
faster.

8. | 8
Who Uses Rain?
Large Enterprise B2B
●
●
High Volume B2C
●
●
Education and Nonprofits
●
●

9. | 9
Rain + Gatsby
User-FriendlyPerformance Minimal Hosting Security

10. | 10
/in/prestonso
@prestonso

11. | 11
Why Gatsby?

12. | 12

13. | 13
Performance
● Gatsby is a web compiler
●
it’s hard to build a slow website
● Fast websites are all alike;

14. Drupal user login
Drupal
Drupal search
Drupal Ubercart
Drupal content
Drupal forms
Drupal Google Analytics

15. Auth0 authenticationAuth0
Algolia search
Snipcart cart
Contentful content
Typeform forms
Segment analytics
Gatsby
Algolia
Drupal
Snipcart
Typeform
Segment
Contentful

16. Drupal
Drupal front
end
Gatsby
Drupal
Gatsby
Client
Server
Pages
Auth0
Algolia
Drupal
Snipcart
Typeform
Segment
Contentful
Architecture
Time

17. | 17
The content mesh
● Gatsby is the glue for the content mesh
● modular,
specialized interchangeable

19. | 19
Why Gatsby and Drupal?

20. | 20
Monolithic CMS builds
● Resourcing challenges
● Maintainability challenges
● Integration challenges

21. | 21
Dries Buytaert
Many organizations are finding it difficult to find
affordable front-end Drupal developers experienced in
Twig. Moving to a JavaScript-driven front end can
resolve some of these resourcing challenges.

22. | 22
Why Drupal for Gatsby?
●
API-first Drupal
●
gatsby-source-drupal
● Drupal ecosystem for Gatsby

23. | 23

24. | 24
Is Gatsby for me?

25. | 25
Acknowledged limitations
● Scalability
○ Incremental builds
● Preview
○ Gatsby Preview
● Editorial experience
○ Themes
Gatsby benefits
● Cost
● Staffing
● Security
● Performance

26. | 26
What’s next for Gatsby?

27. | 27
Coming soon to a Gatsby near you ...
● Incremental builds.
● Preview.
● Themes.

28. | 28
Gatsby Preview for Drupal
The Gatsby Drupal Working Group is currently building
a live preview solution for Drupal that will allow
content editors to see their changes instantaneously
on Gatsby sites. More to come soon!
For more, check out
https://spectrum.chat/gatsby-wg-drupal/

29. | 29
Today’s Demo
Connect D8 to
Netlify
Install Rain Enable
JSON:API
Deploy to
Server
Create Gatsby
Starter
Deploy Gatsby
to Netlify
Follow along with our
blog guide
http://bit.ly/2w1A5hY

30. | 30
Step 1: Installing Rain

31. | 31
https://youtu.be/eV9_SMgQ07Q
Step 1 Video

32. | 32
Step 2: Enabling JSON:API

33. | 33
https://youtu.be/lYIDfJqNO6c
Step 2 Video

34. | 34
Step 3: Deploying to the server

35. | 35
https://youtu.be/sYZwBR-Ip1M
Step 3 Video

36. | 36
Step 4: Creating Gatsby starter

37. | 37
https://youtu.be/RrjfFKHPZ88
Step 4 Video

38. | 38
Step 5: Deploying Gatsby to Netlify

39. | 39
https://youtu.be/DapQIk9jYVg
Step 5 Video

40. | 40
Step 6: Connecting D8 to Netlify

41. | 41
https://youtu.be/WPG4s1A4ySM
Step 6 Video

42. Follow along with Jay’s tutorial:
Drupal 8 Rain & GatsbyJS
Integration - Soup to Nuts
Installation
Check out the tooling we ship with
all of our projects on our
development tools page.
Read our Drupal and Gatsby case
study for City of Sandy Springs
Explore Gatsby for enterprise: How
to Reduce Your Digital Total Cost
of Ownership with Gatsby
Rain Demo Development Tools Drupal + Gatsby
Resources
Contact Mediacurrent