আপনার অ্যাপে নোটিফিকেশন কীভাবে যোগ করবেন: ইন-অ্যাপ, ইমেইল ও পুশ

অ্যাপে নোটিফিকেশন যোগ করতে শুরু করুন ইন-অ্যাপ নোটিফিকেশন দিয়ে: আপনার ডাটাবেসে একটি নোটিফিকেশন টেবিল এবং একটি বেল আইকন, যেটি অপঠিত আইটেমগুলো দেখায়। যা মানুষের জানা দরকার যখন তারা দূরে থাকে, সেগুলোর জন্য একটি ইমেইল প্রোভাইডার দিয়ে ইমেইল যোগ করুন, আর সময়মতো সতর্কতা জরুরি হলেই শুধু ওয়েব পুশ যোগ করুন, কারণ এতে একটি service worker, ব্যবহারকারীর অনুমতি এবং iPhone-এ অ্যাপটি Home Screen-এ সংরক্ষিত থাকা লাগে। যে চ্যানেলই ব্যবহার করুন না কেন, সব নোটিফিকেশন সার্ভারে একটিমাত্র জায়গা থেকে তৈরি করুন এবং ব্যবহারকারীকে ঠিক করতে দিন কী পেতে চান।

এই গাইডে চ্যানেলগুলোর তুলনা, একটি সহজ আর্কিটেকচার, এবং একটি AI অ্যাপ বিল্ডারের জন্য কাজে লাগানো প্রম্পট দেওয়া হলো।

প্রধান চ্যানেলগুলোর তুলনা

বেশিরভাগ অ্যাপের জন্য ইন-অ্যাপ ও ইমেইল দরকার। পুশ ও SMS তখনই উপযোগী যখন সময়টাই আসল বিষয়, যেমন বুকিংয়ের রিমাইন্ডার বা প্রস্তুত অর্ডার।

একটি নোটিফিকেশন সিস্টেম কীভাবে কাজ করে

এটি সহজ ও কেন্দ্রীভূত রাখুন:

1. কিছু একটা ঘটে। একটি মন্তব্য করা হলো, পেমেন্ট ব্যর্থ হলো, বুকিং আগামীকাল।
2. আপনার সার্ভার একটি ফাংশন কল করে, যেমন notify(user, type, data)।
3. ওই ফাংশন ব্যবহারকারীর পছন্দ যাচাই করে এবং notifications টেবিলে একটি সারি লেখে (বেলের জন্য)।
4. তারপর অন্য চ্যানেলে পাঠায় যেগুলো ব্যবহারকারী ওই ধরনের জন্য চালু করেছে: ইমেইল প্রোভাইডারের মাধ্যমে, পুশ Push API-এর মাধ্যমে।
5. ফ্রন্টএন্ড অপঠিত নোটিফিকেশন দেখায় এবং খুললে সেগুলোকে পঠিত চিহ্নিত করে।

একটিমাত্র প্রবেশপথ থাকলে চ্যানেল যোগ করা, বার্তার শব্দ বদলানো, বা পছন্দ মেনে চলা — কোড খুঁজে বেড়াতে হয় না।

কী সংরক্ষণ করবেন

একটি নোটিফিকেশন টেবিলে সাধারণত থাকে: ব্যবহারকারী ID, ধরন (যেমন comment_reply), একটি ছোট শিরোনাম ও বডি, সংশ্লিষ্ট পেজের লিংক, তৈরির সময় এবং পড়ার সময়। একটি আলাদা পছন্দের টেবিলে থাকে প্রতিটি ব্যবহারকারী প্রতি ধরনের জন্য কোন চ্যানেল চায়।

নতুন নোটিফিকেশন দেখানো

• পেজ দেখার সময় লোড করুন ও প্রতি ৩০–৬০ সেকেন্ডে পোল করুন। সহজ ও নির্ভরযোগ্য।
• WebSocket বা server-sent events দিয়ে রিয়েল-টাইম আপডেট তাৎক্ষণিক মনে হয়, কিন্তু আরও চলমান অংশ যোগ করে। তাৎক্ষণিক আপডেট জরুরি না হলে পোলিং দিয়ে শুরু করুন।

