Tool for rendering multilingual templates sent to E-mail
Go to file
2019-06-05 23:08:00 +03:00
scripts Integrate crowdin and pull locales 2019-05-11 01:16:21 +03:00
src Implemented server application that renders templates 2019-06-05 22:16:31 +03:00
webpack-utils Allow to customize base resources root for rendered text images 2019-06-03 01:57:13 +03:00
.eslintrc.js Integrate @elyby/eslint-plugin and apply its fixes 2019-05-28 23:42:13 +03:00
.gitignore Cleanup 2019-06-01 13:41:20 +03:00
.travis.yml Add travis config 2019-06-05 23:08:00 +03:00
package.json Add travis config 2019-06-05 23:08:00 +03:00
README.md Readme.md 2019-06-05 22:55:17 +03:00
tsconfig.json Migrate project's code base to TypeScript 2019-05-13 02:27:07 +03:00
webpack.config.js Implemented server application that renders templates 2019-06-05 22:16:31 +03:00
yarn.lock Implemented server application that renders templates 2019-06-05 22:16:31 +03:00

E-mails renderer

An internal tool used to render beautiful multilingual E-mail templates on the Accounts Ely.by project. The template engine uses React.js components, which are rendered into pure HTML with inlined styles, ready to be sent to the mail.

Each directory in emails dir corresponds to separate email template. Each email component will receive payload, passed from command line:

Development

First of all you need a copy of the repository. If you are planning to send a Pull Request, first create a fork of the repository. Then run the following commands:

# Clone your fork
git clone https://github.com/<your_username>/emails-renderer.git
# Switch to the project folder
cd emails-renderer
# Install dependencies
yarn install

For the purpose of development, the project has a convenient development server and a toolbar that simplifies templates debugging. To run it, use the start command:

yarn start

The server will be started at port 8080. You can open it in your browser by going to http://localhost:8080.

Email component structure

  • index.ts — required. This file should export the main component, which will receive payloads.
  • fixtures.ts — an optional file exports hash {featureId: payload, featureId2: payload}. Use this to create data samples for testing in dev mode.
  • styles.ts — an optional file, that will hold styles objects for email components to allow styles inlining.
  • messages.intl.json — an optional file, that exports hash with {messageId: defaultMessage} for react-intl.

Translating

Ely.by translation is done through the Crowdin service. Click here to participate in the translation of the project.