Kayıtlar

JavaScript ile TC No Üretelim

JavaScript TCKN Üreteci Kodu TC Kimlik No Nasıl Oluşturulur? Türkiye Cumhuriyeti kimlik numarası (TC kimlik numarası), Türkiye Cumhuriyeti vatandaşlarını tanımlamak için kullanılan benzersiz bir numaradır. Bu numara, 11 basamaklı bir sayı dizisidir ve aşağıdaki formattadır: 12345678901 ↓ TC Kimlik No üreteci sayfanın altındadır. ↓ İlk 6 basamak, kişinin doğum tarihini temsil eder. İkinci basamak, kişinin cinsiyetini temsil eder. (1: erkek, 2: kadın) Son 5 basamak, kişinin sıra numarasını ve kayıt ilçesini temsil eder. TC kimlik numarası, Nüfus ve Vatandaşlık İşleri Genel Müdürlüğü tarafından üretilir. TC kimlik numarası üretmek için kullanılan algoritma, aşağıdaki adımları içerir: Doğum tarihi, cinsiyet ve kayıt ilçesi bilgileri girilir. TC kimlik numarası üretmek için kullanılan bilgiler Bu bilgiler, 11 basamaklı bir sayı dizisine dönüştürülür. Seri numarası, üretilen sayı dizisinin son 5 basamağına eklenir. Üretilen sayı dizisi, doğrulama algoritmasından geçirilir. Doğrulama alg

JavaScript İle Göz Egzersizi Uygulaması

Resim
  Gözlerimiz, dünyayı görmemizi sağlayan en önemli organlarımızdan biridir. Günlük hayatımızda sürekli olarak gözlerimizi kullanırız ve bu da göz kaslarımızın yorulmasına ve zayıflamasına neden olabilir. Göz kaslarını güçlendirmek için ise çeşitli egzersizler mevcuttur. Bu makalede, göz kaslarını eğlenceli bir şekilde çalıştırmak için geliştirilen bir JavaScript uygulamasını tanıtacağız. Uygulama, ekranda rastgele bir noktada çıkan ve fare ile tıklandıkça kaybolup başka bir noktada çıkan bir göz ikonu içerir. Kullanıcı, göz ikonunu olabildiğince hızlı ve doğru bir şekilde tıklamaya çalışır. Uygulamanın faydaları şunlardır: Göz kaslarını güçlendirir: Göz ikonunu takip etmek ve tıklamak, göz kaslarının farklı yönlerde hareket etmesini sağlar. Bu da göz kaslarının güçlenmesine ve daha esnek hale gelmesine yardımcı olur. Göz-el koordinasyonunu geliştirir: Göz ikonunu tıklamak için göz ve el koordinasyonu gereklidir. Uygulama, göz-el koordinasyonunu geliştirmeye ve daha hızlı ve doğru bir ş

Basit bir HTML / CSS / JS Editörü

Resim
Bu editör HTML, CSS ve JavaScript kodlarını düzenleyip çalıştırabileceğin basit bir ortam sağlar. Kodlarınızı aşağıdaki alana yazıp front-end'te çalıştırabilirsiniz. İsterseniz sadece çalıştır düğmesine basın ve örnek kodu çalıştırın. Editör Modunu Aç (Yazdığınız Kodu Çalıştırmak için CTRL+Enter'a da Basabilirsiniz.) <!DOCTYPE html> <html> <body> <h2>JavaScript Kodu</h2> <p id="demo">HTML içeriği</p> <script> function deneme(){ alert("heyyoo"); } </script> <button onclick="deneme();">Örnek Kodu Çalıştır</button> </body> </html> Çalıştır

Sayfa Sıralamanızı Yükseltecek 5 SEO Önerisi

