In-app Notifications

Advanced Ecosystem 🟡 Mid

Definition

Système de notifications intégré à l'application (cloche, badge, toasts) avec centre de notifications persistant. Utilise souvent WebSocket ou SSE pour le temps réel.

Analogie

La boîte de réception interne d'un bureau avec un voyant lumineux qui s'allume quand un nouveau message arrive.

Exemple de code

// Notification center pattern
const [notifications, setNotifications] = useState([]);
useEffect(() => {
  const es = new EventSource('/api/notifications/stream');
  es.onmessage = (e) => {
    setNotifications(prev => [JSON.parse(e.data), ...prev]);
  };
  return () => es.close();
}, []);

Cas d'usage

Informer l'utilisateur d'événements (mentions, mises à jour, tâches) sans quitter l'application.

#communication#ux