ইমেইল নোটিফিকেশন

ইমেইলের জন্য একটি পাঠানোর প্রোভাইডার ও একটি যাচাইকৃত ডোমেইন দরকার; বিস্তারিত আছে আপনার অ্যাপ থেকে ইমেইল কীভাবে পাঠাবেন-এ। নোটিফিকেশনের জন্য বিশেষভাবে:

• সার্ভার থেকে পাঠান, কখনোই ব্রাউজারে প্রোভাইডারের কী রেখে নয়।
• ঘন ঘন ঘটা ঘটনাগুলো একত্র করুন। "৩টি নতুন মন্তব্য" একটি ইমেইলে ভালো, তিনটি ইমেইলের চেয়ে।
• কম গুরুত্বপূর্ণ কার্যকলাপের জন্য দৈনিক বা সাপ্তাহিক ডাইজেস্ট দিন।
• অপ্রয়োজনীয় ইমেইলে আনসাবস্ক্রাইব বা পছন্দের লিংক রাখুন। মার্কেটিং ইমেইলের নিয়ম দেশভেদে আলাদা; আপনার ক্ষেত্রে কী প্রযোজ্য তা যাচাই করুন।

ওয়েব পুশ নোটিফিকেশন

ওয়েব পুশ আপনার সাইটকে এমন সতর্কতা পাঠাতে দেয় যা অ্যাপ নোটিফিকেশনের মতো দেখায়। MDN-এর Push API ডকুমেন্টেশন অনুযায়ী এটি এভাবে কাজ করে:

1. আপনার সাইট একটি service worker নিবন্ধন করে, অর্থাৎ এমন একটি স্ক্রিপ্ট যা ব্রাউজার পেছনে চালাতে পারে।
2. ব্যবহারকারী সম্মত হলে service worker PushManager.subscribe() দিয়ে সাবস্ক্রাইব করে। ব্রাউজার একটি subscription ফেরত দেয়, যাতে একটি endpoint ও এনক্রিপশন কী থাকে।
3. আপনার সার্ভার সেই subscription সংরক্ষণ করে, এবং কিছু ঘটলে endpoint-এ একটি বার্তা পাঠায়, সাধারণত VAPID কী দিয়ে স্বাক্ষর করে (এটি আপনার সার্ভারকে চিহ্নিত করা একটি কী জোড়া)।
4. ব্রাউজার আপনার service worker চালু করে, যা নোটিফিকেশন দেখায় — এমনকি আপনার পেজ খোলা না থাকলেও।

MDN আরও বলে, endpoint-টি গোপন রাখতে হবে, কারণ এটি জানা থাকলেই ওই ব্যবহারকারীর কাছে বার্তা পাঠানো যায়।

iPhone ও iPad

WebKit iOS ও iPadOS 16.4-এ ওয়েব অ্যাপের জন্য Web Push যোগ করেছে, তাদের ঘোষণায় দুটি শর্ত সহ: সাইটটিকে Home Screen-এ যোগ করতে হবে, এবং অনুমতি চাইতে হবে ব্যবহারকারীর কোনো কাজের প্রতিক্রিয়ায়, যেমন একটি Subscribe বাটনে ট্যাপ। তাই iPhone-এ পুশ শুধু সেসব ব্যবহারকারীর কাছে পৌঁছায় যারা আপনার ওয়েব অ্যাপ ইনস্টল করেছে। ওয়েব অ্যাপ ইনস্টল করার মানে কী, তা জানতে দেখুন নেটিভ বনাম প্রগ্রেসিভ ওয়েব অ্যাপ।

অনুমতি ভালোভাবে চাওয়া

