28 Ocak Cuma ´11   —   4 Yorum

Logo


Ben bu yaziyi html5 logosunu duyurmak icin yazmadim, zaten hepiniz gormus/duymussunuzdur bur yeni logoyu. W3C'nin bir digital ajansa bu logoyu yaptirmasini ele almak istiyorum. html daha onceden neden bu kadar dusunulmesi gereken bir konu degildi? Simdi niye bu kadar cok konusulup degerlendirilmeye calisiliyor?

Aslinda bu tamamen web teknolojilerinde html'in artik yerine baska birsey konulamaz sekle gelip standartlasmasindan kaynaklaniyor. Yani bundan 10 sene once hala microsoft farkli formatlar, adobe baska formatlar, apple veya linux dunyasi baska formatlar yayinlayip duruyordu. Artik sirketler yeni bir format pesinde degiller cunku su an web sorgularinin yanitlarini degerlendirmek tek bir dille yayinlanmiyor, yani artik web sayfasinin dili degil, nelerle kombine edildigi onemli, hatta o da degil deneyim onemli olmaya basladi. Bence insanlar artik deneyimi iyi oldugu surece altyapi olarak flash kullanilmasinin veya javascript ile guclendirilmesinin farkini onemsemiyor.

Neyse, konu html5'in bu kadar konusulup ince dusunulerek gelistiriliyor olmasi hem fikir verenlerin cogalmasi, hem alginin artik okunabilir ve taranabilir web'e tasinmasindan olusuyor. Dolayisiyla html'e verecekleri yeni isim, logo bu yeni nesil standardin kimligini olusturacak. Daha once bu kimlik var olmasina ragmen bu sekilde degerlendirilmiyordu. Ben bu gelismeyi cok mantikli buluyorum. Yani kullanilan dillerin kimsenin bilmedigi veya kitaplardan ogrenen bir konu olmasi disinda bu sektordeki insanlar tarafindan sempati uyandiracak bir kimlige sahip olmasi cok guzel birsey. Ozellikle de konuyu bilmeyen insanlar tarafindan bilinen yuzu.

Baska bir konu da artik html5 degil `html` olarak anilacak olmasi. Degisim zaten sadelesme, kuculme ve minimallesme uzerine kurulu benim gozumde. Dolayisiyla artik bir versiyon olarak degil ozellik (feature) olarak anilmasi daha mantikli. Cunku core yapiyi destekleyen/desteklemeyen tarayici kavramini ortadan kaldirip componentleri destekleyen veya desteklemeyen tarayici tartismalarini ortaya atmak html'in isini bu tartisma disinda tutuyor. Dolayisiyla artik gorsel problemler tarayici motorlari tarafindan html'i okuma degil css'i okuma/destekleme becerisi olarak tartisilacak. Bu da bence iyi birsey.

Not: Yukaridaki logo tamamen eski surum htmllerin bu kimlik eksikligiyle dalga gecen oatmeal'in calismasindan alinmistir. Oatmeal'in onerisi olan cozumu arastirarak sitesinden gormenizi tavsiye ederim :-)
9 Temmuz Perşembe ´09   —   6 Yorum

Firefox 3.5'u bugün kurup deniyim dedim. Açıkcası sağdan soldan "hızlanmış", "hızı chrome'u geçmiş" gibi şeyler kısmen doğru çıktı diyebilirim. Render hızı gerçekten gözle görülür derecede artmış. Aynı zamanda uygulama arayüzü oluşturma süresi yani tıkladığınızda pencerenin gelmesi (gerçi macosx'deki ile windows'daki farklı durumlar) hızı da artmış. Gerçi şu an üstünde çok eklenti olmamasından da kaynaklanıyor olabilir.

Yine de yakında yayınlanacak olarak firefox 3.5 açısından güzle gelişmeler var. Mesela dikkatimi çeken güzelliklerden geç de olsa nihayet gelebilen Private Browsing Mode. Fakat biraz mantık farklılığı var safari ile. Private Browsing moduna geçtiğinizde varolan tablarınız fln kapanıyor, yeni, temiz bir tarayıcı ekranı geliyor. Disable ettiğiniz zaman da eski tablar geri geliyor. Farklı...

