carmichaelize

import React, { Component } from 'react';
import Foo from './foo-service';

class FooComponent extends Component {
    foo = Foo;
    render() {
        return (<div>{this.foo.name}</div>)
    }
}

carmichaelize

import React, { Component } from 'react';
import { connect } from 'react-redux';

export class FooBar extends Component {

	greet() {
		return `Hello ${store.foo} ${store.bar}!`;
	}

	render() {

carmichaelize

import { Component } from '@angular/core';

@Component({
    template: `
        <h1>Is Online: {{ isOnline }}</h1>
        <span (click)="clickHandler()">Click Me</span>
    `,
})
export class MyComponent {
    private baseUrl = 'http://www.test.com';

carmichaelize

import { Component } from '@angular/core';
import { ChildBaseComponent } from './child-base.component';

@Component({
	template: `This is Child Component 1`
})
export class Child1Component extends ChildBaseComponent {
    
    constructor(){
        //Run base constructor

carmichaelize

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({ 
    name: 'capitalize' 
})
export class Capitalize implements PipeTransform {
    
    transform(str: string, all: boolean) {
        //Capitalize all the words
        if (all) {

carmichaelize

function MyDirective ($templateRequest, $compile) {

    var templateBase = '/directives/my_directive/views/';

    var childTemplates = {
        child1: 'child1.html',
        child2: 'child2.html'
    };

    return {

carmichaelize

import {Component, Input, ViewChild, ViewContainerRef, ComponentResolver, ComponentFactory} from '@angular/core';
import {Child1Component} from './child1.component';
import {Child2Component} from './child2.component';

@Component({
    selector: 'parent',
    template: `
        <div #target></div>
    `
})

carmichaelize

// Here You can type your custom JavaScript...
jQuery.fn.highlight = function (str, className) {
    var regex = new RegExp(str, "gi");
    return this.each(function () {
        $(this).contents().filter(function() {
            return this.nodeType == 3 && regex.test(this.nodeValue);
        }).replaceWith(function() {
            return (this.nodeValue || "").replace(regex, function(match) {
                return "<span class=\"" + className + "\">" + match + "</span>";
            });

carmichaelize

//Shared scope
function myDirective() {
    return {
        restrict: 'EA',
        templateUrl: 'my-directive.html',
        transclude: true,
        scope: false,
        controllerAs: 'ctrl',
        link: function(scope, element, attrs, ctrl, transclude) {
            transclude(scope, function(clone, scope) {

carmichaelize

(function () {
    'use strict';

    function $dirtyCheck(){
    	var watchers = [],
    	    dirty = false;
    	return {
    		add: function($scope, model){
    			if ($scope && model){
    				var watcher = $scope.$watch(model, function(isDirty) {