Betül SARAL

Bilgisayar Mühendisi

Github Blog Sayfası Oluşturmak

| Comments

Github üzerinde bir bloga sahip olmak için öncelikle (kullanıcı-adınız).github.com isimli bir depo oluşturmalısınız. Benim bloguma ait depo bsaral.github.com adıyla Github’da yer alıyor. Herhangi bir github deposunu ya da benim depomu ( İÇERİĞİ SİLİP GÖRÜNÜMÜ DEĞİŞTİRMEK ŞARTIYLA ) forklayıp istediğiniz gibi değişiklikler yapıp kendi blogunuzu oluşturabilirsiniz.

Kullanım

Sitede 0-1-2-7-9 sayfalama sisteminin Jekyll’a uyarlanmış bir modeli kullanılmaktadır.Site girdilerini doğrudan HTML olarak yazmak yerine, dosya uzantısını .md yapmak kaydıyla, HTML üreten hafif bir etiketleme dili olan Markdown sözdizimini kullanabilirsiniz.

Sayfa Ekleme

1- Ekleyeceğiniz sayfanın kategorisini belirleyin.

Kişisel düşünce ve duygularınızı yansıtan “Web Günlüğü” niteliğinde yazılar 0 kategorisinde

Öğretici değer taşıyan teknik yazılar 1 kategorisinde

2- Örneğin 1 kategorisinde “GitHub’a Giriş” başlıklı bir girdi oluşturmak istediniz. O zaman dosya yolu 1/_posts/2010-09-19-github-giris.md şeklinde olmalıdır.

3- Girdiyi depoya ekleyin ve GitHub’a gönderin.

Terminal 
1
2
3
4
5

$ git add 1/_posts/2010-09-19-github-giris.md

$ git commit -m "yeni girdi: github-giris"

$ git push origin master

Eğer dosyalarda birden fazla değişiklik yada ekleme yaptıysanız git add * komutunu kullanabilirsiniz.Bu komut depoda yaptığınız tüm değişiklikleri göndermenizi sağlar.

Terminal 
1
2
3
4
5

$ git add *

$ git commit -m "yorum yaz"

$ git push origin master

Ayrıntılı bilgi için 19 Sayfa Şablonu bakabilirsiniz.

HTML-PHP-MYSQL İle Form Tasarlamak

| Comments

Amacımız kullanıcı kaydı tutan bir web formu ve bu formdan bilgi alıcak bir php dosyası oluşturup , Php dosyası içerisinde ki bilgileri veri tabanına aktarımını sağlayan tasarımı oluşturmaktır.İlk önce web formumuzu yapalım :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<html>
<head>
<META http-equiv=content-type content=text/html;charset=UTF-8>
<title>   PHP-MYSQL   </title>
</head>
<body>
<form action="form.php" method="post">
İSMİNİZ
<input type="text" name="isim"/><br>
PAROLANIZ
<input type="password" name="par"/><br>
MAİL ADRESİNİZ
<input type="text" name="mail"/><br>
			
<input type="submit" value="GONDER"/>
</form>

</body>
</html>

En basit haliyle kullanıcı için bir web formu oluşturduk. Daha sonra bu formdan bilgileri alıcak ve veri tabanına aktarımını sağlayacak olan PHP dosyamızı oluşturalım :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

<META http-equiv=content-type content=text/html;charset=UTF-8>

<?php

//mysql e bağlanma kısmı
$baglan=mysql_connect("localhost","KULLANICI ADINIZ","KULLANICI ŞİFRENİZ")
or die ("veri tabanına bağlanamadı.");
if(!$baglan){
	die ("veritabanına bağlanılmadı.".mysql_error());
}

//kaydet adında veri tabanınızı oluşturur.
//(eğer kayıtlı veri tabanlarınızdan herhangi biri "kaydet" isminde değil ise).
$veri=mysql_query("create database if not exists kaydet",$baglan);
if ($veri){
	echo "veritabanı oluşturuldu.";}
else {
	echo "hata".mysql_error();}
	
	
