DEV Community

Cover image for Create an email list with React + Mailchimp

Create an email list with React + Mailchimp

Gedalya Krycer on May 03, 2021

In this tutorial... We are going to build a custom subscriber form in React and connect it to a Mailchimp audience (list). ⚛️ 📤 🙉 Mai...
Collapse
 
code_rabbi profile image
Emeka Orji •

Thank you so much @gedalyakrycer . I promised myself that your article was the last place I would stop in getting MailchimpSubscribe to work on my site

Cause I have been trying(from scratch each time) and it was not working and the crazy thing is; I couldn't figure out what I was missing.
But I followed this tutorial and did everything almost verbatim and it worked...Thanks

Collapse
 
qpwoeiruty profile image
Qpwoeiruty •

Hi!
I got this error:

./components/Mailchimp/CustomForm.js:4:0
Module not found: Can't resolve '../../ui/InputField/InputField'
2 | import './mcFormStyles.scss';
3 | import MailchimpSubscribe from 'react-mailchimp-subscribe';

4 | import InputField from '../../ui/InputField/InputField';
5 |
6 | const CustomForm = ({ status, message, onValidated }) => {
7 | const [email, setEmail] = useState('');

Collapse
 
imahmoud profile image
Mahmoud Ibrahiam •

Useful and great article, but i think that you can call api directly instead of using external packages.

You can use e.target.reset() to reset inputs.

Collapse
 
gedalyakrycer profile image
Gedalya Krycer •

Oh nice! Thank you for the feedback.

Collapse
 
sahdibernardi profile image
Sahra Di Bernardi •

AMAZING! It is still working in October 2023. I was hopeless trying to connect it via APIKey, but this was SO MUCH easier I cannot even begin to describe it. Thank you for putting this in such an easy way with a step-by-step guide.

Collapse
 
humbertoromanojr profile image
Humberto Junior •

Thanks friend Gedalya for tutorial, i will configure in my personal project.

Collapse
 
eulazzo profile image
Lázaro Vanderson •

Thank you so much. This helps a lot.
I did this on my personal project, and everything works just fine.

Collapse
 
qpwoeiruty profile image
Qpwoeiruty •

Sorry, i just find tour repository with your project. Thank you!

github.com/GedalyaKrycer/genhybrid...

Collapse
 
fannglu profile image
Fang Lu Lim •

How do you call the env file? on my console it's stating "undefined" on the URL

Collapse
 
subhocodegeek profile image
Subhamay Paul •

I can't susbscribe to it. It shows 'Timeout' everytime after 'Sending'

Collapse
 
ryanadiaz profile image
Ryan Diaz • • Edited

Worked like a charm! Thank you for putting this together! Confirming this still works in 2023!