This project is a simple client for sending emails through the Resend.com API. It's built with React and uses Axios for API calls, Yup for form validation, and Day.js for date and time formatting.
- Send emails using the Resend.com API
- Great for cold email outreach
- Load a long batch of emails by comma-separation
- Support for variables in messages (e.g.
{fromName}
,{toName}
,{fromEmail}
,{toEmail}
,{currentDate}
,{currentTime}
) - Form validation using Yup - removes invalid emails!
- Alerts for successful emails / errors
- Instant preview of the rendered email
- Support for using temporary API key in browser or save it in
.env
- Clone the repository:
git clone https://github.com/neontomo/resend-cold-emailer.git
- Navigate to the project directory:
cd resend-cold-emailer
- Install the dependencies with your package manager of choice:
yarn install # yarn
npm install # or with npm
pnpm install # or with pnpm
- Generate an API key from Resend.com and set up your custom domain DNS records:
- Rename the
.env.example
file to.env
in the project root, and modify it to include your Resend API key:
RESEND_API_KEY="your-api-goes-key-here"
- Edit your default email templates in the
.env
file, or make them blank:
NEXT_PUBLIC_RESEND_FROM_NAME="Tomo"
NEXT_PUBLIC_RESEND_FROM_EMAIL="[email protected]"
NEXT_PUBLIC_RESEND_SUBJECT="Can I help you get more customers?"
NEXT_PUBLIC_RESEND_MESSAGE="Hi, {toName}!\n\nI hope you're doing well. I'm {fromName}, and I help businesses like yours get more customers.\n\nI'd love to learn more about your business and see if I can help you grow.\n\nDo you have time for a quick chat this week?\n\nKind regards,\n{fromName}"
- Start the development server:
yarn dev # yarn
npm run dev # or with npm
pnpm dev # or with pnpm
- Open your browser and navigate to http://localhost:3000.
- Fill out the form with the recipient's name, email address, your name and email address, a subject line and message.
- Click the "Send Email" button.
- If the email is sent successfully, you will see a success alert.
- If there is an error, you will see an error alert.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.