JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://getbootstrap.com/docs/4.1/dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://getbootstrap.com/docs/4.1/dist/css/bootstrap.min.css">
<table class="table">
  <thead>
    <tr>
      <td colspan="1">
        Ara:
      </td>
      <td colspan="3">
        <input type="text" id ="myInput"/>
      </td>
    </tr>
    <tr>
      <th scope="col">#</th>
      <th scope="col">First</th>
      <th scope="col">Last</th>
      <th scope="col">Handle</th>
    </tr>
  </thead>
  <tbody id="myList">
    <tr>
      <th scope="row">1</th>
      <td>ıhlamur</td>
      <td>şengül</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>ömer</td>
      <td>İhsan</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td>Çetin</td>
      <td>the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>

JavaScript

$(document).ready(function(){
  $("#myInput").on("keyup", function() {
    var value = $(this).val().turkishToUpper();
    $("#myList tr").hide()
    $("#myList td").filter(function() {
    	if($(this).text().turkishToUpper().indexOf(value) == 0){
      	$(this).parent().show();
      }
    });
  });
  
	String.prototype.turkishToUpper = function(){
      var string = this;
      var letters = { "i": "İ", "ş": "Ş", "ğ": "Ğ", "ü": "Ü", "ö": "Ö", "ç": "Ç", "ı": "I" };
      string = string.replace(/(([iışğüçö]))+/g, function(letter){ return letters[letter]; })
      return string.toUpperCase();
  }

  String.prototype.turkishToLower = function(){
      var string = this;
      var letters = { "İ": "i", "I": "ı", "Ş": "ş", "Ğ": "ğ", "Ü": "ü", "Ö": "ö", "Ç": "ç" };
      string = string.replace(/(([İIŞĞÜÇÖ]))+/g, function(letter){ return letters[letter]; })
      return string.toLowerCase();
  }

});