Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/webtretech/nestjs-mailer-react-adapter
📨 Build and send emails in Nest framework using React.js
https://github.com/webtretech/nestjs-mailer-react-adapter
email-template mailer nest nestjs nestjs-mailer nodejs nodemailer react reactjs typescript
Last synced: 7 days ago
JSON representation
📨 Build and send emails in Nest framework using React.js
- Host: GitHub
- URL: https://github.com/webtretech/nestjs-mailer-react-adapter
- Owner: webtretech
- License: mit
- Created: 2022-12-08T22:55:19.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-11-11T13:25:56.000Z (2 months ago)
- Last Synced: 2025-01-12T19:06:43.389Z (9 days ago)
- Topics: email-template, mailer, nest, nestjs, nestjs-mailer, nodejs, nodemailer, react, reactjs, typescript
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/@webtre/nestjs-mailer-react-adapter
- Size: 84 KB
- Stars: 38
- Watchers: 3
- Forks: 3
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
📨 Build and send emails in Nest framework using React.js
## Features
- 🦾 Write your email templates in [React](https://github.com/facebook/react/) and [TypeScript](https://www.typescriptlang.org/)
- 📬 No more template not found / sending blank emails.
- 🔰 No more missing context / variables from template.
- 🧪 Write testable templates intended for email clients.
- 💌 Built on top of [`react-email`](https://github.com/resendlabs/react-email) — the next generation of writing emails.
## Installation
> This library is an adapter for the [`@nestjs-modules/mailer`](https://github.com/nest-modules/mailer) module, so we'll install the dependencies alongside by running the command below.
```sh
npm i @webtre/nestjs-mailer-react-adapter @nestjs-modules/mailer nodemailer
```
### Getting Started
To add support for `React` to your project, modify `tsconfig.json`
```javascript
{
"compilerOptions": {
// add this line
"jsx": "react-jsx"
}
}
```
### Configuration
```javascript
// src/app.module.ts
import { Module } from "@nestjs/common";
import { MailerModule } from "@nestjs-modules/mailer";
import { ReactAdapter } from "@webtre/nestjs-mailer-react-adapter";
@Module({
imports: [
MailerModule.forRoot({
transport: {
host: "smtp.domain.com",
port: 2525,
secure: false,
auth: {
user: "[email protected]",
pass: "password",
},
},
defaults: {
from: '"Webtre Technologies" ',
},
template: {
dir: __dirname + "/templates",
// Use the adapter
adapter: new ReactAdapter(),
// Or with optional config
adapter: new ReactAdapter({
pretty: false,
plainText: true,
htmlToTextOptions: {
wordwrap: 130,
limits: {
ellipsis: "...",
},
},
}),
},
}),
],
})
export class AppModule {}
```
To see more options that can be passed to the `htmlToTextOptions` object, [click here](https://github.com/html-to-text/node-html-to-text/tree/master/packages/html-to-text#options).
### Service Provider
```javascript
import { Injectable } from '@nestjs/common';
import { MailerService } from '@nestjs-modules/mailer';
@Injectable()
export class ExampleService {
constructor(private readonly mailerService: MailerService) {}
async public example(): Promise {
await this.mailerService
.sendMail({
to: '[email protected]',
subject: 'Testing react template',
template: 'welcome', // The compiled extension is appended automatically.
context: { // Data to be passed as props to your template.
code: '123456',
name: 'John Doe',
},
});
}
}
```
### React Template
```javascript
// src/templates/welcome.tsx
interface Props {
code: string;
name: string;
}
export default function Welcome({ name, code }: Props) {
return (
Hi {name}, thanks for signing up. Your code is {code}
);
}
```
## Example
You can also check the [example folder](./example) in this repository for a working usage example.
## Credits
- [`react-email`](https://github.com/resendlabs/react-email) — build and send emails using React
- [`@nestjs-modules/mailer`](https://github.com/nest-modules/mailer) — a mailer module for Nest framework (node.js)
## License
[MIT](./LICENSE) License © 2022 [Webtre Technologies](https://github.com/webtretech)