JSFiddle - React, Tailwind, and code Playground

by Deepak Anand

HTML

<div id = "target"></div>

JavaScript

//Example of readable code using templates in widgets
require([
    "dojo/_base/declare",
    "dijit/_WidgetBase",
    "dijit/_TemplatedMixin" ,
    "dijit/_Container",
], function(declare, _WidgetBase, _TemplatedMixin, _Container){
var ContainerWidget =  declare([_WidgetBase, _TemplatedMixin, _Container],{

        //  Use dojo/text plugin to pull in the html from an external file
       //templateString: template,        
       templateString: '<div><h1 data-dojo-attach-point = "overallTitleNode"></h1><div data-dojo-attach-point = "containerNode"></div></div>',        	
       // overallTitle: "",        
       // contentWidgets:[],        
        
        _setOverallTitleAttr: function(overallTitleString){        
            this.overallTitleNode.textContent = overallTitleString;
            this._set("overallTitle", overallTitleString);
        },       
                 
        _setContentWidgetsAttr: function(contentWidgets){        
            contentWidgets.forEach(function(contentWidget){               
                this.addChild(contentWidget)
            }, this);  
            
           this._set("contentWidgets", contentWidgets);            
        }
});

var ContentWidget = declare([_WidgetBase, _TemplatedMixin],{

        //  Use dojo/text plugin to pull in the html from an external file
       // templateString: template,        
    templateString: '<div><h2 data-dojo-attach-point = "contentTitleNode"></h2><div data-dojo-attach-point = "containerNode"></div></div>',
       // 
       // contentTitle: "",
       // 
       // content: ""
        
        _setContentTitleAttr: function(contentTitleString){        
            this.contentTitleNode.textContent = contentTitleString;
            this._set("contentTitle", contentTitleString);
        },        
                          
        _setContentAttr: function(content){
           this.containerNode.textContent = content;
           this._set("content", content);            
    ...