The Beginner's Guide To Node Mailer With Nodejs
Tags: javascript, beginners, webdev, node
Published: 2022-12-29 13:11:02

**Node.js** is a JavaScript runtime built on Chrome's V8 JavaScript engine, and Node.js provides an easy way to send **emails** using its built-in library called `nodemailer`.

To use `nodemailer`, you will need to install it first. You can do this by running the following command in your terminal:

```
npm install nodemailer
```

Once `nodemailer` is installed, you can use it to send **emails** in your Node.js application by **requiring** the library and creating a **transporter** object.

```js
const nodemailer = require('nodemailer');

// create a transporter object
const transporter = nodemailer.createTransport({
  service: 'gmail', // use a service that allows you to send emails (e.g. Gmail, Outlook, etc.)
  auth: {
    user: 'your@email.com', // your email address
    pass: 'yourpassword' // your email password
  }
});
```

Next, you can use the **transporter** object to send an email by calling the `sendMail` function and passing it an object with the **email details**.

```js
const mailOptions = {
  from: '"Your Name" <your@email.com>', // sender address
  to: 'recipient@email.com', // list of receivers
  subject: 'Subject Line', // Subject line
  text: 'Plain text content', // plain text body
  html: '<b>HTML</b> content' // html body
};

// send the email
transporter.sendMail(mailOptions, (error, info) => {
  if (error) {
    console.log(error);
  } else {
    console.log('Email sent: ' + info.response);
  }
});
```
That's it! You can now send emails using **Node.js** and `nodemailer`.

Here is the full code example:

```js
const nodemailer = require('nodemailer');

// create a transporter object
const transporter = nodemailer.createTransport({
  service: 'gmail',
  auth: {
    user: 'your@email.com',
    pass: 'yourpassword'
  }
});

const mailOptions = {
  from: '"Your Name" <your@email.com>',
  to: 'recipient@email.com',
  subject: 'Subject Line',
  text: 'Plain text content',
  html: '<b>HTML</b> content'
};

// send the email
transporter.sendMail(mailOptions, (error, info) => {
  if (error) {
    console.log(error);
  } else {
    console.log('Email sent: ' + info.response);
  }
});
```

---

> Here is an example of how you can use nodemailer with `React` to send emails from a form:

```js
import { useState } from 'react';
import nodemailer from 'nodemailer';

function ContactForm() {
  const [formState, setFormState] = useState({
    name: '',
    email: '',
    subject: '',
    message: ''
  });

  const [errorMessage, setErrorMessage] = useState('');

  const handleChange = event => {
    setFormState({
      ...formState,
      [event.target.name]: event.target.value
    });
  };

  const handleSubmit = event => {
    event.preventDefault();

    if (!formState.name || !formState.email || !formState.subject || !formState.message) {
      setErrorMessage('All fields are required.');
      return;
    }

    // create a transporter object
    const transporter = nodemailer.createTransport({
      service: 'gmail',
      auth: {
        user: 'your@email.com',
        pass: 'yourpassword'
      }
    });

    // create the email options
    const mailOptions = {
      from: `"${formState.name}" <${formState.email}>`,
      to: 'recipient@email.com',
      subject: formState.subject,
      text: formState.message
    };

    // send the email
    transporter.sendMail(mailOptions, (error, info) => {
      if (error) {
        console.log(error);
      } else {
        console.log('Email sent: ' + info.response);
      }
    });
  };

  return (
    <form onSubmit={handleSubmit}>
      <label htmlFor="name">Name:</label>
      <input
        type="text"
        name="name"
        value={formState.name}
        onChange={handleChange}
      />
      {errorMessage && <div>{errorMessage}</div>}

      <label htmlFor="email">Email:</label>
      <input
        type="email"
        name="email"
        value={formState.email}
        onChange={handleChange}
      />

      <label htmlFor="subject">Subject:</label>
      <input
        type="text"
        name="subject"
        value={formState.subject}
        onChange={handleChange}
      />

      <label htmlFor="message">Message:</label>
      <textarea
        name="message"
        value={formState.message}
        onChange={handleChange}
      />

      <button type="submit">Send</button>
    </form>
  );
}

export default ContactForm;
```

I hope this helps! Let me know if you have any questions.