ایجاد یک سیستم اعلان با Novu و SendGrid

TL; DR
در این آموزش، ما ابزاری ایجاد می کنیم که می تواند اعلان های ایمیل را ارسال کند. برای انجام این کار، از قدرت زیرساخت اعلان منبع باز Novu در کنار SendGrid برای مدیریت سیستم های ایمیل خود استفاده خواهیم کرد.
معرفی
سیستم اعلان به طور گسترده ای به عنوان یک روش موثر برای توسعه دهندگان برنامه و بازاریابان برای تعامل با کاربران شناخته شده است. و با کمک ابزارهای اعلان منبع باز، توسعه دهندگان می توانند خطوط لوله اعلان خود را ایجاد کنند. آنها نه تنها اجازه می دهند تا راه حل های سفارشی بهتری داشته باشند، بلکه می توانند دردسر ایجاد کامل یک پلت فرم داخلی را نیز از بین ببرند.
و بهترین گزینه برای زیرساخت اطلاع رسانی، به نظر من، Novu است. این یک پلتفرم فوقالعاده است که میتواند انواع اعلانها را مدیریت کند، و راهاندازی آن در کنار ارائهدهندگانی مانند SendGrid برای مدیریت ایمیلها، پیامکها و موارد دیگر آسان است.
Novu چیست؟
Novu یک زیرساخت اعلان منبع باز است که قرار است ارتباطات و اعلان ها را برای تیم های توسعه دهنده آسان تر کند. و با یک API یکپارچه و ادغام با ابزارهای محبوب مانند SendGrid، MailChimp و Twilio، فرصت های بی پایانی را ارائه می دهد.
یکی از ویژگیهای کلیدی پلتفرم Novu، ارائه یک داشبورد مدیریتی و یک مکان متمرکز است که در آن توسعهدهندگان میتوانند اعلانها و اطلاعات را بهعنوان بخشی از فرآیند توسعه دریافت کنند. و از آنجایی که این یک پروژه منبع باز است، سطوح بیشتری از امنیت، شفافیت و سهولت استفاده را ارائه می دهد. همه اینها نسبت به سایر فناوری های مشابه در دسترس تر است.
ایجاد یک سیستم اطلاع رسانی با Novu
طبیعتاً، برای شروع باید برای یک حساب Novu ثبت نام کنیم. خوشبختانه سطح رایگان تمام چیزی است که برای این پروژه آزمایشی نیاز داریم، اما اگر میخواهید چیزی بسازید که مقیاس بهتری داشته باشد، سطوح دیگری نیز وجود دارد. شما همچنین این گزینه را دارید که Novu خود را میزبانی کنید، اما ما امروز به آن نخواهیم پرداخت.
هنگامی که یک حساب کاربری داشته باشیم، یک الگوی اعلان جدید در آن ایجاد می کنیم اطلاعیه برگه
سپس باید برخی از اطلاعات اولیه مانند نام، توضیحات، گروه و جزئیات را وارد کنیم. نامی که انتخاب میکنیم میتواند برای فعال کردن این اعلان خاص در کد ما بعداً استفاده شود.
اکنون که قالب خود را داریم، باید یک گردش کار برای آن ایجاد کنیم. ما می توانیم این کار را در داخل انجام دهیم ویرایشگر گردش کار* برگه
در اینجا، میتوانید انتخاب کنید که هر زمان که اعلانی فعال شود، چه رویدادی رخ دهد. بنابراین ما یکی را راه اندازی می کنیم که برای ارسال ایمیل کار کند، زیرا می خواهیم از SendGrid برای مدیریت ایمیل ها در پروژه خود استفاده کنیم.
این الگوی درونبرنامهای قابل تنظیم است، بنابراین ما آن را برای نیازهای خود راهاندازی میکنیم و آنچه را که در اعلانهایمان وجود دارد ایجاد میکنیم.
نحوه اتصال SendGrid با Novu
اکنون که الگوی اعلان خود را داریم، به سرویس ایمیل خود می رویم. ما از SendGrid به عنوان یک ارائه دهنده ایمیل استفاده خواهیم کرد، یکی از بسیاری که Novu می تواند با آن ادغام شود
پس از ایجاد حساب کاربری، به احراز هویت فرستنده بخش در پانل سمت چپ شما، و سپس کلیک کنید یک فرستنده را تأیید کنید بنابراین ما می توانیم Novu را متصل کنیم.
بعد، انتخاب کنید کلیدهای API که در تنظیمات و کلیک کنید کلید API ایجاد کنید در گوشه سمت راست بالا
نام کلید API را وارد کرده و انتخاب کنید دسترسی کامل برای مجوزهای ما مطمئن شوید که یک کپی تهیه کرده و آن را در دسترس داشته باشید، زیرا بعداً باید آن را به Novu وصل کنید.
اکنون که این کار انجام شد، باید آن را به Novu وصل کنیم. به داشبورد Novu برگردید، به قسمت بروید فروشگاه ادغامو SendGrid را انتخاب کنید.
در قسمت اول کلید API را از SendGrid و در فیلد دوم آدرس ایمیل تایید شده ما را وارد کنید. و برای فیلد سوم، باید نام فرستنده خود را وارد کنیم. بعد از آن دکمه به روز رسانی را فشار دهید، و ما برای استفاده از SendGrid آماده خواهیم بود!
ادغام Novu در پروژه شما
پس از راه اندازی Novu و SendGrid، باید آنها را در یک پروژه ادغام کنیم! به خاطر این آموزش، ما فرض می کنیم که شما قبلاً یک پروژه Node.js موجود دارید.
می توانید Novu را با این دستور NPM نصب کنید:
npm install @novu/node
اکنون که در پروژه ما است، برای استفاده از آن باید کلید Novu API خود را اضافه کنیم. این را به کد موجود خود اضافه کنید:
import { Novu } from '@novu/node';
const novu = new Novu(process.env.NOVU_API_KEY);
در اینجا، متغیرهایی را که برای سیستم خود نیاز داریم اضافه می کنیم. اینها همان متغیرهایی برای اعلان ایمیل ما هستند که Novu برای مشترکین ما استفاده می کند.
await novu.subscribers.identify([user.id](http://user.id/), {
email: user.email_id,
firstName: user.first_Name,
});
Novu همچنین یک مؤلفه وب ارائه می دهد که می تواند در قسمت جلویی شما قرار گیرد، که ما از آن استفاده خواهیم کرد:
<!DOCTYPE html>
<html lang="en">
<head>
<script src="[https://novu-web-component.netlify.app/index.js](https://novu-web-component.netlify.app/index.js)"></script>
</head>
<body>
<notification-center-component
style="display: inline-flex"
application-identifier="YOUR_APP_IDENTIFIER"
subscriber-id="YOUR_SUBSCRIBER_ID"
></notification-center-component>
<script>
// here you can attach any callbacks, interact with the web component API
let nc = document.getElementsByTagName('notification-center-component')[0];
nc.onLoad = () => console.log('hello world!');
</script>
</body>
</html>
سپس، ما می توانیم به لطف شناسه اعلان خود، اعلان ها را ارسال کنیم:
await novu.trigger('Welcome Notification', {
to: "subscriberId"
payload: {
userName: "Muthu"
},
});
اکنون، هر زمان که عملکرد ما اجرا شود، مشترک ما یک ایمیل و یک اعلان در مرکز اطلاع رسانی برنامه شما دریافت می کند. ساده است، درست است؟
جمع بندی
اعلانها تقریباً یک چیز ضروری برای اکثر برنامههای امروزی هستند. آنها راهی را برای کاربران شما ارائه می دهند تا از همه چیز در پلتفرم شما و خارج از آن مطلع شوند. با پشتیبانی Novu از سیستم اعلان برنامه شما، با یک زیرساخت اعلان قدرتمند که توسط تخیل شما محدود شده است، قدرتمند خواهید شد. به علاوه، افزودن SendGrid به شما امکان میدهد تا دسترسی به ISP، نظارت بر شهرت و تجزیه و تحلیل بلادرنگ برای سرویس ایمیل خود داشته باشید.
اگر می خواهید پتانسیل کامل زیرساخت اعلان منبع باز Novu را باز کنید، همین امروز ثبت نام کنید! برای شروع رایگان است و در تمام ابزارهای مورد علاقه شما ادغام می شود.