In this tutorial, we'll look at how to use the Remix framework and Tailwind CSS with headless WordPress.
GitHub Repo: https://github.com/JEverhart383/remixing-wordpress
Blog Post: https://developers.wpengine.com/blog/headless-wordpress-with-remix-and-tailwind-css
Headless WordPress resources:
https://developers.wpengine.com
**DISCLAIMER: This video mentions Atlas Content Modeler, however we now recommend using Advanced Custom Fields (https://www.advancedcustomfields.com/).**
Contents:
00:00 Intro
00:35 Download the codebase
01:00 Install dependencies
01:43 Exploring Remix File Structure
02:40 Routing in Remix Index Page
03:12 WordPress and WPGraphQL
04:33 loader functions and useLoaderData hook
06:55 Dynamic Routes in Remix
09:50 Link Prefetching Intro
11:00 Prefetching on User Intent
13:32 Prefetching on Render
14:34 Using Tailwind CSS
16:30 Styling WordPress content with Tailwind CSS
19:05 Outro