{"id":15020885,"url":"https://github.com/webtretech/nestjs-mailer-react-adapter","last_synced_at":"2025-04-06T13:09:15.421Z","repository":{"id":64567103,"uuid":"576055929","full_name":"webtretech/nestjs-mailer-react-adapter","owner":"webtretech","description":"📨 Build and send emails in  Nest framework using React.js","archived":false,"fork":false,"pushed_at":"2025-03-12T16:21:48.000Z","size":95,"stargazers_count":41,"open_issues_count":0,"forks_count":4,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-03-29T06:05:05.607Z","etag":null,"topics":["email","email-template","mail","mailer","nest","nestjs","nestjs-mailer","nodejs","nodemailer","react","reactjs","typescript"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/@webtre/nestjs-mailer-react-adapter","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/webtretech.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-12-08T22:55:19.000Z","updated_at":"2025-03-24T21:06:24.000Z","dependencies_parsed_at":"2024-05-16T12:49:14.069Z","dependency_job_id":"a85e4477-af16-4b7e-8173-47ea08abbf14","html_url":"https://github.com/webtretech/nestjs-mailer-react-adapter","commit_stats":{"total_commits":81,"total_committers":3,"mean_commits":27.0,"dds":0.03703703703703709,"last_synced_commit":"477d1329f4ef3999364b031145b3f321957bb8ac"},"previous_names":[],"tags_count":17,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webtretech%2Fnestjs-mailer-react-adapter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webtretech%2Fnestjs-mailer-react-adapter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webtretech%2Fnestjs-mailer-react-adapter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webtretech%2Fnestjs-mailer-react-adapter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/webtretech","download_url":"https://codeload.github.com/webtretech/nestjs-mailer-react-adapter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247485287,"owners_count":20946398,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["email","email-template","mail","mailer","nest","nestjs","nestjs-mailer","nodejs","nodemailer","react","reactjs","typescript"],"created_at":"2024-09-24T19:55:48.525Z","updated_at":"2025-04-06T13:09:15.394Z","avatar_url":"https://github.com/webtretech.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"http://nestjs.com/\" target=\"blank\"\u003e\n    \u003cimg src=\"https://nestjs.com/img/logo-small.svg\" width=\"120\" alt=\"Nest Logo\" /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  📨 Build and send emails in Nest framework using React.js\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@webtre/nestjs-mailer-react-adapter\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@webtre/nestjs-mailer-react-adapter.svg\" alt=\"NPM Version\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@webtre/nestjs-mailer-react-adapter\"\u003e\u003cimg src=\"https://img.shields.io/npm/l/@webtre/nestjs-mailer-react-adapter.svg\" alt=\"Package License\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@webtre/nestjs-mailer-react-adapter\"\u003e\u003cimg src=\"https://img.shields.io/npm/dm/@webtre/nestjs-mailer-react-adapter.svg\" alt=\"NPM Downloads\" /\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n## Features\n\n- 🦾 Write your email templates in [React](https://github.com/facebook/react/) and [TypeScript](https://www.typescriptlang.org/)\n\n- 📬 No more template not found / sending blank emails.\n\n- 🔰 No more missing context / variables from template.\n\n- 🧪 Write testable templates intended for email clients.\n\n- 💌 Built on top of [`react-email`](https://github.com/resendlabs/react-email) — the next generation of writing emails.\n\n## Installation\n\n\u003e 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.\n\n```sh\nnpm i @webtre/nestjs-mailer-react-adapter @nestjs-modules/mailer nodemailer\n```\n\n### Getting Started\n\nTo add support for `React` to your project, modify `tsconfig.json`\n\n```javascript\n{\n  \"compilerOptions\": {\n    // add this line\n    \"jsx\": \"react-jsx\"\n  }\n}\n```\n\n### Configuration\n\n```javascript\n// src/app.module.ts\nimport { Module } from \"@nestjs/common\";\nimport { MailerModule } from \"@nestjs-modules/mailer\";\nimport { ReactAdapter } from \"@webtre/nestjs-mailer-react-adapter\";\n\n@Module({\n  imports: [\n    MailerModule.forRoot({\n      transport: {\n        host: \"smtp.domain.com\",\n        port: 2525,\n        secure: false,\n        auth: {\n          user: \"user@domain.com\",\n          pass: \"password\",\n        },\n      },\n      defaults: {\n        from: '\"Webtre Technologies\" \u003chello@domain.com\u003e',\n      },\n      template: {\n        dir: __dirname + \"/templates\",\n        // Use the adapter\n        adapter: new ReactAdapter(),\n\n        // Or with optional config\n        adapter: new ReactAdapter({\n          pretty: false,\n          plainText: true,\n          htmlToTextOptions: {\n            wordwrap: 130,\n            limits: {\n              ellipsis: \"...\",\n            },\n          },\n        }),\n      },\n    }),\n  ],\n})\nexport class AppModule {}\n```\n\nTo 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).\n\n### Service Provider\n\n```javascript\nimport { Injectable } from '@nestjs/common';\nimport { MailerService } from '@nestjs-modules/mailer';\n\n@Injectable()\nexport class ExampleService {\n  constructor(private readonly mailerService: MailerService) {}\n\n  async public example(): Promise\u003cvoid\u003e {\n    await this.mailerService\n      .sendMail({\n        to: 'john@domain.com',\n        subject: 'Testing react template',\n        template: 'welcome', // The compiled extension is appended automatically.\n        context: { // Data to be passed as props to your template.\n          code: '123456',\n          name: 'John Doe',\n        },\n      });\n  }\n}\n```\n\n### React Template\n\n```javascript\n// src/templates/welcome.tsx\ninterface Props {\n  code: string;\n  name: string;\n}\n\nexport default function Welcome({ name, code }: Props) {\n  return (\n    \u003cdiv\u003e\n      Hi {name}, thanks for signing up. Your code is {code}\n    \u003c/div\u003e\n  );\n}\n```\n\n## Examples\n\nYou could also check the [examples folder](./examples) in this repo for a working usage example and how to set it up with [SWC](https://docs.nestjs.com/recipes/swc) using [gulp](https://gulpjs.com/).\n\n## Credits\n\n- [`react-email`](https://github.com/resendlabs/react-email) — build and send emails using React\n- [`@nestjs-modules/mailer`](https://github.com/nest-modules/mailer) — a mailer module for Nest framework (node.js)\n\n## License\n\n[MIT](./LICENSE) License © 2022 [Webtre Technologies](https://github.com/webtretech)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebtretech%2Fnestjs-mailer-react-adapter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwebtretech%2Fnestjs-mailer-react-adapter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebtretech%2Fnestjs-mailer-react-adapter/lists"}