Discussion on: 🅳🆁🆈-🅾🅽-🆁🅴🅰🅲🆃 🎉

[Danny Kim]

I usually rely on 3rd party libraries (either use them directly or write code heavily inspired by their implementation). One example would be react-hook-form package for your usecase 2.

react-hook-form equivalent of your code:

function App() {
  const { register, handleSubmit } = useForm();
  const onSubmit = (data) => console.log(data);

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register('email')} />
      <input {...register('password')} />
    </form>
  );
}

Also, phone number formatting is not worth doing it DIY IMO. For example, your code is for 11-digit phone numbers, but Americans use 10-digit phone numbers. What about international numbers with + prefix? Obviously the list goes on, and it is really difficult to get it right.