প্রথম ভিজিটেই অনুমতি চাইবেন না। আগে সুবিধাটি ব্যাখ্যা করুন ("আপনার ক্লাসের এক ঘণ্টা আগে রিমাইন্ডার পান"), তারপর ব্যবহারকারী একটি বাটনে ট্যাপ করলে ব্রাউজারের প্রম্পট দেখান। কেউ প্রত্যাখ্যান করলে ব্রাউজার আর আপনাকে জিজ্ঞেস করতে নাও দিতে পারে, তাই আগেভাগে প্রম্পট করলে মানুষটিকে চিরতরে হারাতে পারেন।

নির্ধারিত নোটিফিকেশনের জন্য একটি ট্রিগার লাগে

"২৪ ঘণ্টা আগে রিমাইন্ডার" বা "প্রতি সোমবার সাপ্তাহিক সারসংক্ষেপ" চালানোর জন্য কিছু একটা নির্ধারিত সময়ে চলতে হবে। এটি একটি ব্যাকগ্রাউন্ড-জব সমস্যা, যা ব্যাকগ্রাউন্ড জব কীভাবে চালাবেন-এ আলোচিত। একটি সাধারণ প্যাটার্ন: একটি বাইরের শিডিউলার প্রতি কয়েক মিনিটে একটি সুরক্ষিত endpoint কল করে, আর সেই endpoint যা বাকি আছে তা পাঠায়।

আপনার AI বিল্ডারকে দেওয়ার প্রম্পট

ইন-অ্যাপ দিয়ে শুরু করুন:

ইন-অ্যাপ নোটিফিকেশন যোগ করো। একটি notifications টেবিল বানাও (user, type, title, body, link, created_at, read_at)। একটি সার্ভার ফাংশন notify(userId, type, data) যোগ করো, যা প্রতিটি ফিচার কল করবে। হেডারে অপঠিত সংখ্যাসহ একটি বেল আইকন দেখাও, সর্বশেষ ২০টির একটি ড্রপডাউন দাও, আর একটি "সব পঠিত চিহ্নিত করো" বাটন দাও। প্রতি ৬০ সেকেন্ডে নতুন নোটিফিকেশনের জন্য পোল করো।

তারপর পছন্দ ও ইমেইল:

নোটিফিকেশন সেটিংস যোগ করো: প্রতিটি ধরনের জন্য (কমেন্টের জবাব, মেনশন, বিলিং) ব্যবহারকারী ইন-অ্যাপ, ইমেইল, দুটোই বা কোনোটিই বেছে নিতে পারবে। notify() এই পছন্দগুলো মেনে চলবে। [PROVIDER] দিয়ে ইমেইল পাঠাও, সার্ভারে শুধু [ENV_NAME] সিক্রেট ব্যবহার করে। কমেন্টের ইমেইলগুলো গুচ্ছবদ্ধ করো, যাতে একজন ব্যবহারকারী প্রতি ১৫ মিনিটে সর্বাধিক একটি ইমেইল পায়।

তারপর পুশ, যদি দরকার হয়:

ঐচ্ছিক ওয়েব পুশ যোগ করো। একটি service worker নিবন্ধন করো, VAPID কী তৈরি করো এবং প্রাইভেট কীটি সিক্রেট হিসেবে রাখো। সেটিংসে একটি "Enable notifications" বাটন যোগ করো, যা ক্লিক করলেই শুধু অনুমতি চায়। প্রতিটি ব্যবহারকারী ও ডিভাইসের জন্য subscription আলাদাভাবে সংরক্ষণ করো, ব্যবহারকারী চালু করে থাকলে notify() থেকে পুশ পাঠাও, আর পুশ সার্ভিস মেয়াদোত্তীর্ণ বলে জানালে সেই subscription মুছে ফেলো।

সাধারণ ভুল

