App.js

import './App.css';
import * as d3 from 'd3'
import {useEffect, useState} from 'react'

function App() {
  
  useEffect(() => {

      // Create a dataset of pets and the amount of people that own them
      let dataSet = [
        {subject: "Dogs", count: 150},
        {subject: "Fish", count: 75},
        {subject: "Cats", count: 135},
        {subject: "Bunnies", count: 240},
      ]
      // Generate a p tag for each element in the dataSet with the text: Subject: Count 
      d3.select('#pgraphs').selectAll('p').data(dataSet).enter().append('p').text(dt => dt.subject + ": " + dt.count)

    }, [])

  return (
    <div className = "App">
      <div id="pgraphs"></div> // Create a div to house our p tags
    </div>
  );
}

export default App;