JSFiddle - React, Tailwind, and code Playground

by jteve code

HTML

<!-- 만약 app 전체가 아니라, 기존 애플리케이션의 일부를 angularjs로 관리한다면? -->
<!-- <div> 등으로 묶어서 ng-app tag를 넣으면 된다. -->
<html ng-app='myApp'>
<body ng-controller="TextController">
	<!-- 아래와 같은 이중 중괄호 문법은, 기존 템플릿에 새로운 내용을 삽입한다는 뜻에서 인터폴레이션 이라고 한다. -->
    <p>{{someText.message}}</p>

<!-- CDN(Content Delivery Network, 콘텐츠 전송 네트워크)에 올려져 있는 스크립트 로딩 -->
<script
    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js">
</script>

<script>
    var myAppModule = angular.module('myApp', []);

    myAppModule.controller('TextController',
        function TextController($scope) {
        // MVC 패턴에서 모델은 아래와 같은 객체 변수를 의미할 수 있다.
        // 객체가 아니라, 일반 변수로 선언할 수 있지만, scope 객체에서 발생할 수 있는 예기치못한, 
        // 상황에 대비하여, 객체로 선언한다.
        var someText = {};
        someText.message = 'Jteve world.';
        $scope.someText = someText;
    });
</script>
</body>
</html>