Building a dynamic application with GatsbyJS

1. by Jesus Manuel Olivas / Octahedroid
Building a dynamic application
with GatsbyJS

2. Jesus Manuel Olivas
jmolivas.com
@jmolivas

3. Agenda
The monolithic app
Prebuilt HTML and assets
What is GatsbyJS
Examples
JAMstack

4. Web Development 101

5. Traditional monolithic stack
Visitor Server
Database

6. Server render (traditional)
Server Client

7. SPA (client side)
Server Client

8. The Modern Stack (JAMstack)
Visitor
CDN

9. JAMstack (prebuilt)
Server ClientBuild Server

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

11. GatsbyJS

12. Centralize data with GraphQL
Easier to explore
Single source of truth
More scalable & team-friendly
Consistent, shareable dev workflow

13. Go Static for everything else
Blazing fast performance
Simpler deployment flow
Immutable deployments
Reduced DevOps overhead

14. GatsbyJS

15. Dynamic apps
Content that is sourced and rendered at
runtime vs. being statically rendered. For
example, a list of articles in your blog
that is generated in real-time by
querying an external endpoint.

16. Allowing users to authenticate and identify
themselves, so that some or all of the page
can be personalized for them. Examples
include displaying a user's name and
avatar, or showing authorized users private
content.
User Authentication

17. Login using JWT

18. Examples
https://gatsby-firebase-starter.netlify.com/
https://github.com/ovidiumihaibelciug

19. Thanks