JSFiddle - React, Tailwind, and code Playground

by Alex Azuero

HTML

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Get started with PopupTemplate - 4.0</title>

  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/main.css">
  <script src="https://js.arcgis.com/4.0/"></script>

  <script>
    require([
      "esri/Map",
      "esri/PopupTemplate",
      "esri/layers/FeatureLayer",
      "esri/views/MapView",
      "dojo/domReady!"
    ], function(
      Map,
      PopupTemplate,
      FeatureLayer,
      MapView
    ) {

      // Create the map
      var map = new Map({
        basemap: "gray"
      });

      // Create the MapView
      var view = new MapView({
        container: "viewDiv",
        map: map,
        center: [-73.950, 40.702],
        zoom: 11
      });

      /*************************************************************
       * The PopupTemplate content is the text that appears inside the 
       * popup. {fieldName} can be used to reference the value of an 
       * attribute of the selected feature. HTML elements can be used
       * to provide structure and styles within the content. The 
       * fieldInfos property is an array of objects (each object representing
       * a field) that is use to format number fields and customize field
       * aliases in the popup and legend (not released yet)
       **************************************************************/

      var template = new PopupTemplate({
        title: "Marriage in NY, Zip Code: {ZIP}",
        content: "<p>As of 2015, <b>{MARRIEDRATE}%</b> of the population in this zip code is married.</p>" +
          "<ul><li>{MARRIED_CY} people are married</li>" +
          "<li>{NEVMARR_CY} have never married</li>" +
          "<li>{DIVORCD_CY} are divorced</li><ul>",
        fieldInfos: [{
         ...