//veri tabanı seçilir.
mysql_select_db("kaydet") or die ("hata2");

//kaydet adlı veritabanı içinde form adlı tablo varsa silinir.
mysql_query("drop table if exists form") or die ("hata3");
// ve yenisi oluşturulur.
mysql_query("create table form(
isim varchar(30),
parola char(100) primary key,
mail text(150))") or die ("hata4");

//htm dosyasından aldığı verileri POST metodu ile veri tabanına aktarır.
mysql_query("insert into form (isim,parola,mail) values 
('$_POST[isim]','$_POST[par]','$_POST[mail]')")
or die ("hata5".mysql_error());




mysql_close($baglan);
	
?>

Eğer herşeyi doğru yapmışsanız kullanıcı form da bilgileri girdikten sonra ekrana “veri tabanı oluşturuldu” şeklinde bir yazı gelir. ekranda herhangi bir “hata” şeklinde yazı alıyorsanız yukardaki “hata” yazan kod sırasının herhangi birinde yanlış demektir.

form.htm için: https://gist.github.com/1511957

form.php için : https://gist.github.com/1511960

Ubuntuda LAMP Server Kurulumu

| Comments

Linux ‘ ta yapılan web sitelerini yayınlamak amacıyla PHP+Apache+Mysql üçlüsü gereklidir.Bunları sisteme ayrı ayrı kurmak mümkündür. Fakat Ubuntu ve diğer birçok Linux dağıtımlarında bu iş için LAMP(Linux, Apache, Mysql, Php) paketi geliştirilmiştir. Şimdi terminali açıp sırayla aşağıdaki kodları girelim :

Terminal 
1

$ sudo apt-get install tasksel
Terminal 
1

$ sudo tasksel install lamp-server
Terminal 
1

$ sudo apt-get install phpmyadmin

son kod yazıldıktan sonra phpmyadmin kurulumu gerçekleşmeye başlar.ilk olarak karşınıza [E-H] seçeneği gelir E ye basarak devam edin. Daha sonra karşınıza iki seçeneğin çıktığı bi ekran gelir burda Apache2 yi seçerek devam edin.son olarak sizden şifre girmenizi isteyecektir.şifre girebilir ya da boş bırakıp ENTER a basarak devam edebilirsiniz.

Terminal 
1

$ sudo chmod 0777 /var/www/

Bu kodu da yazdıktan sonra var/www/ (yani burası localhostumuzun klasörüdür.) klasörünün içine deneme.php adlı yeni bi belge açın ve aşağıdaki kodları girin :

var/www/deneme.php 
1
2
3

<?php
	echo 	"merhaba";
?>

Yazıp kaydettikten sonra web tarayıcınız da http://localhost/deneme.php yazın.Eğer sayfanız açılıyorsa LAMP server başarıyla kurulmuş demektir.

Less Css NEDİR?

| Comments

  • LESS CSS Nedir?
  • Neden Less Css Kullanmalıyız ?
  • Less Css Kurulum Ve Kullanımı
  • Less Css Özellikleri

    • 1- LESS CSS Nedir?

    Less css adından da anlaşılacağı gibi css de daha az kod yazarak daha kısa zamanda çok iş yapmamızı sağlar. Ayrıca kodların daha düzenli ve anlaşılır bir biçime gelmesine de önemli bir rol oynar.

    2- Neden Less Css Kullanmalıyız ?

    Artık web uygulamaları basit veya küçük css dosyaları ile şekillendirilen uygulamalar olmaktan çıkıp daha karmaşık ve daha uzun stil dosyalarına dönüştüler.Kodlarımızın anlaşılır olması,belirli bir düzene sahip olması ve daha az yer kaplamasını sağlamak amacıyla less css yi kullanırız.

    3- Less Css Kurulum Ve Kullanımı

    A-)Linux ve Türevleri İçin

    Linux ve türevleri olan işletim sistemlerinde less css yi kurmak için ilk başta aşağıdaki 4 kod terminale girilir.

    Terminal 
    1
