gen-persons.html

   <script>
      const a = document.querySelector("table tbody");

      const getPersons = async (count = 30) => {
        const response = await fetch(
          "https://randomuser.me/api/?results=" + count
        );
        const data = await response.json();

        return data.results.map((person) => {
          return {
            name: person.name.first,
            type: "Binário",
          };
        });
      };

      const renderPerson = (person) => {
        const row = document.createElement("tr");
        const name = document.createElement("td");
        const type = document.createElement("td");

        name.innerHTML = person.name;
        type.innerHTML = person.type;

        row.appendChild(name);
        row.appendChild(type);

        a.appendChild(row);
      };

      getPersons().then((persons) => {
        renderPerson({
          name: "Grace",
          type: "Binário Chique",
        });

        persons.forEach((person) => renderPerson(person));
      });
    </script>