Adding a contact form

Posted on 24th January 2020

A stock image of a red Royal Mail postbox

I woke today to an email from Hashim at the GatsbyJS team telling me that challenge #4 in the 100 Days of Gatsby program was here.

Challenge 4 - Add Third-Party React Components to Your Gatsby Site

Over the course of the last few weeks, I've been getting to grips with Gatsby and while my initial progress was based on the blog starter tutorial, I've been adding things here and there in a kind of sporadic manner.

As part of this, I've had to install several extras to the site, but these have been so easy, I don't know why NPM hasn't been as big a part of my development life until now!

Looking at the dependencies list in package.json, I've already amassed a fair few on top of the basic blog starter, so I'd say I'm pretty comfortable with that whole process by now. Here's a peek at some of the extras this site has gained in the last 24 days...


Today's enhancement

Today, as the prompt in the email suggested that I add a contact form to the site using the Formik plugin, I have added one more dependency to that list.

Again, this was a well documented package that was well explained and straightforward enough to integrate, it's designed for React sites after all. I just had to find a submission handler (in this case I opted for GetForm) and get it on a page, which you can see here on the Contact page.

If you end up using the form I hope you enjoy the experience, like everything on this site it's all been built as part of a learning process, so if you encounter any problems let me know - especially as you now have one more way to get in touch 😀

🙏 Special Thanks

Kudos for the photo by Dele Oke on Unsplash, keep up the great work!

Enjoyed this post? Feel free to share it with your audience using the links below:

Don't see your favourite social network on the list? Feel free to let me know and I'll get it added.


©2022 Pursuit of Loot. All rights reserved.