Resim
Bir web sitesinin varlığını sürdürebilmesi ziyaretçi sayısına bağlıdır. Ziyaretçi alamayan siteler zamanla unutulur, reklam, satış vb. amaçları yerine getirememelerinden dolayı faaliyeti sona erer. İnternet dünyası bu şekilde kapanmış sayısız domaine ait projelerin mezarlarıyla doludur.  Yayına açılan her sayfa aslında yeni bir projedir. Böylesi yeni projeler için ziyaretçi bulmak önemli bir problemdir. Eğer reklam çalışmaları için yeterli bütçeniz yoksa sitenize ziyaretçi çekmenin en iyi yolu arama motorlarında iyi bir konumda yer edinmekten geçmektedir. Bunun için de iyi bir SEO çalışması yapmalıdır. SEO ise her geçen gün değişen ve gelişen bir alandır. Arama motorları sürekli olarak yazılımlarını geliştirirler. Site yöneticileri de bu gelişmelerden olumsuz etkilenmek için mutlaka sitelerindeki SEO çalışmalarını güncellemelidir. SEO esasen web sitesi içeriği için yapılır. Kaliteli içerik, iyi malzeme demektir ve  çalışmalarınızın verimli olabilmesi için bu şarttır. İçeriği oluştururk

JavaScript Başa Dön | Scroll To Up Butonu Kodu

Resim
Sitelerde çokça kullanılan yukarı çık, başa dön vb. isimlerle adlandırılan buton kodu. <script>   var btnP =0;   window.addEventListener("load",function(){     btnP =window.scrollY;   });   window.addEventListener("scroll",function(){       scrollStat();   });   function scrollStat(){     btnP =window.scrollY;     if(btnP <=600 ){       document.getElementById("toTopBtn").className ="scrollToTopBtn";     }     else{       document.getElementById("toTopBtn").className ="scrollToTopBtn scrollToTopBtnShow";     }   }   function scrollToTop(){     window.scrollTo(0,0);     scrollStat();   }   </script>   <style>     *{       scroll-behavior: smooth;     }     .scrollToTopBtn{       position:fixed;       bottom:3%;       right:5%;       background-color:#e7e7e7;       color:#555;       font-size: 15px;       font-family: 'Helvetica';       font-weight: 400;       cursor:pointer;       transition: all 0.

JavaScript ile Mesai Sayacı

Resim
Bu çalışmamda JavaScript ile bir geri sayım sayacı yaptım. Input elemanına bitiş zamanını yazıp butona tıkladığınızda belirlediğiniz saate kaç saat kaldığını görebilirisiniz. Bu uygulamada input elemanına yapılan girişleri sınırlandırdım. Program klavyeden girilen değerin sayısal olup olmadığını kontrol ediyor ve girilen değerleri saat formatına göre HH:MM:SS şeklinde düzenliyor. Javascript mesai sayacının kodları aşağıdaki gibidir. <p>Lütfen mesai bitiş saatini girin</p> <input type="tel" placeholder="HH:MM:SS" id="timeInputId" /> <input type="button" id="tmrBtn" value="Mesai Sayacını Başlat"/> <p id="demo"></p> <p id="demo2"></p> <script> var x; var finishTime= "00:00:00"; var brTitle= document.title; window.addEventListener("load",function(){ var timeBtn = document.getElementById("tmrBtn"); var timeInput = docume

CSS ile Devamını Oku Butonu Tasarımı

Basit bir CSS kodlama örneği yaptım, umarım yardımcı olur. <div class="btnContainer"> <h3 class="btnTitle">Devamını Oku Buton alanı başlık metnini buraya yazın</h3> <a href="#" title="Devamını Oku Buton Başlığı" class="btnReadMore"> Devamını Oku &gt;</a> </div> <style> .btnContainer{   background-color:#2f2f2f;   color:#fefefe;   text-align:center;   padding:1% 2%;   font-family:Arial; } .btnTitle{ font-size:24px;     line-height:100%; } .btnReadMore{ display:block;     background-color:#dedede;     color:#2f2f2f;     width:50%;     max-width:170px;     text-align:center;     text-decoration:none;     margin:20px auto;     font-family:Arial;     font-size:16px;     padding:10px 2px;     border-radius:2px;     -webkit-border-radius:2px;     -moz-border-radius:2px; } </style> Kodların çalışan hali Devamını Oku Buton alanı başlık metnini buraya yazın Devamını Oku >