JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.11.0/ramda.min.js"></script>
<div ng-app="myApp" ng-controller="DemoCtrl">
    <div ng-repeat="friend in friends | limitTo: 1">
        {{friend.name}}
    </div>
</div>

JavaScript

var app = angular.module('myApp', []);

app.controller('DemoCtrl', function ($scope) {
   $scope.friends = [
      {name:'John', age:25, gender:'boy'},
      {name:'Jessie', age:30, gender:'girl'},
      {name:'Johanna', age:28, gender:'girl'},
      {name:'Joy', age:15, gender:'girl'},
      {name:'Mary', age:28, gender:'girl'},
      {name:'Peter', age:95, gender:'boy'},
      {name:'Sebastian', age:50, gender:'boy'},
      {name:'Erika', age:27, gender:'girl'},
      {name:'Patrick', age:40, gender:'boy'},
      {name:'Samantha', age:60, gender:'girl'}
    ];
});