使用React、Redux Form、Nodemailer和Express发送电子邮件

基础概念

React: 一个用于构建用户界面的JavaScript库，主要用于构建UI组件。

Redux Form: 一个用于管理表单状态的库，它与Redux集成，使得表单的状态管理更加容易。

Nodemailer: 一个Node.js模块，用于发送电子邮件。

Express: 一个简洁而灵活的Node.js Web应用程序框架，提供了一系列强大的特性来帮助创建各种Web和移动设备应用。

类型与应用场景

类型:

前端: React + Redux Form
后端: Express + Nodemailer

应用场景:

用户注册确认邮件
密码重置邮件
通知和提醒邮件

示例代码

前端 (React + Redux Form)

import React from 'react';
import { Field, reduxForm } from 'redux-form';

const EmailForm = (props) => {
  const { handleSubmit } = props;
  return (
    <form onSubmit={handleSubmit}>
      <Field name="email" component="input" type="email" placeholder="Email" />
      <button type="submit">Send Email</button>
    </form>
  );
};

export default reduxForm({
  form: 'emailForm'
})(EmailForm);

后端 (Express + Nodemailer)

const express = require('express');
const bodyParser = require('body-parser');
const nodemailer = require('nodemailer');

const app = express();
app.use(bodyParser.json());

let transporter = nodemailer.createTransport({
  service: 'gmail',
  auth: {
    user: 'your-email@gmail.com',
    pass: 'your-email-password'
  }
});

app.post('/send-email', (req, res) => {
  const { email } = req.body;
  let mailOptions = {
    from: 'your-email@gmail.com',
    to: email,
    subject: 'Test Email',
    text: 'This is a test email sent using Nodemailer.'
  };

  transporter.sendMail(mailOptions, (error, info) => {
    if (error) {
      res.status(500).send(error);
    } else {
      res.status(200).send('Email sent: ' + info.response);
    }
  });
});

app.listen(3000, () => console.log('Server running on port 3000'));