JSFiddle - React, Tailwind, and code Playground

by godswatchdog

HTML

<div ng-app="app" ng-controller="myCtrl">
    
        <div class="row">
            <div class="col-md-6" ng-repeat="post in posts | filter:{'userId':  1}:true | orderBy:'title'">
                <h3>{{post.title}}</h3> 
                <span>User Id: {{post.userId}}</span><br/>
                <span>{{post.body}}</span><br/><br/>
            </div>
        </div>
</div>

SCSS

#col {
    padding: 5px;
    line-height: 1.4; 
    h1 {
      font-weight: bold;
      font-size: 24px;
    }
    ul {
      list-style: square;
      li {
        font-size: 17px;
        padding-left: 10px;
      }
    }
}

JavaScript

angular.module('app', []);

angular.module('app').controller('myCtrl', function ($scope, $http) {
 
  $http.get('http://jsonplaceholder.typicode.com/posts').then(function(results){
    $scope.posts = results.data;
  });

});