• নোটিফিকেশন কোড জুড়ে ছড়িয়ে থাকা। প্রতিটি ফিচার আলাদাভাবে ইমেইল পাঠায়, আর পছন্দ উপেক্ষিত হয়। একটিমাত্র notify() ফাংশন ব্যবহার করুন।
• পেজ লোডের সময় পুশের অনুমতি চাওয়া। বেশিরভাগ মানুষ প্রত্যাখ্যান করে, আর দ্বিতীয় সুযোগ নাও পেতে পারেন।
• কোনো পছন্দ না থাকা। যেসব ব্যবহারকারী বিরক্তিকর সতর্কতা বন্ধ করতে পারেন না, তারা সব বন্ধ করে দেন, অথবা চলে যান।
• ব্রাউজার থেকে পাঠানো। ইমেইল ও পুশের কী সার্ভারে থাকা উচিত।
• মৃত পুশ subscription পরিষ্কার না করা। মেয়াদোত্তীর্ণ subscription জমে যায় এবং অপ্রয়োজনীয় পাঠানোর খরচ বাড়ায়।
• নোটিফিকেশনের লেখায় গোপন তথ্য। লক স্ক্রিনে এটি দেখা যায়। "আপনার একটি নতুন বার্তা আছে" বলা বার্তার আসল লেখার চেয়ে নিরাপদ।
• কী পাঠানো হয়েছে তার কোনো রেকর্ড না রাখা। যখন কেউ বলে "ইমেইল পাইনি", তখন প্রোভাইডারের বার্তা ID সহ লগ কারণ খুঁজে পেতে সাহায্য করে।

চেকলিস্ট

• একটিমাত্র সার্ভার-সাইড notify() ফাংশন সবখানে ব্যবহৃত
• অপঠিত অবস্থাসহ একটি নোটিফিকেশন টেবিল, এবং অপঠিত সংখ্যাসহ একটি বেল
• ধরন অনুযায়ী চ্যানেল পছন্দ, যা notify() মেনে চলে
• সার্ভার থেকে যাচাইকৃত ডোমেইনে ইমেইল পাঠানো; ঘন ঘন ঘটা ঘটনার জন্য ডাইজেস্ট বা গুচ্ছবদ্ধকরণ
• পুশের অনুমতি শুধু একটি ব্যবহারকারী কাজের পরে, ব্যাখ্যাসহ চাওয়া
• ডেস্কটপে ও হোম স্ক্রিনে যোগ করা অ্যাপসহ iPhone-এ পুশ পরীক্ষা করা
• মেয়াদোত্তীর্ণ পুশ subscription সরানো
• পুশ বা ইমেইলের প্রিভিউতে গোপন কন্টেন্ট নেই
• নির্ধারিত রিমাইন্ডারের একটি নির্ভরযোগ্য ট্রিগার আছে

Mythex-এ নোটিফিকেশন

Mythex আপনার তৈরি অ্যাপের জন্য কোনো বিল্ট-ইন ইমেইল বা পুশ সার্ভিস দেয় না, তাই আপনি নিজের ইমেইল প্রোভাইডার আনেন এবং নিজের পুশ কী তৈরি করেন, যা প্রজেক্ট সিক্রেট হিসেবে সংরক্ষিত হয়। ইন-অ্যাপ অংশের জন্য শুধু প্রজেক্টের ডাটাবেস লাগে, যা আপনি চাইলে Mythex যোগ করে দেয়। ওপরের মতো প্রম্পট দিয়ে তৈরি করুন, Preview-তে বেল ও ইমেইল পরীক্ষা করুন, আর পুশ পরীক্ষা করুন আপনার পাবলিশ করা URL-এ, কারণ service worker ও পুশের জন্য একটি বাস্তব HTTPS ঠিকানা দরকার। ডক্সের ইমেইল পাঠান রেসিপিতে একটি স্টার্টার প্রম্পট আছে। Mythex নির্ধারিত জব নিয়ে কিছু ডকুমেন্ট করে না, তাই সময়মতো রিমাইন্ডার বাইরের একটি ট্রিগার দিয়ে পরিকল্পনা করুন, যেমনটি ব্যাকগ্রাউন্ড জব কীভাবে চালাবেন-এ বলা আছে।

প্রশ্নোত্তর