notifme-template v1.0.0
Features
All your notifications in one place — Define all your
email,sms,push, andwebpushtemplates in one folder :thumbsup:Choose your template engine —
facebook/react,pug (formerly jade),mozilla/nunjucks,handlebars.js,mustache.js,lodash,underscore,marko,doT,swig,linkedin/dustjs,twig.js,ejs... and many more. Literally the one you want :dancer:Complete control — No magic: you define all the behaviours you need (layouts, CSS preprocessor...) :rocket:
No dependencies — Lightning fast installation :zap:
Localization — Easily implement i18n/l10n for all your notifications :globe_with_meridians:
CSS inlining — Add Juice to your dependencies and the CSS in your emails will automatically be inlined :ribbon:
MIT license — Use it like you want.
Getting Started
$ yarn add notifme-template// Example with nunjucks template engine ($ yarn add nunjucks)
const nunjucks = require('nunjucks')
const getRenderer = require('notifme-template')
const render = getRenderer(nunjucks.renderString, './templates')
const data = {user: {firstname: 'John', email: 'john@example.com'}}
render('welcome', data, 'en-US').then((notification) => {
// Send the notification on its channels
})// ./templates/welcome.js
module.exports = () => ({
name: 'welcome',
title: 'Welcome {{user.firstname}}',
version: 1,
channels: {
sms: {
from: '{{smsFrom}}',
to: '{{user.phone}}',
text: "Hi {{user.firstname}}, we're very happy to welcome you on board!"
},
email: {
from: '{{emailFrom}}',
to: '{{user.email}}',
subject: 'Welcome {{user.firstname}}',
html: `{% extends "templates/_layouts/email-transactional.html" %}
{% block content %}
Hi {{user.firstname}},<br><br>
We're very happy to welcome you on board.<br><br>
See you soon!
{% endblock %}`
},
push: {
registrationToken: '{{user.pushToken}}',
title: 'Welcome {{user.firstname}}',
body: "Hi {{user.firstname}}, we're very happy to welcome you on board"
}
},
sampleData: {
smsFrom: 'Notifme',
emailFrom: '"David, Notif.me team" <david@example.com>',
user: {
firstname: 'John',
email: 'john@example.com',
phone: '+15000000001',
pushToken: 'xxxxx'
}
}
})See a complete working example for more details.
How to use
Constructor options
const getRenderer = require('notifme-template')
const render = getRenderer(/* renderer, folder, options */)| Argument name | Type | Required | Description | |
|---|---|---|---|---|
renderer | Function | true | Template engine function to use. It must implement (templateName: string, data: Object) => string | Promise<string>. |
folder | string | true | The path to the folder containing all your templates. | |
options | Object | false | See options definition. |
This returns the render function documented below.
Template declaration
project/
│
└───templates/ <= you can place this folder where you want and choose its name
│ template1.js
│
└───template2/
│ index.jsWith the structure above, you will have two templates template1 and template2. notifme-template makes a dynamic require require(`${path.resolve(folder, templateName)}`) the first time you call them.
Each template must export a function implementing: (lang: string) => TemplateType | Promise<TemplateType>. See TemplateType definition and examples for more details.
render method
render(/* templateName, data, lang */).then((notification) => {
// Send the notification on its channels
})| Argument name | Type | Required | Description |
|---|---|---|---|
templateName | string | true | The template name to use. |
data | Object | true | Data to use when rendering the notification. |
lang | string | false | User language. |
This returns a Promise resolving with the rendered template.
Contributing
Contributions are very welcome!
To get started: fork this repository to your own GitHub account and then clone it to your local device.
$ git clone git@github.com:[YOUR_USERNAME]/notifme-template.git && cd notifme-template
$ yarn installNeed Help? Found a bug?
Submit an issue to the project Github if you need any help. And, of course, feel free to submit pull requests with bug fixes or changes.
8 years ago