Ayrıca Firebug'da şekil şemal değişikliklerine uğramış. Şu an cooliris ile firebug düzgün çalışıyor.

Umarım şu andaki gelişim ivmesi azalmaz, zira ortada Google Chrome OS gibi şeyler dolaşıyor, official blog'da da yazmışlar birşeyler. Hadi bakalım.
20 Temmuz Pazar ´08   —   2 Yorum

Bazı İkonlar

Sitede kullandığım ve zamanında yaptığım bazı ikonlar. PHP logosunun web 2.0 patlamadan önce aqua buton denemelerimden ortaya çıkardığım versiyonu, şu an günlük sayfalarında tarihi görüntülediğim takvim ikonu ve anasayfada kullandığım firefox bannerı ve alternatifi.

Dosyalar bölümünde Grafik dizininde psd dosyalarını bulabilirsiniz.
http://www.mfyz.com/?/dosyalar/Grafik

Kullanımı Creative Commons 2.5 lisansına uygun olmalıdır. Lisans hakkında bilgi almak için de http://www.mfyz.com/?/hakkinda/lisans/ adresini ziyaret edebilirsiniz.

Neden bahsediyorum ? :-)


Artık neredeyse her sitede olan üyelik, bazı web uygulamaları için vazgeçilmez oldu. Çünkü üyelere ait özelleştirilmiş siteler her zaman daha popülerleşti. Bunu bir gerekli yanı da sistem güvenliği ve hizmet takibi. Mesela yaptığınız projede yapılacak saldırılarda 1-1 KİŞİ tespiti yapabilmenizi sağlayan mekanizma da aslında üye takibidir. Bazı projelerde ise hizmetinizi sınırlamak istediğiniz insanlar olabilir. Üye statü'leri izinleri veya kayıta kapalı (veya davetli) üyelikler ile hizmetinizi hedef kitlene sınırlayabilirsiniz.
Neyse üyeliğin yararlarını geçelim. Buraya öğrenmeye geldik :-)

Neye ihtiyacımız var?

Tabiki bir veritabanına, mysql kullandığımızı varsayarak kod örnekleyeceğim. Ama postgresql fln kullanan arkadaşlar da var ise bu dökümandaki algoritmayı izleyerek kolayca kendileri de kod yazabilirler. Aşağıda veritabanında kullanacağımız üye tablosuna ait veri yapısını import ederek kolayca oluşturabileceğiniz SQL sorgusunu koyuyorum, bu sorgudan hangi alanlar ve özelliklerinin neler olduğunu da kolayca görebilirsiniz.
CREATE TABLE `uyeler` (
  `no` int(10) NOT NULL auto_increment,
  `kadi` varchar(50) NOT NULL default '',
  `sifre` varchar(100) NOT NULL default '',
  `izin` varchar(20) NOT NULL default '',
  `adi` varchar(100) default NULL,
  `eposta` varchar(255) default NULL,
  PRIMARY KEY  (`no`)
) ENGINE=MyISAM AUTO_INCREMENT=1 ;
gördüğünüz gibi basitçe 6 alanım var, burada no, izin, adi ve eposta alanları sistemin düzgün çalışması için şart olan alanlar değiller fakat üyeniz hakkında küçük bir bilgi tutmanızı sağlar. Eğer isterseniz buradaki alan sayınızı artırarak yeni üye detayları ekleyebilirsiniz. Mesela MSN adresi, web sitesi, ev adresi, cep telefonu, kimlik bilgileri mesleği falan fişman.

Şimdilik kayıtlı bir kullanıcının giriş yapmasını vae sayfalarda kullanının giriş yapıp yapmadığını yani oturumunu kontrol etmeyi göstereceğim. Bildiğiniz gibi kayıt işlemi basitçe bir formdan mysql'e veri kaydetme işlemi.. Buna dökümanın sonunda değineceğim.

Giriş işlemi

