Astro components for Netlify features

This morning, I released the first version of astro-netlify-components,a library of Astro components for Netlify. I was about to start dogfooding the functionality in my own site, and I figured I might as well share it with the world.

There are two exported component at launch:

• <Form>: adds all the of the markup for Netlify Forms with types and validation
• <CMS>: a full-page component to render the Netlify CMS admin interface

To add either component to your, add the package to your project:

npm i astro-netlify-components

Then, import the components and use in your Astro page:

---
import CMS from "astro-netlify-components/CMS.astro";
import Form from "astro-netlify-components/Form.astro";
---

CMS renders a full page, so import and invoke it on a page of its own:

---
// src/pages/admin.astro
import CMS from "astro-netlify-components/CMS.astro";
---

Form expects children, so you could set up a contact form on your site like this:

---
// src/pages/contact.astro
import Form from "astro-netlify-components/Form.astro";
---


  
    Name
    
  
  
    Email
    
  
  
    Message
    
  
  Submit

If you want to give it a try, make sure to checkout the documentation and file any issues you encounter.

Happy coding!