Kayıtlar

2023 tarihine ait yayınlar gösteriliyor

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 >

C# Abstract Factory Method Design Pattern Örneği

 C# dilinde Abstract Factory Metot Tasarım Deseni için örnek bir kod hazırladım. using System; namespace TekstilFabrikasi { public interface IPantolon { string PantolonEkle(); } public interface IGomlek { string GomlekEkle(); }     public class Pantolon : IPantolon     {         public string PantolonEkle()         {             return "Pantolon";         }     }     public class Gomlek : IGomlek     {         public string GomlekEkle()         {             return "Gömlek";         }     } public interface ICeket { string CeketEkle(); } public class Ceket : ICeket     {         public string CeketEkle()         {             return "Ceket";         }     }     public interface IElbiseFactory{ IPantolon PantolonYap(); IGomlek GomlekYap(); ICeket CeketYap(); string KumasTipi(); string Mevsimi(); }     public class Yazlik : IElbiseFactory     {         public string KumasTipi()         {            return &qu

C# Ternary Operatörüne Bir Örnek(Bölünebilme Kontrolü)

Bu yazımızda basit bir uygulama yaptık. Amacımız  C# dilinde Ternary Operatörü ile bir iç içe karar verme mekanizması kurmak . Programlamada karar verme yapısı olarak çoğunlukla if- else if-else yapısı kullanılır. Büyük ölçekli projelerde bazı basit karar yapılarını daha az kodlar yazmak için ise ternary kullanılır. Ternary operatörü ile tek satırda iç içe karar yapılarını oluşturabilirsiniz.  Bu operatör her ne kadar kullanışlı olsa da programın okunmasını zorlaştırır. Bu sebepten, program boyunca çok gerekmedikçe kullanmayın. Lafı daha da uzatmadan örnek uygulamaya geçiyorum. Örnek Soru, C# dilinde şu programı Ternary Operatörünü kullanarak yazın.  Bir sayı dizisindeki elemanların sırasıyla 3, 5 ve hem 3 hem de 5 ile bölünebilirliğini kontrol edilsin.    Dizideki sayılar  kaça bölünebildikleri belirtilerek alt alta yazılsın.  Bölünemeyenlere ise 3'e veya 5'e  Bölünemez şeklinde bir uyarı yazılsın. Not: hem 3 hem de 5 ile bölünebilirliği için %15 mod alma ifadesini kullanmayın