Giriş işlemini yapcağımız bir form hazırlayın. Kullanıcı adı ve şifre giriş alanları olacak olan 2 input'luk bir form. “kadi” ve “sifre” gibi pratik alan adları belirlerseniz işiniz kolaylaşır. Bu formu giris.php diye bir işlem sayfanıza post methodu ile göndereceğiz. Şuna benzer bir form olacaktır :
<form name="giris" action="giris.php" method="post">

 <table cellpadding="8" cellspacing="0" align="center">
   <tr>
     <td width="100">Kullanıcı Adı</td>
     <td><input type="text" name="kadi"></td>
   </tr>
   <tr>
     <td width="100">Şifre</td>
     <td><input type="password" name="sifre"></td>
   </tr>
   <tr>
     <td colspan="2" align="right">
       <input type="submit" value="Giriş">
     </td>
   </tr>
 </table>

</form>
Giriş işlemi sayfamızın (giris.php) koduna bakacak olursak :
<?php

# mysql baglantisi, sesion_start yapilmis varsayiyoruz

# bilgiler
  $kadi  = $_POST["kadi"];
  $sifre = $_POST["sifre"];

# kullanici bilgisi alalim
  $sorgu = mysql_query("select sifre from uyeler where kadi = '".$kadi."'");
  if( mysql_num_rows($sorgu) != 1 ){
    print '<script>alert("Kullanıcı bulunamadı!");history.back(-1);</script>';
    exit;
  }else{
    # veriyi alıyoruz
      $bilgi = mysql_fetch_assoc($sorgu);
  }

# sifre eslestirmesi
  if( md5( trim($sifre) ) != $bilgi["sifre"] ){
    print '<script>alert("Yanlış şifre girdiniz!");history.back(-1);</script>';
    exit;
  }

# başarılı giriş yapıldı
# oturuma kaydedip anasayfaya gidelim
  $_SESSION["giris"] = md5( "kullanic_oturum_" . md5( $bilgi["sifre"] ) . "_ds785667f5e67w423yjgty" );
  $_SESSION["kadi"]  = $kadi;

?>
<script>
  alert("Başarıyla giriş yaptınız! Şimdi anasayfaya yönlendiriliyorsunuz.");
  window.top.location = './';
</script>
gördüğünüz gibi kontrol kısmında çok karmaşık bir kod yok. MySQL'den kullanıcıya ait veri alıyoruz. Eğer gelen kayıt kümesinin boyutu 1 değilse üye adı yok demektir. Hata veriyoruz. Eğer 1 ise kayıt kümesini $bilgi dizisine alıyoruz. Alt kısımda da girilen şifrenin md5'ini veritabanındaki string ile karşılaştırıyoruz. Çünkü veritabanında şifrelerimizi md5'leyip saklıyoruz. Çünkü birisi veritabanımızı araklarsa md5'i çözemesin diye. Üye bilgilerinin güvenliğini sağlamış oluyoruz.

En altta ise giriş kontrolü için oturuma 2 değişken attım birisi şifre ile oluşturulmuş karışık bir cümlenin md5'li hali. Bunu giriş kontrolünde oturumda olup olmadığını kontrol etmek için kullanacağız. Sadece kullanıcı adı kullanmamamın nedeni ise sunucu yönetimindeki birinin oturumları oynayıp giriş yapmış kullanıcı hakkını değiştirememesi için oldukça basit bir engel o kadar. İsterseniz daha karmaşık kriptografik anahtarlar da oluşturabilirsiniz. Bu sitede sadece anahtar tutulur mesela. Oturum bilgileri veritabanında saklanır.. Bu tarz gelişmiş şeyler için de beyin fırtınası yapıp güzel şeyler yazabilirsiniz.

Şimdi giriş yapıldıktan sonra anasayfa'ya yönlendirildi üye, peki biz sayfalarımızda oturumu gezen misafirin üye olup olmadığını nasıl anlayacağız?

Üye kontrolü, üye oturumu yönetimi

Benim site geliştirme yoluma göre ilk önce sitenin statik sayfasını hazırlayıp parçalardık hatırlarsanız. Ve her işlem/modül dosyamızın başında mysql.php veya ayar.php gibi bir include edilen dosyamız vardır. İşte buna giris_kontrol.php diye bir dosya daha ekleyin. Yani; üye'lere ait bilgileri alacağınız sayfalarda (üye kontrolü, üye alanları fln) giris_kontrol.php diye bir php include ettirin. Her sayfanıza. giris_kontrol.php dosyamızın kodunu verip açıklayayım :
<?php