2
3
4
5
6
7

    $ sudo apt-get install rubygems1.8 ruby1.8-dev

$ sudo gem install rubygems-update

$ sudo gem update rubygems

$ sudo gem install less

    Kurulum tamamlandıktan sonra .less uzantılı belgemizi aşağıdaki komut sayesinde terminalden derlemiş oluruz.

    Terminal 
    1

    $ lessc deneme.less

    B-)Windows İçin

    Windows işletim sisteminde less css yi kullanmak için WİNLESS adında bir derleyici program kullanılır.Kullanıcının yaptığı .less uzantılı belge bu derleyicide seçilir ve derleme işlemi sonunda .less belgesiyle aynı isimde yeni bir css belgesi oluşur.

    4- Less Css Özellikleri

    A-)Değişkenler

    CSS de tekrar tekrar kullanmamız gereken değerleri bir değişkene atamamızı sağlar.

    1
2
3
4
5
6
7
8
9
10
11

    // LESS CSS					/* COMPİLED CSS */

	  @renk: #4D926F;			#header {
	  #header {	
									color: #4D926F;
		color: @renk;
	  } 						}
	  h2 { 						h2 {
									color: #4D926F;
		color: @renk;			}
	  }

    B-)Katmanlar

    Bir sınıfı başka bir sınıf içerisinde kullanabilme olanağı sağlar.

    1
2
3
4
5
6
7
8
9
10
11
12

    //LESS CSS							/* COMPİLED CSS */

	.bordered {  						#menu a {
	  border-top: dotted 1px			  	color: #111;
	  black;					  			border-top: dotted 1px black;
	border-bottom: solid 2px				border-bottom:		  		
		black;					  			solid 2px black;
	}						 			}
	#menu a {					
		color: #111;
		.bordered;
	}

    C-)İç İçe Kurallar

    Kodları iç içe yazarak daha anlaşılır bir hale getirebilriz.

    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

    //LESS CSS					/*COMPİLED CSS */

   #header {						#header h1 {
	h1 {					 		 	font-weight: bold;
	font-size: 26px;			  			font-size: 26px;}
	font-weight: bold;
        }									#header p {
   p { font-size: 12px;				  			font-size: 12px;}
		a { text-decoration:				#header p a {
			none;					  			text-decoration:none;}
			&:hover { border-width: 1px     #header p a :hover{
					}				  			border-width:1px} 				
		}
     }
  }

    D-)Fonksiyonlar Ve Operatörler

    Fonksiyonlar üzerinde çarpma, çıkarma, toplama, bölme gibi işlemler yaparak değerleri yeniden ayarlayabiliriz.

    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

    //LESS CSS						/*COMPİLED CSS */

@the-border: 1px;							#header {
@base-color: #111;								color:#333;
@red:  #842210;									border-left:1px;
#header {										border-right:2px;
	color: @base-color * 3;					}
	border-left: @the-border;		
	border-right: @the-border * 2;			#footer {
}												color:#114411;
												border-color:#7d2717;
