Search code examples
javascriptreactjssmtp

Sending emails with Reactjs


I am trying to use an API for sending emails with JavaScript, it's called SmptJs. The API works perfectly when integrated in a simple HTML file, but I don't know how to integrate it in a reactJs component!

Here is the API link and doc: https://smtpjs.com/

I tried it first in my HTML page, like this: code of html file

And it worked, I received the email. But I want to add the API inside my React Component, specifically when I click submit in my form but I got an error and I think it's not compatible with ReactJs syntax, here is the image:

code of react component

the error msg


Solution

  • Checkout the simple component with example here https://jsfiddle.net/92a68tmz/

    You have to include the tag of smtpjs in your public/index.html or general index.html file in your project and you can use it like this

     sendMail() {
         window.Email.send({
            SecureToken : "C973D7AD-F097-4B95-91F4-40ABC5567812",
            To : 'them@website.com',
            From : "you@isp.com",
            Subject : "This is the subject",
            Body : "And this is the body"
        }).then(
      message => alert(message)
    );
    

    in your onSubmit you directly use this

         const onSubmit = data => {
                  window.Email.send({
                        SecureToken : "C973D7AD-F097-4B95-91F4-40ABC5567812",
                        To : data.email,
                        From : "you@isp.com",
                        Subject : "This is the subject",
                        Body : "And this is the body" + data.firstname
                    }).then(
                        message => alert(message)
          }
    

    No need for a separate Emailer component.