Note: This post is part of Learning Decoupling Gatsby WordPress series. This learning post is still in active development and updated regularly.
In the previous Part 1 of Learning Decoupling Gatsby WordPress series, installation of WordPress and Gatsby Source WordPress starter sites, required dependent plugins WPGraphQL, WP Gatsby installation and exposing WordPress data endpoint to Gatsby site by updating
gatsby-config.js were discussed.
The objective of this part 2 of the three-parts series is to expand the Gatsby site by update its global components, namely Layout, refactoring Header and adding Footer components. We will also install and configure Gatsby plugin Sass and add basic global layout with CSS Module.
Note: This post is part of Learning Decoupling Gatsby WordPress series. This learning post is still in active development and updated regularly. Most WordPress users, like myself, have come across the terms like headless, decoupled or static WordPress sites. We have read blog posts that many developers have migrated from the WordPress to the static […]
Last week, first part of my two parts series on decoupled WordPress Gatsby site was published in the CSS Tricks. To-day, its second part Creating a Gatsby Site with WordPress Data is out. This second part walks through how a WordPress sites is decoupled with WPGraphQL to create a Gatsby site with WordPress data end.
Note: This post is part of Learning Gatsby series. This learning post is still in active development and updated regularly. In components based websites like ReactJs, GatsbyJs, Vue and others reusable components play an important part. Components like <Header />, <Footer />, <Layout /> and others are often shared throughout the site. In most Gatsbyjs […]
I had prepared my decoupled learning journey for a while and then thought to share with others and choose to submit to the CSS-Trick. Here is My Long Journey to a Decoupled WordPress Gatsby Site published to-day in the CSS-tricks.
Note: This note is part of learning Gatsby series and still in development. This note is not complete and will be updated frequently. In ReactJs and GatsbyJS, styling components can be achieved in many different ways, including CSS Module. In Gatsby site, CSS Module works out of the box. One of the major advantages of […]
Note: This note is part of learning Gatsby series and still in development. This note is not complete and will be updated frequently. GraphQL query may contains query definitions and fragments. Fragments are selection of query definitions that can be re-used in multiple operations. The concept of query fragments is “to split complicated application data […]