#footer {									}
	color: @base-color + #003300;
	border-color: desaturate(@red, 10%);
}

    Grub Ayarlarının Değiştirilmesi

    | Comments

  • GRUB Nedir?
  • Windows-Ubuntu Kurulu Bilgisayarlarda Ayarlar
  • Windows-Pardus Kurulu Bilgisayarlarda Ayarlar

    • 1- GRUB Nedir?

    GRUB, bir bilgisayarda yüklü bulunan bir ya da birden fazla işletim sisteminin ön yükleme görevini yerine getiren bir ön yükleme yazılımıdır.Daha açık bir ifadeyle, bilgisayarı her açtığınızda karşınıza gelen işletim sistemi seçme ekranı GRUB’un ta kendisidir.

    2- Windows-Ubuntu Kurulu Bilgisayarlarda Ayarlar

    Eğer ki Windows ile birlikte Ubuntuyu kurmuşsanız;

    Bilgisayar açılırken sunulan seçenekte Windows’un veya Ubuntu’nun ilk sırada yer almasını istiyorsanız aşağıda yazılan kodlar size yardımcı olucaktır.

    İlk önce terminalimizi açıyoruz ve kodumuzu yazıyoruz.

    Terminal 
    1

    $ sudo gedit /etc/default/grub

    Gelen bilgilerden default değerini değiştirmeniz yeterli olacaktır.default değeri size 0 olarak görünüyor olabilir.

    siz istediğiniz gibi değiştirebilirsiniz.eğer windowsu o sırada yapmak istiyorsanız ve GRUB ekranında (0 dan başlayarak) 3.sırada ise default değerini 3 yazmanız yeterli olur.

    3- Windows-Pardus Kurulu Bilgisayarlarda Ayarlar

    Eğer ki Windows ile birlikte Ubuntuyu kurmuşsanız;

    Alt+F2 yaparak komut çalıştırı açın ve şu kodu yazın:

    Terminal 
    1

    $ kdesu kwrite /boot/grub/grub.conf

    Ubuntu da yaptığımız gibi açılan pencerede ki default değerini istediğiniz gibi değiştirmeniz yeterli olur. Bilgisayarı yeniden başlattığınızda yaptığnız işlemleri görebilirsiniz.

    Web Sayfalarını Doğrulama

    | Comments

    Site yapımında yazdığımız kodlarının doğruluğu önemlidir.Doğru bir kodlama ise, X(HTML) dökümanının onaylanmış halidir.web sayfalarını doğrulamak için genel olarak bu adres kullanılır.

    Karşınıza çıkan sayfada size 3 şık önerilir.

    • sitenizin adresini
    • siteniz henüz yapım aşamasında ise bilgisayarınızda olan dosyasını
    • yada direk kodu yazarak

    herhangi bir sorun varsa bu sorunu ve niçin olduğunu size gösterir.

    Google Analytics Takip Kodu

    | Comments

    Google Analytics, google ın ücretsiz olarak verdiği bir site takip sistemidir. Sitenizde ki ziyaretçi sayısı, toplam sayfa gösterimi, sayfa başına geçen ortalama süre, ziyaretçi ülke ve durum bilgileri, yeni ziyaret sayısı vb… birçok bilgiye bu sistem tarafından ulaşabilirsiniz.

    Google Analytics için önce sitesine gidip Analytics erişim butonuna basıp google hesabınızla giriş yapmalısınız.

    Çıkan sayfada sitenizin url sini girin.

    eğer herşey doğru gitmişse karşınıza aşağıdaki gibi bir sayfa gelir.

    bu bölümde sitenizin Google Analytics kodu yer alır.bu kodların tamamını kopyalayıp sitenizin html sindeki head tag ının kapanışından öncesine yerleştirmelisiniz.(tam olarak “head BU ARADADA Kİ BOŞLUĞA /head” yerleştiriniz.) işlemleri yaptıktan sonra save and finish e tıklayın. en az 24 saat sonra sisteminiz aktif hale gelecektir.eğer süre 24 saati geçmişse ve hala sistem aktif değilse herhangi bir yerde hata yapmışsınız demektir.işlemleri baştan tekrarlayarak bu problemleri halledebilirsiniz.

    Ubuntu Da Kullanıcı Şifresinin Unutulması

    | Comments

    Kullanıcı şifresi unutulduysa,ilk yapmanız gereken sisteminizi kurtarma modunda (Recovery Mode) yani GRUB menüsünün 2.seçeneğinden başlatmak olacaktır.sistem açıldığında karşınıza bir pencere çıkar.bu pencerenin en sonunda bulunan “root kullanıcısı olarak uçbirimi aç” seçeneğini tercih edin.altta uçbirim açılır.uçbirime ilk olarak

    Terminal 
    1

    $ passwd KULLANICI_ADINIZ

    yazıp ENTER a basın.bu kodu yazdıktan sonra sizden yeni şifrenizi girmenizi isteyecektir.şifreyi girdikten sonra

    Terminal 
    1

    $ reboot

    yazıp ENTER a bastığınızda işleminiz tamamlanmış olur.

    Google Servisleri İle Profil Ve Anket Oluşturma

    | Comments

    GOOGLE PROFİL

    Google profil sayesinde arama kutusuna isminiz girildiğinde profiliniz, sonuçlar sayfasında yer alacaktır.Kişilerin sizi daha kolay bulabilmesi ve tanınmanız açısından kullanılacak güzel bir yöntemdir.

    NOT=Google servislerinden yararlanabilmek için öncelikle gmail hesabına sahip olmanız gerekmektedir.

    profilinizi oluşturmak için ilk olarak buraya tıklıyoruz.

    karşınıza şu sayfa geliyor.

    profil oluştur ve devam et butonuna basıp bir sonraki aşamaya geçiyoruz.Açılan 2.penceredeki bilgileri doldurup kaydettikten sonra profilimiz oluşmuş oluyor.Unutmayın ki profilinize ne kadar çok bilgi eklerseniz, arama sonuçlarında da o kadar yukarıda görünürsünüz.

    ANKET OLUŞTURMA

    Google’ın form şablonları ile anketler oluşturulabilir ve bunlar sayesinde istediğiniz verileri toplayabilirsiniz.

    Anket oluşturmak için ilk iş buraya tıklıyoruz.

    karşınıza google dökümanlar sayfası çıkıyor.bu sayfanın sol tarafında bulunan yeni oluştur butonuna basıp form seçeneğine tıklıyoruz.

    ve anket oluşturmak için gerekli olan sayfa karşımıza çıkar

    text butonuna basarak anketi test şekline getirebilir yada başka seçeneklerden de yararlanabilirsiniz.eğer anket sorunuzun arka planını değiştirmek istiyorsanız üstte bulunan “theme:plain” butonuna basarak istediğiniz temanın oluşmasını sağlayabilirsiniz.ayrıca “theme:plain” butonu ile aynı hizada bulunan “Email this form” seçeneği ile postanızda bulunan istediğiniz kişiye bu anketi email olarak gönderebilirsiniz.

    herşey tamamlandıktan sonra gmail hesabınıza anketin oluştuğuna dair bir mail gelecektir.bu mailin içinde size bir site gönderilir.bu site sayesinde anketinizin sonuçlarını takip edebilirsiniz.

    Site Engellemek Ve Engellemeleri Kaldırmak

    | Comments

    SİTE ENGELLEME

    engellemek istediğimiz site omu.edu.tr olsun.

    Terminal 
    1

    	$ sudo gedit /etc/hosts

    komutunu yazarak hosts dosyamızı açıyoruz.

    açılan dosyaya sitenin IP adresini ve kendisini aşağıdaki gibi ekliyoruz.

    0.0.0.0 *.omu.edu.tr

    bu şekilde düzenlediğimizde omu’nun IP adresi 0.0.0.0 olmadığından bağlantı hatası verecek yani siteye giriş engellenmiş olunacaktır.eğer sitenin engellenmesini kaldırıp tekrar eski haline döndürmek istiyorsanız hosts dosyasında yazdığınız sitenin IP adresini ve kendisini silmeniz yeterlidir.

    ENGELLENEN SİTEYE GİRİŞ

    DNS değişikliği yapılmadan yasaklanmış siteler arasından sadece seçtiğiniz sitelere girmek için bu yöntem uygulanır.

    ilk önce sitenin IP adresi öğrenilir.(örn: yasaklı sitemiz omu.edu.tr olsun.)

    Terminal 
    1

    	$ ping -c 1 www.omu.edu.tr

    komutunu yazdığımızda siteye 1 adet ping göndermiş oluruz.

    sonra hosts dosyası açılır.

    Terminal 
    1

    	$ sudo gedit /etc/hosts

    ve IP adresleri eklenir.

    193.140.28.7 *.omu.edu.tr

    kaydedip çıktıktan sonra yasaklı sitemize ulaşabilir duruma gelmiş oluruz.