JSFiddle - React, Tailwind, and code Playground

by marionettejs

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.2/backbone-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.radio/2.0.0-pre.2/backbone.radio.js"></script>
<script src="https://rawgit.com/marionettejs/backbone.marionette/next/lib/backbone.marionette.js"></script>

JavaScript

const { MnObject, View } = Marionette; // import { MnObject } from 'backbone.marionette';

const myChannel = Backbone.Radio.channel('notify');

const Notification = MnObject.extend({
	channelName: 'notify',

  initialize() {
  	const channel = this.getChannel();
    
    channel.reply('show:success', this.showSuccessMessage);
    channel.reply('show:error', this.showErrorMessage);
  },

  showSuccessMessage(msg) {
    console.log(msg)
  },

  showErrorMessage(msg) {
    console.log(msg)
  }
});

const Model = Backbone.Model.extend({
	triggerError() {
  	this.trigger('error');
  }
}); 

const ModelView = View.extend({
  modelEvents: {
    error: 'showErrorMessage'
  },

  showErrorMessage() {
    myChannel.request('show:error', 'An error occurred contacting the server');
  }
});

const model = new Model();
const modelView = new ModelView({model})
const notification = new Notification();

model.triggerError();