🧑‍💻 풀이 1

(function () {
  const $body = document.querySelector("body");
  const $table = document.createElement("table");
  const $thead = document.createElement("thead");
  const $tbody = document.createElement("tbody");
  const $trDay = document.createElement("tr");
  const today = new Date();
  const firstDay = new Date(today.getFullYear(), today.getMonth());
  const lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0);
  const days = ["일", "월", "화", "수", "목", "금", "토"];
  
  $body.style.cssText = "display: flex; justify-content : center; align-items: center; width: 100vw; height: 100vh;";
  $table.style.borderCollapse = "collapse";
  
  
  days.forEach(text => {
    const $thDay = document.createElement("th");
    $thDay.textContent = text;
    $thDay.style.cssText = "border: 1px solid black; width: 90px; height: 40px;";
    $trDay.appendChild($thDay);
  });
  
  let dateCount = 1;
  
  for (let i = 0; i < Math.ceil((lastDay.getDate() + firstDay.getDay()) / 7); i++) {
    const $tr = document.createElement("tr");
    for (let j = 1 + i*7; j < 8 + i*7; j++) {
      const $th = document.createElement("th");
      $th.style.cssText = "border: 1px solid black; width: 90px; height: 40px;";
      if (j > firstDay.getDay() && dateCount <= lastDay.getDate()) {
        $th.textContent = `${dateCount++}`;
      }
      $tr.appendChild($th);
    }
    $tbody.appendChild($tr);
  }
  
  $thead.appendChild($trDay);

  $table.appendChild($thead);
  $table.appendChild($tbody);
  
  $body.appendChild($table);
})();

🧑‍💻 풀이 2

(function () {
    const $body = document.querySelector("body");
    const $table = document.createElement("table");
    const $thead = document.createElement("thead");
    const $tbody = document.createElement("tbody");
    const $trDay = document.createElement("tr");
    const today = new Date();
    const firstDay = new Date(today.getFullYear(), today.getMonth());
    const lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0);
    const days = ["일", "월", "화", "수", "목", "금", "토"];
    const $style = document.createElement("style");


    $style.innerHTML = "body {display: flex; justify-content : center; align-items: center; width: 100vw; height: 100vh;} table {border-collapse: collapse;} th {border: 1px solid black; width: 90px; height: 40px;}";
    document.head.appendChild($style);

    days.forEach(text => {
        const $thDay = document.createElement("th");
        $thDay.textContent = text;
        $trDay.appendChild($thDay);
    });

    for (let i = 0; i < Math.ceil((lastDay.getDate() + firstDay.getDay()) / 7); i++) {
        const $trDate = document.createElement("tr");
        for (let j = 0; j < 7; j++) {
            const $thDate = document.createElement("th");
            $trDate.appendChild($thDate);
        }
        $tbody.appendChild($trDate);
    }




    $thead.appendChild($trDay);
    $table.appendChild($thead);
    $table.appendChild($tbody);
    $body.appendChild($table);

    const $thDates = document.querySelectorAll("tbody th");

    for (let i = 0; i < lastDay.getDate(); i++) {
        $thDates[firstDay.getDay() + i].textContent = `${i + 1}`;
    }
})();

🧑‍💻 풀이 3(풀이 1 + 2 조합)

(function () {
    const $body = document.querySelector("body");
    const $table = document.createElement("table");
    const $thead = document.createElement("thead");
    const $tbody = document.createElement("tbody");
    const $trDay = document.createElement("tr");
    const today = new Date();
    const firstDay = new Date(today.getFullYear(), today.getMonth());
    const lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0);
    const days = ["일", "월", "화", "수", "목", "금", "토"];
    const $style = document.createElement("style");
    let dateCount = 1;


    $style.innerHTML = "body {display: flex; justify-content : center; align-items: center; width: 100vw; height: 100vh;} table {border-collapse: collapse;} th {border: 1px solid black; width: 90px; height: 40px;}";
    document.head.appendChild($style);

    days.forEach(text => {
        const $thDay = document.createElement("th");
        $thDay.textContent = text;
        $trDay.appendChild($thDay);
    });

    for (let i = 0; i < Math.ceil((lastDay.getDate() + firstDay.getDay()) / 7); i++) {
        const $trDate = document.createElement("tr");
        for (let j = 0 + i * 7; j < 7 + i * 7; j++) {
            const $thDate = document.createElement("th");
            if (j >= firstDay.getDay() && dateCount <= lastDay.getDate()) {
                $thDate.textContent = `${dateCount++}`;
            }
            $trDate.appendChild($thDate);
        }
        $tbody.appendChild($trDate);
    }

    $thead.appendChild($trDay);
    $table.appendChild($thead);
    $table.appendChild($tbody);
    $body.appendChild($table);
})();