JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp" ng-controller="myCtrl">
  <div ng-repeat="i in [1,2,3,4,5] | myfilter">{{i}}</div>
  <div test-dir1 test-dir2> </div>
</div>

JavaScript

var myApp = angular.module('myApp', []);
myApp.factory('fProvider', function() {
  console.log("factory");
  return function() {
    return "inner factory";
  }
});
myApp.service('sProvider', function() {
  this.consoleIt = function() {
    return "inner service";
  }
  console.log("service");
});
myApp.directive("testDir1", function() {
  console.log("directive setup");
  return {
    compile: function() {
      console.log("directive compile");
    }
  }
});
myApp.filter("myfilter", function() {
  console.log("filter")
  return function(i) {
    console.log("filter render");
    return i
  }
});

myApp.directive("testDir2", function() {
  console.log("directive setup2");
  return {
    link: function() {
      console.log("directive link");
    }
  }
});

myApp.run(function() {
  console.log("app run");
});

myApp.config( function() {
  console.log("app config");
});

myApp.controller('myCtrl', function($scope, fProvider, $timeout) {
  //console.log(sProvider.consoleIt());
  
	$timeout(function(){
  	console.log("Executing timeout in controller...");
  }, 2000);
  console.log(fProvider());
  console.log("app controller");
});