Astro with Tailwind

npm create astro@latest -- --template with-tailwindcss

--Written with StackEdit and this editor is fantastically wonderful to use ---Notes from pluckCode over the experience of Headless CMS Astro Js with WordPress as backend

Astro JS Querying a WordPress GraphQL Server

Query GraphQL for blocks structure and content

Completed BlockRender.astro for multiple block renders.

BlockRender.astro

Special Attention to BlockRenderInner function name for looped block renders onto itself

Install Tailwind CSS for Astro JS notes

Installation to Astro Js for added class styling, flex, grids and media widths. Works in conjunction with the WordPress blocks theme.json file.

Install Tailwind CSS- General notes

Astro comes with Tailwind support out of the box. This example showcases how to style your Astro project with Tailwind.

For complete setup instructions, please see our Tailwind Integration Guide.