If have required attribute then check condition

<input type="text" class="form-control"  name="firstName" placeholder="First Name" value="" maxlength="50" required>
<input type="text" class="form-control mt-2"  name="lastName" placeholder="Last Name" value="" maxlength="50" required>
<input type="text" class="form-control mt-2"  name="companyName" placeholder="Business Name" value=""  maxlength="50" required >
<input type="text" class="form-control mt-2"  name="title" placeholder="Title" value=""  maxlength="50" required >
<input type="text" class="form-control mt-2 form-business-phone"  name="companyPhone" placeholder="Business Phone" required>
<input type="text" class="form-control mt-2"  name="streetName" value="" placeholder="Business Street Address" required>

want to write a js or jquery function in such a way that if field have required attribute then it will check whether they are empty or not
even if it had any min max attribute then it should also count its length.
after all detection it fill show error in respect of each individual field.
For example:

  1. name should not be empty
  2. email is in not proper format
  3. invalid phone number.

remember: I have long list of field and don’t want to use any js plugin, looking of custom only.
Thanks in advance

Hi,
What do you have so far?