- Gatsby and Next are both based on React.
- No technical details here, just some personal opinions and resources
- Why not just Drupal Twig an jQuery
- When to use a Drupal backend
- When to use a Drupal frontend
- React and Vue
- Gatsby and Next
- SSR (Server Side Rendering) and SSG (Static Site Generation)
- Integration of Gatsby with Drupal
- Learning resources
- Fast by design while using SSG (Static Site Generator)
- Secure by design: reduce the pressure of updating Drupal constantly (e.g. limit access by ip)
- Possibility to outsource hosting to rather cheap platforms platform
- Out of the box deployment pipeline
- No server provisioning / maintenance / security issues
- Most of them have CDN
- Variety of providers (Gatsby Cloud, Vercel, Netlify, GitHub pages...)
- Static generation is more than fast
- Drupal frontend caching can be ignored: cache tags/contexts for invalidation can be quite complex depending on the use case (e.g. a site that has per region and language content)
- Varnish is not needed
- Better DX - jQuery in 2021 is not awesome when we have EcmaScript 6+ and TypeScript
- Schema stitching when using multiple sources
- React / Node stack is quite popular, larger developer base than Drupal so easier to hire devs
- Drupal might not even be needed for smaller projects: Prismic, Sanity, Contenful, Cosmic, Wordpress, … some platforms are also providing their own CMS (e.g. Netlify)
- How drupal can stay relevant compared to fully decoupled SaaS solutions with excellent DX?
- Complex content model
- Workflows / content moderation
- Workspaces
- Translation management
- Media management (e.g. compare to Prismic)
- Many forms (Webforms) - possible to solve with e.g. JSON schema but can be rather complex
- Application that exposes many edit forms
- Many views
- MVP, Fast prototyping of the frontend for later decoupled implementation (e.g. with Gin used on the frontend and backend)
- Lower budget sites that requires a Drupal backend (e.g. the menu system can be hard to integrate)
- When the team stack is not already including a decoupled framework
Why not Vue and Gridsome?
- A matter of preference
- React ecosystem might be more mature, more integration for really common use cases like Multilingual, Forms (Formik)
- A matter of preference
- Should not be chosen based on the backend, both have support
- Next might be simpler for the routing system
- Comparison of Gatsby vs Next.js (Gatsby))
- Gatsby.JS vs Next.JS — Which one to choose when?
- Next.js vs. GatsbyJS: comparing two React frameworks
- Spoiler: in some cases, it might make sense to mix React logic with SSG.
- Both Gatsby and Next have SSG and SSR, Gatsby is mostly used with SSG
- Lower level of entry, less boilerplate code
- Pain points: rehydration, isomorphism, caching
- Incremental builds
- Pagination, multilingual, ... must be implemented with routes - more boilerplate code
Gatsby module: live preview, incremental builds
Sourcing content: both JSON:API and GraphQL modules will produce a GraphQL api on Gatsby.
-
- contributed module
- v3: schema out of the box, exposes Drupalisms, exposes everything -> persisted queries to limit, ...
- v4: write your own schema
- maintaining some contributed modules for v3 syntactic sugar Menu, Extras, Formatters, ... to be ported in v4 for more boilerplate code
- Gatsby source plugin
- Advanced React and GraphQL (with Next)
- Master Gatsby
- Gatsby with Drupal
- Next integration (includes various decoupled CMS)
- Amazee Labs distribution