👨🏼‍💻Node.js, Express.js | Send Localized Emails With Templates
Introduction
Hello everyone,
On the server-side, we send some emails to the user. For example; an e-mail containing a code or an access link sent in case of forgetting a password, a user warning e-mail after a password change, and a newsletter delivery to the user.
In this article, we will examine how to send email to application users with texts suitable for the language of the user, using template designs, in an application developed with Node.js and Express.js.
Technologies We Will Use
We will basically use 3 libraries in the project:
- i18n
- nodemailer
- nodemailer-express-handlebars
Creation Multilingual use with i18n
In server-side developments, it is necessary to return certain messages to the user with a language translation suitable for the user’s language. The most common library used for this is the “i18n” library.
In the use of this library, we create “json” files specially written for each language we intend to support. In these files, common keywords|phrases and the equivalent of the keyword|word in that language are written. Here, I suggest you look at the relevant document and the articles written on this subject, without going into more detail.
Sending emails with Nodemailer
One of the most common library used in node.js for sending emails is the “nodemailer” library.
Nodemailer configuration varies depending on the email service used. For the example configuration, you can refer to the example I quoted from its official site below.
Creating a semantic template with a Handlebar
The handlebar is a simple templating language. Handlebar allows us to divide the website we developed into parts and manage it with ability to use parametric.
For example; for the website we are working on, we make the bottom part (footer) and top part (header) and body parts with different parameters and designs to come into pieces, and combine them parametrically in the main layout in a certain structure and create a web site. we can get the site.
For detailed information, you can refer to the official document that I give below.
What is express-handlebars?
This library is a library developed for the use of Handlebars in Express and allows us to write a full-stack web page. Thanks to this library, we can establish a structure such as which page is the main page as layout and which pages are partial pages. We can also specify the functions to be used within the displaying pages.
In the following example, I was able to set up the structure that I specified above, by writing the parameters in “engine”. After creating the structure, I want to display the “contactForm” page using the “main” page as the layout.
In the “path.render” function in the example, we can specify that any parameter or object that we send after the first parameter can be used as a variable on the page, just like the “contactForm” parameter.
Although it is off-topic for this article, I have given the use of “express-handlebars” for a better understanding of the use of “nodemailer-express-handlebars”.
In addition, instead of sending emails to view and check and test pages that we designed for each change, we can use “express-handlebars” to view them on the browser as an external page just for development mode. That allows us to fast development.
Why nodemailer-express-handlebars?
In this project, we will use the “nodemailer-express-handlebars” library developed over “express-handlebars” and designed for “nodemailer”.
Unlike the “Sending email with Nodemailer” example above, in the example below, we specify that “nodemailer-express-handlebars” should be used as “compile” before the “sendMail” function.
The “options” parameter in “hbs(opitons)” in the example below is the same as the “engine” function parameters in the “Using Express handlebars” example above, with their structure and purpose of use.
In the example below, you can see that instead of the “text” and “html” parameters in the “sendMail” function, we use the “template” parameter to set the which page will be compiled before sending the email, and we use the “context” parameter for which parameters to be used in this page.
Using i18n in Handlebars
First of all, it is necessary to install i18n in the project and make the necessary configuration settings. Then, we define the “translate” function that we defined from i18n in “helpers” parameters to use in the display page, as in the “Using Nodemailer Express Handlebars” example. By using the “translate” function on the pages we design for email, we can translate the texts on the page in accordance with the language of the user before sending emails.
Ayrıca bir kullanım olarak, tek bir parametre için, şu örnekteki gibi de yazılabilir:
In the code I have written for example below, all the ones that start with “translate” are the functions I defined in the “helpers” in the definition above. In “Helpers” functions, the parameters after the first parameter are passed as a whole. For this reason, we use the function named “translateByHash” that I wrote for text translations that require more than one parameter. Also, as a convenience, for a single parameter, we can write it using “%s” as in the following example:
{{translate “Dear %s” userName}}
Example project coding
You can access the project file that I have compiled and corrected the codes I have given above code pieces from the GitHub link below.
Conclusion
Thanks to this structure we have developed, we have ensured that the emails of the system sent to the users are filed as structure and coding, followed up and coded more properly, the design is better in appearance, and the texts included are language-variable.
Good coding…
