dev.to is a widely recognized and highly esteemed community dedicated to developers from all around the globe. It serves as a platform for thousands of developers to learn, share, and publish their experiences with leveraging technology in their work.
One other thing that piqued my curiosity is the dev.to community Digest I frequently get in my inbox. The email digest helps me stay informed about some of the top articles I am interested in.
Dev.to Email Community Digest
In the first part of this article, I covered how to develop a system similar to dev.to's In-App Notification system in less than 30 minutes. Now, I'll show you how to build an automated email community digest similar to this using Novu.
Add a Digest & Email Node to Existing Workflow on Novu
All notifications are sent via a workflow. A workflow acts as a container for the logic and blueprint associated with any type of notification in your app.
All the channels (Email, SMS, In-App, Push) are tied together under a single entity in a workflow.
In the previous article, we already created a workflow. Now, let's add a Digest node to it:
- Open the existing
Devto Notifications
Workflow. - Click on the + icon under the In-App node and select Digest.
- Click on the Digest node. A modal will open where you can set how long events need to be digested before the next action. In this case, the next action will be sending an email to subscribers.
- Set 1 minute for the digest. Feel free to experiment with this. You can set any custom minute or hour needed.
- The
digest
node allows you to set a specific time interval for when notifications should be sent. - We need to access all the digested event payloads in order to show the subscriber all or parts of the events included in this digest. For example: “Prosper and 2 others liked your photo.”
- In our case, we need all post titles and links that have been published by anyone in the past minute to be sent in one email to subscribers.
- Click on the + icon again to add the Email channel.
-
Click on the Email channel node to add content. Don't forget to click the Update button when you're finished.
- Add the content below to it. This is a digest template:
<p> Hey Dev.to Subscriber, <p>
<p>Here are some recent community posts just for you </p>
{{#each step.events}}
<a href="{{article_url}}" style="font-weight:bold;">
<h3>{{article_title}}</h3>
</a>
<br/>
{{/each}}
As part of the digested template, you will have access to a few properties:
- step.events: An array of all the events aggregated under this digest.
- step.total_count: The number of total events in this digest.
- step.digest: A boolean flag to indicate if we are in digest mode right now.
In the code above, we are looping through the step.events to grab all the events that have happened in the action before sending an email.
The action here is on In-App push notifications. Novu collects all the In-App push notifications that occur within a one-minute digest time. It then uses the specified payload (in this case, article_url and article_title) to determine the content to display in the email sent to subscribers. It's quite impressive!
Publish to dev.to via the API with POSTMAN or Insomnia
Fire up either POSTMAN or Insomnia again and publish as many articles as possible within the space of a minute.
Firstly, the In-App notifications will appear as intended. No surprises here. We already went through this in the previous part of this series.
Wait for a minute. You should receive an email after a minute with all of the articles published within that timeframe.
The email just arrived in my inbox. Just like on dev.to!
The body of the email contains a digest of all the content published within a minute.
That's all. Now, we have a dev.to email community digest.
Note: Feel free to style the email content to look as pretty as dev.to’s community digest.
More on Using Digest
There are numerous scenarios where using a notification digest in your app can be beneficial.
- For instance, if you're developing a social media app like Instagram, TikTok, or a LinkedIn-like app that requires frequent user interaction notifications, it's wise to digest these notifications. To avoid overwhelming users and risking app uninstalls or notification disabling, manage your notification volume effectively.
- Similarly, if you're building the next GitHub or a web app requiring constant email notifications, take care with your notification strategy. Using an email digest can be a practical solution!
For more information, refer to this comprehensive guide on the different types of digests available and learn how you can configure them in your app with Novu.
Conclusion
We have successfully incorporated an email community digest into our app without making any changes to the existing codebase. We only made a few changes in our Novu dashboard.
I prayed for days like these a decade ago. They're here and they powerfully demonstrate how we can leverage excellent tools to move quickly, iterate, focus on business logic and build a million-dollar business 😁
I’ll leave you with these two guides that show in detail how to:
Don’t hesitate to ask any questions or request support. You can find me on Discord and Twitter. Please feel free to reach out.