JSFiddle - React, Tailwind, and code Playground

HTML

<form class="formCreateAccount">
  <select id="products" name="products[]" required="required" class="field_select js-products" multiple="multiple">
    <option value="Applications">Applications</option>
    <option value="Parental controls">Parental controls</option>
    <option value="VPN">VPN</option>
    <option value="All">All</option>
  </select>
  <button class="button" type="submit">CLICK</button>
</form>

JavaScript

let products = document.querySelector(".js-products");
let btn = document.querySelector(".button");
let formCreateAccount = document.querySelector(".formCreateAccount");

const formData = new FormData(formCreateAccount);

function getAllSelectedOptions(selectID, selectName) {
  let selectedMultiOptionValues = Array.from(selectID.options)
    .filter(option => option.selected)
    .map(option => option.value);
  return formData.append(selectName, `['${selectedMultiOptionValues}']`);
}

formCreateAccount.addEventListener("submit", function(event) {
  event.preventDefault();

  getAllSelectedOptions(products, 'products[]')
  const data = {};
  for (let [key, value] of formData.entries()) {
    data[key] = value
  }
  console.log(data);

})