JSFiddle - React, Tailwind, and code Playground

by Jesus Trejo

HTML

<body>
    <p id="output"></p>
</body>

CSS

@charset"utf-8";
 @import url(http://fonts.googleapis.com/css?family=Antic+Slab);
 body {
    font-family:'Antic Slab', serif;
    font-size: 15px;
    background-color:#DEDEDE;
}
p {
    font-weight: bold;
    color: #333;
}

JavaScript

var pharmacies = {
    "results": [{
        "address_components": [{
            "long_name": "Shoppers Drug Mart",
                "short_name": "Shoppers Drug Mart",
                "types": ["point_of_interest", "establishment"]
        }, {
            "long_name": "1859",
                "short_name": "1859",
                "types": ["street_number"]
        }, {
            "long_name": "Leslie Street",
                "short_name": "Leslie St",
                "types": ["route"]
        }, {
            "long_name": "St. Andrew - Windfields",
                "short_name": "St. Andrew - Windfields",
                "types": ["neighborhood", "political"]
        }, {
            "long_name": "North York",
                "short_name": "North York",
                "types": ["sublocality", "political"]
        }, {
            "long_name": "Toronto",
                "short_name": "Toronto",
                "types": ["locality", "political"]
        }, {
            "long_name": "Toronto Division",
                "short_name": "Toronto Division",
                "types": ["administrative_area_level_2", "political"]
        }, {
            "long_name": "Ontario",
                "short_name": "ON",
                "types": ["administrative_area_level_1", "political"]
        }, {
            "long_name": "Canada",
                "short_name": "CA",
                "types": ["country", "political"]
        }, {
            "long_name": "M3B 2M1",
                "short_name": "M3B 2M1",
                "types": ["postal_code"]
        }],
            "formatted_address": "Shoppers Drug Mart, 1859 Leslie Street, Toronto, ON M3B 2M1, Canada",
            "geometry": {
            "location": {
                "lat": 43.7542515,
                    "lng": -79.36015909999999
            },
                "location_type": "APPROXIMATE",
                "viewport": {
                "northeast": {
                    "lat": 43.75560048029149,
                   ...