Can you rearrange the jQuery code and incorporate popper.js into bootstrap 4?
$('.selectpicker').selectpicker();<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.2/js/bootstrap-select.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.2/css/bootstrap-select.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>
<select class="selectpicker" name = "usertype" title="User Type" required="true" data-size="7">
<option value="0"> test1 </option>
<option value="2"> test2 </option>
<option value="4"> test3 r</option>
<option value="6"> test4 </option>
</select>
<input name = "first_name" type="text" placeholder="Name" class="form-control" required="true" value = "">
<input name = "last_name" type="text" placeholder="Name" class="form-control" required="true" value = "">