# uye oturum degiskenleri
  $giris_yapilmis = false;
  $uye = false;

# kontrol ederek bilgileri dogrulayalim
  if( !empty($_SESSION["giris"]) && !empty($_SESSION["kadi"]) ){
  
    # kulanici bilgisini alalim
      $sorgu = mysql_query("select * from uyeler where kadi='".$_SESSION["kadi"]."'");
      if( mysql_num_rows($sorgu) == 1 ){
      
        $uye = mysql_fetch_assoc($sorgu);
        # anahtar kontrol
          if( $_SESSION["giris"]  ==  md5( "kullanic_oturum_" . md5( $uye["sifre"] ) . "_ds785667f5e67w423yjgty" ) ){
            $giris_yapilmis = true;
          }else{
            # giris yanlis. $uye'yi silelim
            $uye = false;
          }
      }
  }

?>
Tabiki bu sayfadan önce mysql ve ayar dosyanızın fln include edildiğini ve session_start yapılmış olduğunu düşünüyoruz çünkü bu sayfayı her sayfanın başında include ediyoruz.

Oturumdaki kadi değişkeni boş değilse veritabanından bilgileri alıyoruz. Eğer kullanıcı yoksa oturum açılmıyor zaten. Eğer şifre ile oluşturulan karışık cümlenin md5'i oturumdaki giris degişkeninin içeriğine eşitse bizim mantıksal koyduğumuz anahtar da doğrudur. Şimdi “giris_yapilmis” değişkenini true yapıyoruz ve $uye dizisine mysql sonuç kümesini atıyoruz. Neden bunu yapıyoruz çünkü, sayfalarımızda doğrudan $giris_yapilmis'i if yapılarımızda giriş yapılmış yapılmamış olduğunu hızlıca alabileceğiz. Mesela üyelere özel bir sayfanız var ise bu sayfanın başında;
if( !$giris_yapilmis ){
  print 'Bu sayfa üyelere özeldir! Lütfen giriş yapın!';
  exit;
}
diyerek giriş yapmamış kullanıcıların o sayfaya erişimini engelleyebilirsiniz.
Eğer üyeye ait bilgilere ihtiyacınız var ise zaten doğrudan $uye dizisinden alabilirsiniz.
Mesela giriş formunun yerine Hoşgeldin X dedirtmek için ile X yerine kullanıcı adını basabilirsiniz.

Kayıt işlemi

Kayıt işleminin mysql'e veri kaydetmek dışında bir kısmı olmadığından örneklemeye gerek duymuyorum. Sadece şifreyi veritabanına md5 fonksiyonundan geçirip kaydediyoruz. Onun dışındaki kontroller ve veri kayıdını yapamayacağınızı düşünmüyorum.


Hazırlayan : Mehmet Fatih YILDIZ

Popüler Etiketler

jquery framework plugin mdb2 pear sql injection chart api google grafik mobile startups javascript js ie css3 support browser html gimp job twitter calendar social media tool facebook connect php prepare execute mysql mssql pgsql auth http while blog query select windows cookie subdomain optimization network örnek kod www redirect crossdomain less css developer mfyz mail newsletter subscription pharma hack wordpress dokuman portfolio db database ios development htaccess apache route router mod_rewrite form radio style ubuntu cache spam kitap ui design button switch oyun wanda digital ruffles language opengraph fql apple macosx workspace music firefox download rss xml login session linux konsol ingilizce statistics istatistik insanlar sosyal medya search ajax export cms mootools kontrol yapıları if tebrik object web app open source input textarea integration service link parse code wireless howto nasıl iOS imza signature icon ikon xhtml nedir browsers terminal optimizasyon server compile compiler app on-the-fly phpstorm jetbrains ide editor ipucu deployment version control svn git url doritos iphone ipad app store store in-app purchase purchase verification storekit itunes connect itunes subversion seo date tarih sitemap coding share webkit osx player laptop notebook table kurulum screen internet lisans license regex internet explorer widget banner ntfs fstab bootstrap proje html5 graph meta lifestream applications free analyse procedure box xmlhttprequest generator logo kampanya tytz assets ux icons diff zaman