sunucu servisleri 3 - || megepmegep.meb.gov.tr/mte_program_modul/moduller_pdf/sunucu...yeni bir...

T.C.MİLLİ EĞİTİM BAKANLIĞI

MEGEP(MESLEKİ EĞİTİM VE ÖĞRETİM SİSTEMİNİN

GÜÇLENDİRİLMESİ PROJESİ)

ENDÜSTRİYEL OTOMASYONTEKNOLOJİLERİ

SUNUCU SERVİSLERİ-3

ANKARA 2008

Milli Eğitim Bakanlığı tarafından geliştirilen modüller;

Talim ve Terbiye Kurulu Başkanlığının 02.06.2006 tarih ve 269 sayılı Kararı ileonaylanan, Mesleki ve Teknik Eğitim Okul ve Kurumlarında kademeli olarakyaygınlaştırılan 42 alan ve 192 dala ait çerçeve öğretim programlarındaamaçlanan mesleki yeterlikleri kazandırmaya yönelik geliştirilmiş öğretimmateryalleridir (Ders Notlarıdır).

Modüller, bireylere mesleki yeterlik kazandırmak ve bireysel öğrenmeyerehberlik etmek amacıyla öğrenme materyali olarak hazırlanmış, denenmek vegeliştirilmek üzere Mesleki ve Teknik Eğitim Okul ve Kurumlarındauygulanmaya başlanmıştır.

Modüller teknolojik gelişmelere paralel olarak, amaçlanan yeterliğikazandırmak koşulu ile eğitim öğretim sırasında geliştirilebilir ve yapılmasıönerilen değişiklikler Bakanlıkta ilgili birime bildirilir.

Örgün ve yaygın eğitim kurumları, işletmeler ve kendi kendine mesleki yeterlikkazanmak isteyen bireyler modüllere internet üzerinden ulaşılabilirler.

Basılmış modüller, eğitim kurumlarında öğrencilere ücretsiz olarak dağıtılır.

Modüller hiçbir şekilde ticari amaçla kullanılamaz ve ücret karşılığındasatılamaz.

i

AÇIKLAMALAR ...................................................................................................................iiiGİRİŞ .......................................................................................................................................1ÖĞRENME FAALİYETİ – 1 ..................................................................................................31. WEB SAYFASI TEMELLERİ ............................................................................................ 3

1.1. Web Data Hazırlama.....................................................................................................31.1.1. Metin Editörü.........................................................................................................41.1.2. Yayınlama..............................................................................................................41.1.3. Sistemin Çalışması ................................................................................................ 41.1.4. Web Tarayıcıları ....................................................................................................41.1.5. Web Sayfasının Temel Yapısı ...............................................................................51.1.6. Koda Açıklama Ekleme......................................................................................... 7

1.2. Resimlerle Çalışma .......................................................................................................71.3. Metinlere Bağlantı Kazandırmak .................................................................................. 9

1.3.1. Gerçek Dünyada Tasarım .................................................................................... 101.4. Listeler ........................................................................................................................ 11

1.4.1. Yan Yana Birden Çok Boşluk Kullanımı ve Özel Karakter Kodları................... 121.5. Çerçeveler ................................................................................................................... 131.6. Tablolar ....................................................................................................................... 141.7. Formlar........................................................................................................................ 17

1.7.1. Form Türleri ........................................................................................................171.7.2. Metin Kutusu .......................................................................................................171.7.4. İşaret Kutusu........................................................................................................171.7.5. Şifre Giriş Formu.................................................................................................171.7.6. Gönder Tuşu ........................................................................................................171.7.7. Sıfırla Tuşu ..........................................................................................................18

UYGULAMA FAALİYETİ .............................................................................................. 19ÖLÇME VE DEĞERLENDİRME .................................................................................... 21

ÖĞRENME FAALİYETİ – 2 ................................................................................................ 232. CGI PROGRAMLAMA.....................................................................................................23

2.1. Perl Dili ....................................................................................................................... 242.1.1. Linux İçin İse Aşağıdaki Aşamaların Yerine Getirilmesi Gereklidir .................. 24

2.2. CGI Programının Temelleri ........................................................................................ 252.3. C Dili Kullanımı .........................................................................................................262.4. Perl Dili Kullanımı......................................................................................................26

2.4.1. Perl’de Değişkenlerin Kullanımı ........................................................................282.4.2. HTML Etiketlerinin CGI Programında Kullanımı ..............................................282.4.3. Özel Karakterlerin Yazdırılması..........................................................................292.4.2. For Döngüsünün Kullanımı ................................................................................. 292.4.3. Dizi Yapısının Oluşturulması ..............................................................................292.4.4. Foreeach Döngüsünün Kullanımı ........................................................................302.4.5. Form Etiketinin Kullanımı................................................................................... 302.4.6. HTML’deki A Etiketinin kullanımı .....................................................................312.4.7. HTML’deki FRAME Etiketinin Kullanımı ......................................................... 322.4.8.Sprintf Fonksiyonu ............................................................................................... 332.4.9.Time Fonksiyonu..................................................................................................34

İÇİNDEKİLER

ii

2.4.10. Localtime Fonksiyonu ....................................................................................... 342.4.11. Ana Programdan Alt program Çağırma............................................................. 362.2.12. Dosyalarla Çalışma............................................................................................ 372.4.13. Dosya Açılamadığı Zaman Hata Mesajının Görüntülenmesi ............................ 392.4.14. Dosyada Yer Alan Tüm Kayıtların Görüntülenmesi .........................................402.4.15. Okuma Dosyası İçin Program ve Kayıt ............................................................. 422.4.16. Erişim Sayıcı Program Yapma ..........................................................................44

UYGULAMA FAALİYETİ .............................................................................................. 48ÖLÇME VE DEĞERLENDİRME .................................................................................... 49

MODÜL DEĞERLENDİRME .............................................................................................. 50CEVAP ANAHTARLARI .....................................................................................................51KAYNAKÇA......................................................................................................................... 52

iii

AÇIKLAMALAR

KOD 481BB0082

ALAN Endüstriyel Otomasyon Teknolojileri

DAL/MESLEK Endüstriyel Kontrol Teknisyenliği

MODÜLÜN ADI Sunucu Servisleri - 3

MODÜLÜN TANIMI

Web sayfası hazırlamak amacıyla gerekli HTML etiketleri vesunucu tabanlı programlama yapmak için PERL dilikomutlarının uygulama becerilerinin verildiği öğretimmateryalidir.

SÜRE 40/32

ÖN KOŞUL Sunucu Servisleri - 2 modülünü almış olmak.

YETERLİK Sunucu servisleri kurmak.

MODÜLÜN AMACI

Genel AmaçSunucu servislerini doğru olarak kurabileceksiniz.

Amaçlar1. HTML ile web sayfa tasarımını doğru olarak

yapabileceksiniz.2. CGI programlamayı doğru olarak yapabileceksiniz.

EĞİTİM ÖĞRETİMORTAMLARI VEDONANIMLARI

Ortam:Bilgisayar laboratuvarı

Donanım:Bilgisayar, bilgisayar çevre birimleri.

ÖLÇME VEDEĞERLENDİRME

Her faaliyetin sonunda ölçme soruları ile öğrenme düzeyiniziölçeceksiniz. Araştırmalarla, grup çalışmaları ve bireyselçalışmalarla öğretmen rehberliğinde ölçme vedeğerlendirmeyi gerçekleştirebileceksiniz.

AÇIKLAMALAR

1

GİRİŞ

Sevgili Öğrenci,

Bu modülden itibaren temel HTML etiketlerini kullanmaya başlayacaksınız. HTMLetiketleri değişik amaçlar için hazırlanan Web sayfalarının tasarımında kullanılmaktadır.Sadece HTML etiketlerini kullanarak hazırlanan sayfalar statik bir yapıda olurken, kullanıcıile etkileşimli dinamik web sayfaları oluşturmak için tarayıcı tabanlı ya da sunucu tabanlıprogramlama yöntemlerinin kullanılması gerekmektedir.

Bu şekilde tarayıcı üzerinde ya da sunucu üzerinde çalışan programlara betik (script)adı verilmektedir. Sunucu Servisleri 3 modülü, 2 öğrenme faaliyetinden oluşmaktadır.

HTML etiketleri ile web sayfası hazırlama,

PERL dili kullanarak CGI (Common Gateway Interface) programları yazma.

Öğrenme faaliyetlerinde konu genel olarak değil örnekler üzerinde anlatılmıştır. Buyöntem, yapacağınız uygulamalara rehberlik edecektir. Örneklerde, yazılacak kodların ekrangörüntüsü ve tarayıcıda elde edilen görüntüsü verilecektir. Bu yol ile uygulamalardayararlanacağınız işlem basamaklarını daha iyi anlayacaksınız.

GİRİŞ

3

ÖĞRENME FAALİYETİ – 1

HTML ile web sayfa tasarımını doğru olarak yapabileceksiniz.

Bu öğrenme faaliyetinden önce aşağıdaki hazırlıkları yapmalısınız.

Web sayfası tasarımında kullanılan paket programlar hakkında araştırmayapınız.

Web sayfalarında kullanılmak üzere gerekli resim ve animasyonları hazırlamakiçin kullanılan programlar hakkında araştırma yapınız.

1. WEB SAYFASI TEMELLERİ

1.1. Web Data Hazırlama

HTML, (Hyper Text Markup language) özel etiketler kullanılarak belgelerinbiçimlendirildiği bir dildir. Bu belgeler tarayıcı (browser) denilen programlar aracılığıylagörüntülenir. HTML yalnızca yayınlanacak bilgileri içeren bir metin dosyasıdır. Birprogramlama dili değildir. HTML’nin farklı sürümleri, farklı özelliklere sahiptir (Html 1.0,Html 3.0 gb). Her yeni sürüm tam anlamıyla geriye doğru uyumludur (kendinden öncekisürümlerle uyumludur) ve HTML standartlarını birkaç adım daha ileri götürmektedir. Farklıbilgisayarlar ve kelime-işlem programları arasında, yazı dosyalarının biçimlendirilmesindeortak bir yöntem bulma çabası, 1986’da, Dünya Standartlar Enstitüsü tarafından StandartGenelleştirilmiş İşaretleme Dili (Standart Generalized Markup Language, SGML) adıylabirleştirildi.

SGML ile ondan türetilen HTML ve XML dilleri kullanılarak oluşturulan belgeler,programlama dillerinden farklı olarak doğrudan bilgisayarın işletim sistemine değilse bile biryazılıma, örneğin kelime-işlemcisine ya da tarayıcıya “aşağıdaki veriyi ekranda şöyle göster,yazıcıdan da şöyle çıkart” anlamına gelen komutları içerir.

Web sayfalarının, programlama dillerinde olduğu gibi bir kaynak kodu bulunur. Websayfaları bu doğrultuda iki türlü hazırlanmaktadır. Bunlardan bazıları frontpage,dreamweawer gibi profesyonel programları kullanarak web sayfalarının hazırlanmasıdır.Diğer yolu ise, notepad gibi bir metin editörü ya da bazı editör programları kullanmaktır. Birmetin editörü ile oluşturulacak web sayfaları, bu konuda bir temel olması açısındanönemlidir.

Web sayfasının hazırlanmasında kullanılan gerekli programlar şunlardır:

ÖĞRENME FAALİYETİ–1

AMAÇ

ARAŞTIRMA

4

1.1.1. Metin Editörü

Windows’ta NotePad ya da WordPad, Linux’ta Vi ya da Gedit gibi basit metineditörlerini kullanabiliriz. Metin editörlerinde yazılan HTML kodu her zaman için mutlakatext file (metin dosyası - Salt Metin) olarak dosya uzantısı da .html olarak kaydedilmelidir.“.txt” olarak kaydedilen metin dosyasının uzantısı .html olarak da değiştirilebilir. Eğer dosyauzantısı olarak en fazla üç karakteri destekleyen işletim sistemleri kullanılıyorsa, dosyauzantısı .htm olarak verilebilir. Bir tarayıcıda görüntülenen web sayfasının kaynak kodunuelde etmek için ise sayfanın üzerinde, farenin sağ tuşu tıklandıktan sonra, kaynağı görüntüleseçeneği tıklanır. Bundan başka, internet explorer için görünüm menüsünden “kaynak”komut satırı tıklanarak aynı şekilde sayfanın kaynak kodu görüntülenebilir. Ayrıca, kodyazarken büyük küçük harf ayrımı yoktur.

1.1.2. Yayınlama

Web sunucu kurulu bilgisayarlarda işletim sistemine bağlı olarak, belirlenen yerdeyeni bir dizin oluşturulur. Bu dizine girilerek boş bir metin dosyası oluşturulup dosya adı veuzantısı index.html olarak değiştirilir. Index.html her zaman için ilk sayfa olacaktır. Webüzerine yüklendiğinde web sunucu index.html’yi ilk sayfa olarak görecektir. Index.htmlmetin editöründe açılarak web sayfası kodu yazılabilir duruma getirilebilir. Web sayfası içinhazırlanan index sayfasının, varsayılan olarak ayarlanmış dizine yerleştirilmesigerekmektedir.

1.1.3. Sistemin Çalışması

Bir tarayıcının internet üzerinden web iletişimi şu şekilde gerçekleşir. Tarayıcı iletişimkuracağı web sunucudan istekte bulunur. Web sunucu üzerinde yüklü olan web sitesininiçeriğini istemci bilgisayara geri döndürür. Günümüzde kullanılan birçok farklı tarayıcıçeşidi vardır ve her geçen gün yeni versiyonları çıkmaktadır. Bu şekilde destekledikleriözellik sayısı artmaktadır. Bu yüzden bazen web sayfaları farklı tarayıcılarda, farklıgörünümlere sahip olabilir.

1.1.4. Web Tarayıcıları

Web tasarımcısının, HTML komutları kadar, hatta onlardan da çok iyi bilmesigereken, tarayıcıların HTML’i nasıl yorumladığıdır. Bu nedenle bir Web tasarımcısınınbilgisayarında, web sunucu yazılımı bulunmayabilir (sayfalarına başka bir internet websunucu hizmeti veren kişi veya firma ev sahipliği yapıyor olabilir), ama mutlaka piyasayamevcut web tarayıcılarının hemen bütün geçerli sürümleri bulunmalıdır. Netscape firmasınınNavigator ve Communicator adıyla piyasaya sürdüğü farklı sürümleri ayrı ayrı dizinlerdedurmak şartıyla aynı bilgisayarda çalışabilir. Ancak Microsoft firmasının Internet Exploreradlı programının farklı sürümleri aynı Windows ortamında bir arada bulunamazlar.

Neden değişik tarayıcıların değişik sürümlerine ihtiyacınız var? Bu sorunun cevabı,HTML’in internet’in ortak dili olduğu gerçeğine bir ölçüde gölge düşürecektir. Çünkü ortak

5

bir HTML dili bulunmasına rağmen, tarayıcıların ve aynı tarayıcının farklı sürümlerininHTML’i yorumlayışı farklıdır.

1.1.5. Web Sayfasının Temel Yapısı<html> sayfa html ile başlar.

<head>

<title> tarayıcının başlık çubuğunda görüntülenecek ifade yazılır.

</title>

</head>

<body> web sayfasında görüntülenmesi istenen ifade yazılır.

</body>

</html>

HTML etiketleri < > şeklinde ifade edilen işaretlerin arasına yazılan HTMLdeyimleridir. Hemen hemen her kodun başlangıcı < > ve bitişi </ > şeklindedir. Bu ibarelerarasında kalan işlemler ilgili etiket tarafından icra edilir. Bazı deyimlerin bir veya daha fazlaparametresi vardır. Bu parametrelerin hepsi seçimliktir. Yani kullanma zorunluluğu yoktur.Fakat kullanıldığı takdirde deyime zenginlik katar. Ayrıca bu parametrelerin kullanılmasıiçin belli bir sıralama yoktur. Bundan başka yukarıdaki etiketleri kullanmadan da,tarayıcımıza bir şeyler yazdırabiliriz. Fakat amacımız sadece yazı yazdırmak değil de, bazıprogramlar(script) kullanarak sayfamızı daha etkileşimli hale getirmek ise, bu etiketlerinyazılmaması durumunda, sayfa görüntülenemeyecektir.

HTML belgesi, iki bölüme ayrılır. Baş taraf (başlangıç) (<HEAD>) ve gövde(<BODY>) bölümleri. Web tarayıcılar, bir belgeyi istediğiniz tarzda yorumlayabilmek için,HTML etiketini gördükten sonra, HEAD ve BODY etiketlerini arar ve ekrandaki sayfayıbuna göre biçimlendirirler. Sayfanın baş tarafı (head), sayfanın en üstünde, örneğin birgazetenin başlığı gibi gösterilen bir metin olmayıp, belge hakkında genel bilgileri kapsayanbölümdür. Burada yer alabilecek genel etiketler (meta tag), örneğin;

<meta http-equiv=”Content-Type” content=”text/html; charset=windows-1254”>,HTML sayfalarının İngilizce metinlerden oluştuğunu varsayan tarayıcıya, sayfamızın Türkçeolduğunu bildirmek için kullanılır.

6

Örnek 1.1:

<html><head>

<title>test sayfası</title></head>

<body>Merhaba!<br>Otomasyon<hr><p>Bölümü öğrencileri</p>

</body></html>

Şekil 1.1: hr ve br etiketi

Yukarıdaki örnekte “merhaba” ifadesi yazıldıktan sonra <br> etiketi ile bir alt satırageçilir, daha sonra Otomasyon ifadesi yazdırılır. <hr> etiketi, yatay bir çizgi çizmek içinkullanılır. <p> etiketi ise metne paragraf özelliği kazandırır.

Örnek 1.2:

<html><head> <title>test sayfası</title></head>

<body><h1>otomasyon bölümü</h1><h2> otomasyon bölümü </h2><h3> otomasyon bölümü </h3><h4> otomasyon bölümü </h4><h5> otomasyon bölümü </h5><h6> otomasyon bölümü </h6>

</body></html>

Şekil 1.2: Başlık etiketi

Yukarıdaki örnekte h1, h2, h3, h4, h5, h6 etiketleri ile farklı başlık seviyelerioluşturulmuştur.

Örnek 1.3:

<html><head> <title>Renkli ve italik yazı</title></head>

7

<body><p><font color=”red” size=”+2”>Otomasyon nedir?</font></p><i><font face=”arial”>Otomasyon, otomatik kontrolün<br>Fransızca ifade

edilmesidir. <br> Otomasyona geçen işletmeler,<br> Rekabetin olduğu piyasada<br>rakiplerine göre üstünlük sağlarlar. </font></i></body></html>

Şekil 1.3: Font Etiketi

1.1.6. Koda Açıklama Ekleme

 Bu etiket küçüktür işaretiyle başlar ve büyüktür işaretiyle biter. Ünlemişareti, tarayıcının ondan sonra gelen bilgileri sanki yokmuş gibi dikkate almasını sağlar. Buetiketin içine bir yorum eklenerek, HTML dokümanı bölümlere ayrılabilir. Yorum etiketleri,açıklama eklemek istenilen herhangi bir yerde kullanılabilir.

1.2. Resimlerle Çalışma<img src=”resim.jpg”> Bu etiket, resmin kaynağını (yolunu) kullanarak, tarayıcıda

göstermek için kullanılır. Bu ifadede resim.jpg dosyasının, kullanılan html sayfasıyla aynıklasörde olduğu varsayılmıştır.

Aşağıdaki örnek için Fedora işletim sisteminde bulunan html klasörünün altına(/var/www/html) winter.jpg isimli bir resim kopyalayınız. Ayrıca html klasörünün altınaresim isimli bir klasör oluşturunuz. Resim klasörünün içine sunset.jpg isimli bir resimkopyalayınız. Son olarak www (/var/www) klasörünün altına bluehills.jpg isimli bir resimkopyalayınız.

<Font> etiketi metnin rengini,boyutunu ve tipini değiştirmekiçin kullanılır. “Size”parametresindeki “+2” ifadesimetnin normalden iki kat dahabüyük yazılacağını ifade eder.“Color” parametresindeki “red”değeri yerine renklerinhexadecimal kodları da yazılabilir.Örneğin <font color=”#ff0000”>ifadesi de metne renk özelliğikazandırır.<i> etiketi ise, yazının italikyazılmasını sağlar.

8

Örnek 1.4:<html><head>

<title>resim ekleme </title></head><body>

<p><h2>resimleri web sayfalarına ekleyebiliriz</h2></p><p><img src="winter.jpg" alt=”bahar” width=”307” height=”204”align=”top” border=”0”> bahar mevsiminin güzelliklerini sergileyen birresim <p><img src=”resim/sunset.jpg” alt=”yaz” width=”307” height=”204”align=”middle” border=”1”>yaz mevsiminin güzelliklerini sergileyen birresim <p><img src=”../bluehills.jpg” alt=”sonbahar” width=”307”height=”204” align=”bottom” border=”2”> sonbahar mevsiminingüzelliklerini sergileyen bir resim

</body></html>

Şekil 1.4: img etiketi

Bu örnekte resimlerin bulunduğu yer dikkate alınmalıdır. Birinci bölümde winter.jpgresim dosyası web sitesinin bulunduğu dizinin içindedir. Dolayısıyla yol tanımlamaya gerekyoktur.İkinci bölümde sunset.jpg resim dosyası Resim dizini içindedir. Bu dizin websitesinin içinde bulunduğu dizin altında oluşturulmuştur. Dolayısıyla yol tanımlamasıResim/sunset.jpg şeklinde olmalıdır.Üçüncü bölümde ise bluehills.jpg resim dosyası websitesinin içinde bulunduğu dizinin üstünde açılmıştır. Dolayısıyla yol tanımlama../bluehills.jpg şeklinde olacaktır.

9

Etiketler Parametreler Fonksiyon

<IMG>

Src Alt

Width, Height Align

Border

Resmi web sayfasına yerleştirir. Resim üzerine geldiğimizde

görüntülenecek mesajı belirler. Resmin boyutlarını belirler Yerleştirildiği alan için sola,

sağa veya ortaya hizalamayapar.

Resmin çerçeve kalınlığınıbelirler.

Şekil 1.5: img etiketi parametreleri

1.3. Metinlere Bağlantı Kazandırmak

Anchor, etiketi (<A>..</A>), metinlere bağlantı özelliği kazandıran bir etikettir.Aşağıdakiler bu etiketin parametreleridir.

HREF=”url”: URL, (Uniform Resource Locator) internette adres demektir. Bu adres,kendi sabit diskinizde bir klasör (ve alt-klasörler) içindeki bir dosyanın adı olabileceği gibi,HTTP, FTP veya elektronik posta yoluyla ulaşılabilecek bir web alanı ve o alanın içindekibir dosya olabilir.

NAME=”metin”: Anchor’a isim vererek, daha sonra bu noktaya atıfta bulunmaimkânı kazandırır. Bunu, bir sayfanın kendi içinde, belirli yerleri, örneğin baş tarafı,belirlemek için kullanabilirsiniz. Çok uzun bir sayfanın baş tarafına

<a name="ust"> şeklinde bir “isimlendirilmiş Anchor” noktası koyarsanız ve aşağıdabaş tarafa dönüşü kolaylaştırmak için şöyle bir bağlantı yapılabilir.

<A HREF="ust”>Baş tarafa dönmek için burayı tıklayınız</A>

TARGET=”pencere”: Bu bağlantı sağlandığı zaman alınacak HTML sayfasınınnerede kullanacağını gösterir. FRAMESET etiketi bulunan bir sayfada kullanılması halinde,alınacak sayfanın hangi çerçeveye konulacağını gösterir. Burada “pencere” kelimesininyerine şu değerler yazılabilir:

“çerçeve adı”: Oluşturulan çerçevelere önceden isim verilmiş ise, o isimler burayayazılmak suretiyle, alınacak HTML sayfasının hangi çerçeveye yerleştirileceği belirtilebilir.Çerçeve isimleri mutlaka rakam veya harfle başlamalıdır.

blank : Alınacak sayfa veya unsur için yeni bir tarayıcı penceresi açılır.parent : Alınacak unsur, o anda açık sayfayı oluşturmuş bir ana sayfa varsa onun

yerine konulur.self : Alınacak sayfa mevcut sayfanın bulunduğu tarayıcı penceresine

konulur.top : Alınacak sayfa mevcut pencereye en üstten itibaren konulur.

10

Örnek 1.5:

<html><head><title>Link verme </title></head>

<body><p><a name="top"></a><h1>Sayfanın en üstü.</h1><p><a href="#bottom">sayfanın en altına gitmek için tıklayınız.</a><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><p><a href="#top">sayfanın en üstüne gitmek için tıklayınız</a><p><a name="bottom"></a><h1>Sayfanın en altı.</h1>

</body></html>

1.3.1. Gerçek Dünyada Tasarım

İnternette web sayfalarına erişilirken bir sayfanın yüklenmesini beklemek bazen sıkıcıolabilir. Kodunuzu daha verimli hale getirmeyi düşündüğünüzde, resim dosyalarından birkaçkilobyte fedakârlık edilebilir. Ancak bu durumda koda da bakmaya gerek olabilir. Fazladankonulan boşluk, gereksiz bir etiket ve bir cümlenin sonunda bir nokta olabilir. Dosyadaki herkarakter dosya boyunu, yani web üzerinden aktarım süresini arttırır. En sık görülen zamanharcayıcılar, boş <B>..</B> ve <I>..</I> etiketleridir.

Koda bakmanın bir diğer faydası, küçük hataların sorun haline gelmeden önce tespitedilmesidir. Bu şekilde ilerde bulması zorlaşacak hataları önceden tespit etmek yerindeolacaktır.

Örnek 1.6:

<html>

<head><title>test sayfası</title></head><body>

<p><sup>super</sup>script, <sub>sub</sub>script<p><strike>strike</strike>, <u>altı çizgili</u><blockquote>Tablolar sayfa biçimlendirmede en uygun yöntemdir.</blockquote><pre>

1 2 3 4 5 6 7

11

8 9 10 11 12 13 14- - sıralı sayılar - -

</pre></body>

</html>

Burada kullanılan <sup> etiketi üst simge yapmak için, <sub> etiketi ise alt simgeyapmaya yarar. <strike> etiketi ise metnin üzerini çizmek için kullanılır. <blockquote>etiketi yazı bloklarını cazip bir şekilde sunmak için etkili bir yoldur. Sayfa boşluklarının vediğer boşlukların ayarlanması için kullanılan bir yöntemdir. <pre> etiketinden sonrakullanılan tüm ifadeler olduğu gibi tarayıcıda gösterilecektir.

1.4. ListelerListeler sıralı ve sırasız olmak üzere ikiye ayrılır. Aşağıdaki örnek sıralı liste

oluşturmayı göstermektedir.Örnek 1.7

<html><head><title>Listeler</title></head>

<body bgcolor=pink><ol type="1"><li>Otomasyon

<ol type="a"><li>elektronik<li>mekanik</ol>

<li>Bilgisayar<ol type="a"><li>Yazılım<li>Donamım</ol>

<li>Kimya<ol type="a"><li>Organik<li>İnorganik

<ol type="i"><li>elementler<li>iletkenler</ol>

</ol></ol>

</body></html>

Şekil 1.6: Sıralı listeler

12

Aşağıdaki örnek sırasız listelemeyi göstermektedir.

Örnek 1.8:<html><head><title>Listeler</title></head>

<body bgcolor=pink><ul type="disc"><li>Kimya

<ul type="square"><li>İnorganik<li>Analitik</ul>

<li>Fizik<ul type="square"><li>Dinamik<li>Statik</ul>

<li>Matematik<ul type="square"><li>Sayılar<li>Diğer

<ul type="circle"><li>Türev<li>İntegral</ul>

</ul></ul></body></html>

1.4.1. Yan Yana Birden Çok Boşluk Kullanımı ve Özel Karakter Kodları

Yan yana birden çok boşluk koymanın bir yolu özel karakterler kullanmaktır.Normalde klavyeden giremediğiniz özel karakterleri, karşılık gelen kodlarla yazabiliriz. Tümözel karakter & ile ; arasında yer alan kodlarla gösterilir. En çok kullanılan özelkarakterlerden bazıları şunlardır.

: Boşluk© : © işareti< : <> : >& : &

Şekil 1.7: Sıralı olmayan listeler

13

Yan yana birden çok yazarak birden çok boşluğun görüntülenmesinisağlanabilir. Böylece paragraflara içeriden başlanabilir veya iki kelime arasında birden çokboşluk bırakılabilir. #include <stdio.h> ifadesi #include <stdio.h> ,  ifadesiise şeklinde tarayıcıda görüntülenecektir.

1.5. Çerçeveler

Örnek 1.9:

index.html<html><head><title>Çerçeve yapılması</title></head><frameset cols="20%,80%">

<frame src="a.html" name="ilk"><frame src="b.html" name="ana">

</frameset></html>

a.html b.html<html><head><title>Tablo yapılması</title></head><body bgcolor=yellow></body></html>

link.html

<html><head><title>Çerçevede Link</title></head><body bgcolor=pink>MERHABA DÜNYA</body></html>

Linke Tıklandıktan Sonraindex.html

<html><head><title>Tablo yapılması</title></head><body bgcolor=pink><a href="link.htm" target="ana">merhaba</a></body></html>

14

Tablo Oluşturma

Şekil 1.8: Frame etiketi Şekil 1.9: Frame etiketi ve link verme

Çerçevelerin kullanımında ihtiyacınız olan en az iki adet farklı web sayfasıdır.Bunların tek bir web sayfasında belirli oranlarda görüntülenmesi için frame yapısı kullanılır.Çerçeve kullanımı web sayfanızı daha görsel hale getireceği için tercih edilebilir.

Frame etiketinin name parametresi ile çerçevelere isim verilebilir. Bu isimler linkverilirken kullanılarak, sayfanın istenilen çerçevede görüntülenmesini sağlamak içinkullanılabilir.

1.6. Tablolar

Table etiketinin birçok parametresi vardır. Komutun en basit şekli:

<table> <tr> <td> </td> </tr> </table>

Bu komuta eklenebilecek parametreler aşağıda tanımlanmıştır.

“Width” tablonun genişliğinin piksel olarak belirtilmesidir. Tablo, belirlenecek budeğerden büyük olamayacaktır.

“Border” tabloda kullanılacak olan çerçevenin piksel olarak kalınlığıdır.

“Cellspacing” parametresi, tablonun içinde bulunan kutuların birbirleri arasındakimesafeyi piksel olarak belirler. Bu değer boşluk mesafesinin değeridir.

“Cellpadding” parametresi de aynı şekilde tablonun içinde bulunan öğelerinetrafındaki yakınlık mesafesi değeridir.

a.html b.html

link.html

15

“bgcolor” parametresi tablonun zeminindeki rengi html kodlarıyla belirlenmesinigerçekleştirir.

“bordercolor” parametresiyse, çerçevelerde kullanılacak renkleri belirler.

“<tr> </tr>” satırları tanımlar“<td> </td>” sütunları tanımlar.

1 satır ve 2 sütundan oluşan tablo

<tr><td>1</td><td>2</td></tr>

2 satır ve 1 sütundan oluşan tablo<tr><td>1</td></tr><tr><td>2</td></tr>Örnek 1 .10:

<html><head><title>Tablo yapılması</title></head><body bgcolor=”pink”><p><table border=”8” bordercolor=”blue” width=”300” height=”150” align=”center”><caption align=”center”><b>Tablonun renklendirilmesi</b></caption><tr><td colspan=”2” bgcolor=”fucia” align=”center”><b>11.Sınıf Dersleri</b></td></tr><tr><td bgcolor=”red”>Mekatronik</td><td bgcolor=”aqua”>Bilgisayar Ağları</td></tr><tr><td bgcolor=”gray”>Bilgisayar Kontrol</td><td bgcolor=”yellow”>Ardışık Kontrol </td></tr></table><br></body></html>

16

Şekil 1.10: Table etiketi

<Table> etiketinin içerisinde tablo için herhangi bir açıklama yapmak istiyorsakcaption etiketi kullanılır. Yukarıdaki örnekte tablonun ilk satırında iki sütunun birleştirmekamacıyla <td> etiketinin colspan parametresi kullanılmıştır. Eğer satırlar birleştirilmekistenirse kullanılacak etiket rowspan olacaktır. Hücrelerdeki metinler biçimlendirilmekistenirse bu durumda <td> etiketinin içerisinde verilmek istenen biçimin parametresikullanılmalıdır. Tablonun tarayıcıda kaplayacağı yer, width ve height parametreleri ile pikselcinsinden girilebileceği gibi, tarayıcının belirli bir bölümünü kaplaması için % cinsinden degirilebilir.

Örnek 1.11:

<html><body><table border="1" width="75%"><tr><td rowspan="2" align="center">Kutu 1</td><td align="center">Kutu 2</td><td align="center">Kutu 3</td></tr><tr><td colspan="2" align="center">Kutu 4</td></tr>

</table></body></html>

Şekil 1.11: Rowspan ve Colspan parametresi

17

1.7. Formlar

Web sayfalarında kullanılan formlar sayfayı ziyaret eden kişinin siteye formlararacılığıyla metin yollamasını, bir liste varsa bu listeden bir seçenek seçmesini sağlayanHTML komutlarından oluşmaktadır.

1.7.1. Form Türleri

Metin, radyo düğmesi, işaret kutusu, şifre, gönder tuşu, sıfırla tuşu, HTML dilindekullanılan formlardır.

1.7.2. Metin Kutusu

Form üzerinde bilgi alınmasını sağlayan boş kutucuklardır.<input type='Text' name=”isim” value=”deger” align=”TOP” size=”10”

maxlength=”10”>

1.7.3. Radyo Düğmesi

Bu düğme seçmeli sınavlarda kullanılan bir ya da birden çok öğenin seçilebilmesi içinkullanılan, bilginin seçimini gösteren bir düğmedir.

<input type=”Radio” name=”isim” value=”değer” align=”TOP”>

1.7.4. İşaret Kutusu

İşaret kutusunun Radyo kutusundan belirgin bir farkı, radyo kutusunun bir defaseçildiğinde seçimin bir daha kaldırılamamasıdır. Ancak işaret kutusunda bu seçim tekrarüzerine tıklandığında kaldırılabilir.

<input type=”Checkbox” name=”isim” value=”değer” align=”TOP”>

1.7.5. Şifre Giriş Formu

Şifrelerin yazılabilmesi için özel bir kutucuk bulunmaktadır. Bu kutucuk yazılanşifrenin o anda başkası tarafından okunmaması için yazılanları **** olarak göstermektedir.

<input type=”Password” name=”isim” align=”TOP” size=”10” maxlength= ”12”>

1.7.6. Gönder Tuşu

Gönder tuşu(submit) bir bilginin gönderilmesi gerektiği zaman, bu tuşa basılarakgönderme işlemi gerçekleştirilir.

<input type=”Submit” name=”isim” value=”basınız” align=”TOP”>

18

1.7.7. Sıfırla Tuşu

Web sayfasında formlara girilen bilgilerin sıfırlanması istendiğinde, yapılması gerekenbir reset tuşu hazırlamaktır. Bu tuşa basılmasıyla girilen tüm bilgiler anında silinecek vesayfa yeni yüklenmiş gibi olacaktır.

<input type=”Reset” name=”isim” value=”Sıfırla” align=”TOP”>

Örnek 1.12:

<html><head><title>Form tasarımı</title></head><body bgcolor=”pink”><caption><center><b>SIZI TANIYALIM</b></center></caption><form>ADI:<input type="Text" name="isim" align="TOP" size="10"maxlength="10"> <br><br>SOYADI:<input type="Text" name="isim" align="TOP"size="15" maxlength="10"><br><br>ADRESI:<input type="Text"name="isim" align="TOP"size="20" maxlength="10"><br><br>CINSIYETI: <input type="Radio" name="isim" value="erkek">ERKEK<inputtype= "Radio" name="isim" value="kadın">KADIN <br> <br>ILGI ALANLARINIZ:<br><input type="Checkbox" name="isim" value="değer"align="TOP">ELEKTRONİK<input type="Checkbox" name="isim" value="değer"align="TOP">BİLGİSAYAR<input type="Checkbox" name="isim" value="değer"align="TOP">SPOR<br><br>PASWORDUNUZU GIRINIZ:<br><input type="Password" name="isim"align="TOP" size="10" maxlength="12"><br><input type="Submit" name="isim"value="Gönder" align="TOP"> <input type="Reset" name="isim" value="Sıfırla"align="TOP"></form></body></html>

Şekil 1.12: Form etiketi

19

UYGULAMA FAALİYETİ

Aşağıdaki sorulara ilişkin uygulama faaliyetini yapınız.

Aşağıda verilen tabloyu html etiketleri kullanarak tarayıcınızda oluşturunuz.(Tablo tarayıcınızın tamamını kaplasın ve kenarlık değeri “1” olsun.)

1

2 34 5

6

Çalıştığınız klasörden bir üst seviyedeki klasörde bulunan “sayfa1.html” adlı dosyayaçalıştığınız klasörde bulunan bir resim üzerinden link verip yeni bir sayfadagörüntülenmesini sağlayınız.

(resmin üzerine tıklandığında sayfa1.html yeni bir sayfada açılacak)

Aşağıda olduğu gibi bir tablo oluşturarak tablonun ilgili hücrelerine resim yerleştiriniz.1. Resim : Genişlik 40 Yükseklik= 80 Çerçeve= yok2. Resim : Genişlik ve Yükseklik= 80Tablo : Kenarlık = var


20

İşlem Basamakları Öneriler

Temel html etiketlerini (html, head,body) etiketlerini kodunuza yerleştiriniz.

Amacınıza uygun kullanacağınızetiketlerin varsa parametreleriniyerleştiriniz.

Yazdığınız dosyanın uzantısı .html(/var/www/html klasörünün içine)olacak şekilde kaydediniz.

Tarayıcı kullanarak oluşturduğunuzsayfayı görüntüleyiniz.

İhtiyacınız olan etiketleri tespit ediniz.Gereksiz etiket kullanımından kaçınız.

İç içe geçen etiketler kullanırken,etiketlerin uygun sıradayerleştirildiğinden emin olun.

Yazdığınız kodu daha sonra incelerkenkolaylık olması açısından, etiketlerinbazılarının diğerlerinden daha girintiliyazılması gerektiğini unutmayın.

21

ÖLÇME VE DEĞERLENDİRME

Aşağıdaki soruları cevaplayarak bu faaliyette kazandığınız bilgileri ölçünüz.

OBJEKTİF TEST (ÖLÇME SORULARI)

1. En büyük başlık oluşturmak için gerekli HTML etiketi aşağıdakilerden hangisidir?A) <head>B) <h1>C) <h6>D) <heading>

2. Bir satır boşluk vermek için gereken HTML etiketi hangisidir?A) <hr>B) <lb>C) <break>D) <br>

3. Aşağıdakilerden hangisi sayfanın arka plan rengini değiştirmek için kullanılır?A) <background>yellow</background>B) <body color=”yellow”>C) <body bgcolor=”yellow”>D) <body background=”yellow”>

4. Bir metne link vermek için gereken HTML kodu aşağıdakilerden hangisinde doğru olarakverilmiştir.

A) <a name="http://www.mazharzorlu.k12.tr">Sınırsız Bilgi Paylaşımı</a>B) <a href="http:// www.mazharzorlu.k12.tr "> Sınırsız Bilgi Paylaşımı </a>C) <a>http:// www.mazharzorlu.k12.tr </a>D) <a url="http:// www.mazharzorlu.k12.tr "> Sınırsız Bilgi Paylaşımı </a>

5. Bir linki yeni bir tarayıcı sayfasında açmak için hangi HTML kodu kullanılır?A) <a href="url" target="_blank">B) <a href="url" new>C) <a href="url" target="new">D) < a href=”url” target=”_self”>

6. Aşağıda verilenlerden hangilerinin tamamı tablo etiketleridir?A) <table><tr><tt>B) <table><body><td>C) <table><tr><td>D) <table><head><tfoot>


22

7. Bir tablo hücresinin içeriğini sola hizalı yapmak için gereken etiket hangi şıkta doğruolarak verilmiştir.

A) <td valign=”left”>B) <td left>C) <td leftalign>D) <td align=”left”>

8. Sayılardan oluşan sıralı bir liste oluşturmak için hangi etiket kullanılır?A) <ul>B) <list>C) <ol>D) <dl>

9. “checkbox“oluşturmak için gerekli HTML etiketi aşağıdakilerden hangisidir?A) <checkbox>B) <input type=”check”>C) <check>D) <input type=”checkbox”>

10. Web sayfasına bir resim yerleştirmek için gereken HTML kodu hangisidir?A) <img>image.gif</img>B) <img src=”image.gif”>C) <img href=”image.gif”>D) <image src=”image.gif”>

DEĞERLENDİRME:

Cevaplarınızı cevap anahtarı ile karşılaştırınız. Doğru cevap sayınızı belirleyerekkendinizi değerlendiriniz. Yanlış cevap verdiğiniz ya da cevap verirken tereddüt yaşadığınızsorularla ilgili konuları faaliyete geri dönerek tekrar inceleyiniz.

23

ÖĞRENME FAALİYETİ – 2

CGI (Common Gateway Interface) programlamayı doğru olarak yapabileceksiniz.

Tarayıcı tabanlı programlama ile sunucu tabanlı programlama arasındakifarklılıklar nelerdir?

2. CGI PROGRAMLAMA

CGI (Common Gateway Interface) web sitelerinde çeşitli servisler sağlar. CGI, birprogramlama dili ismi değildir. CGI, program ve Web sunucu arasında iletişimi başarmakiçin bir standarttır. CGI ile ziyaretçi tarafından sunucuya bir iş yaptırılır. Bu iş ziyaretçininveritabanı olarak kullanılan dosyalara belli konularda kayıt yapabilmesi şeklinde olabileceğigibi ziyaretçi sayısının sayılması, web üzerinden mail gönderilmesi, ziyaretçinin kişiselbilgilerinin tutulması, bir anket uygulaması olabilir. CGI programlarında “c”, “visual basicscripting” gibi diller kullanılabilse de genel olarak CGI programlarında perl dili kullanılır.Bunun sebebi geniş web sunucu desteği ve perl dilinin köklü ve geniş bir dil oluşudur.

İstemci Sunucu

Şekil 2.1: CGI programının çalışması

Web Sunucu

Web Sayfam

Erişim Sayacı 1055 Program

ÖĞRENME FAALİYETİ–2

AMAÇ

ARAŞTIRMA

24

Yukarıda giriş sayısını tutan bir sayıcı örneği gösterilmiştir. İstemciden gelen istek,yukarıda gösterildiği gibi sunucu tarafından alınır ve web sunucu üzerinde çalışan CGIprogramı kullanılarak sunucu makinesi üzerinde işlenir. Üretilen sonuç istemcide çalışantarayıcı üzerinde görüntülenir.

Perl’in sayısal gösterimi C diline benzer. Perl’i derlemeye gerek yoktur. Bu yüzden,programlama’dan sonra, işlemler test edilmeye hazırdır. Ayrıca, Perl varsayılan olarak UNIXve Linux işletim sisteminde kurulu gelir.

2.1. Perl Dili

Perl, çok zor ve karışık görevleri yerine getirmek için yeterince güçlü bir dildir.Yaygın olarak kullanılır ve çoğu zaman Linux sunucu üzerinde kuruludur. Perl programlarınıderlemeye gerek yoktur. Yazılan kodlar, kaydedilir ve çalıştırılır. Programın kendisi sadecebir metin dosyasıdır, Perl yorumcusu bütün işlemi gerçekleştirir. Bunun avantajı,programınızı küçük değişikliklerle herhangi bir makineye taşıyabilmedir. Derleme ihtiyacıolmadığı için, programı çalıştırmadan, herhangi bir hata tespit edilemez.

CGI programlarınızı (script-betik) kendi yerel makinenizde ya da Linux kabuğundaçalışan herhangi bir programla yazabilirsiniz (pico, gedit, vi vb.). Programınızı uzak birbilgisayarda yazıyorsanız, bir FTP programı aracılığı ile bunu web sunucunuza yüklemenizgerekecektir (upload).

Burada şunu söylemek gerekli olacaktır ki CGI programlarınızı ASCII (plain textfiles) olarak yüklemeniz gereklidir. Eğer binary olarak yüklenirse satır sonlarında birçokkontrol karakteri ile karşılaşılacaktır. Ve bu da programınızda hatalara sebep olacaktır.

Web sunucunun kurulu olduğu Linux makine için, programınız, sunucunun cgidosyalarını çalıştıracağını belirttiği klasörünün içerisinde olmalıdır(cgi-bin). Ayrıca, budosyanın çalıştırılabilir olması için, izinleri değiştirilmelidir, (herkes için okunabilir –çalıştırılabilir, sadece sahibi için tüm haklar).

Bundan başka, Windows işletim sisteminde çalışan apache2triad gibi bir programkullanarak yazılan cgi programları çalıştırılabilir. Bu programı internetten indirebilir(http://sourceforge.net/projects/apache2triad/) ve cgi programlarını deneyebilirsiniz. Buprogram kurulduktan sonra dosyaların belirli bir klasörün içerisinde yer alması gereklidir.Örneğin, “C:\apache2triad\htdocs\apache2triadcp” gibi. Bu klasör programın sürümüne göredeğişebilir.

2.1.1. Linux İçin İse Aşağıdaki Aşamaların Yerine Getirilmesi Gereklidir

Web sunucuda CGI fonksiyonunu yapmak için, web sunucudaki ayar dosyalarına bazıdüzenlemeler yapılır. CGI programının kurulum yeri CGI programını icra etmek veuzantısını belirtmek için kullanılır. Bunun için /etc/httpd/conf/httpd.conf dosyasıdüzenlenmelidir (aşağıdaki satırların dosyada olup olmadığını kontrol ediniz.)

25

Aşağıdaki satırda görülen dizin CGI programlarının depolanması için belirtilir.

ScriptAlias /cgi-bin/ “/var/www/cgi-bin/”

/cgi-bin/ Bu dizin takma isimleri belirtir (rastgele isimler verilebilir).“/var/www/cgi-bin/” Bu dizinde CGI programlarının bulunduğu yer belirtilir.

CGI program için dosya tipi kayıtlıdır.

Web server, HTML ve images gibi çeşitli dosyaları işleyebilir. web server dosyauzantısından dosyanın tipine karar verir. CGI program için dosya tipi yeniden kayıt edilir.

AddHandler cgi-script .cgi

(/var/www/cgi-bin/) nesne dizinidir ve CGI bu adreste icra edilebilir.

<Directory “/var/www/cgi-bin/”>

Options ExecCGIAddHandler cgi-script .cgi

</Directory> httpd servisini yeniden başlatınız (restart).

2.2. CGI Programının Temelleri

CGI programı basitçe, web sunucu tarafından çağrılan ve çalıştırılan, web sayfasıziyaretçisine yanıt olarak belirli değerler gönderen bir programdır. Sayfa sayacı, form bilgisitutucuları gibi uygulamalarda kullanılır. Eğer bir HTML sayfası üretecek bir CGI programıyazıyorsak, programınızda herhangi bir şey yazmadan önce,

print “content-type:text/html\n\n”;ifadesinin olması gereklidir. Bu ifade web tarayıcıya ne tür bir veri aldığını söylemek içinkullanılmaktadır. Tarayıcı gönderilen dataların arasında http başlığını boş satırlardayorumlayacaktır. Bu yüzden “\n\n” satırları gereklidir. İçerik çeşitleri aşağıda gösterilmiştir.

text/html HTML formatContent-type text/plain Text format

image/gif Picture file in GIF format

CGI programı yazarken C dili kullanılabilir. Aşağıdaki C dili ile yazılan bir cgiprogramı görülmektedir.

26

2.3. C Dili Kullanımı

Örnek 2.1

/*C dili ile yapılan ilk cgi programı*/#include <stdio.h>int main(){

printf("Content-type:text/html\n\n");printf("\n\n");printf("<b>CGI</b> is\n");printf("<font size=\"+4\">easy</font>");return 0;

}Şekil 2.2: C dili kullanımı

Yukarıdaki program deneme.c olarak kaydedildikten sonra aşağıdaki gibi derlenirse,cgi programı elde edilmiş olur.

gcc – o deneme.cgi deneme.c

Üretilen bu cgi dosyası Linux işletim sistemi için /home/httpd/cgi-bin klasörünekopyalanmalıdır. Daha sonra yukarıdaki şekilde görüldüğü gibi tarayıcıda görüntülenebilir.

Aşağıdaki programlarda kullanılan ”#!/usr/bin/perl” ifadesi Linux ta perlprogramının yerini ifade etmektedir. Bu ifade apache2triad kurulu bir bilgisayarda“#!/apache2triad/perl/bin/perl.exe” şeklinde olacaktır.

2.4. Perl Dili Kullanımı

Örnek 2.2

vi /var/www/cgi-bin/hello1.cgi (Dosyanın ismi ve yolu)

#!/usr/bin/perlprint "Content-type: text/html\n\n";print "Hello World!\n";exit;

Programın ilk satırı "#" ile başlar. Perl program satırı ";" ile biter.

#!/usr/bin/perl ifadesi, bilgisayarda kurulu olan Web sunucuya programınicrasının Perl ile olacağını söyler. Burada Perl programlarını çalıştıracak programının yolugösterilir. Aşağıda icra edilen komut yardımıyla Perl programının Linux işletim sistemindekiyeri öğrenilebilir.

27

which perlexit komutu ile çalışan program sona erdirilir.

Yukarıdaki program vi editörü ile aşağıdaki gibi oluşturulur.

vi /var/www/cgi-bin/hello1.cgi

"hello1.cgi" programı yukarıda gösterildiği gibi çalıştırma yetkisi olmadanyapılmıştır. Bu yüzden, öncelikle aşağıda gösterildiği gibi programa çalıştırmayetkisi verilir.

chmod 755 hello1.cgi

Programı çalıştırmaÖncelikle, hello1.cgi dosyası (/var/www/cgi-bin/) dizinine taşınır ve aşağıda

gösterildiği şekilde çalıştırılır.. /hello1.cgiProgramın sonucu aşağıda gösterilmiştir.

Content-type: text/htmlHello World!

Programı tarayıcı üzerinde çalıştırmak için

Eğer sisteminizde bir DNS sunucu varsa, programa domain name yazarak, tarayıcıüzerinden erişilebilir(http://www.yourname.com/cgi-bin/hello1.cgi). Eğer DNS sunucukurulu değilse, http://www.localhost/cgi-bin/hello1.cgi yazarak erişilebilir. Burada localhost127.0.0.1 adresine sahip web sunucuyu ifade eder. Programın sonucu aşağıda gösterilmiştir.

Şekil 2.3: Perl dili kullanımı

28

2.4.1. Perl’de Değişkenlerin Kullanımı

Örnek 2.3:

vi /var/www/cgi-bin/islem.cgi (Dosyanın ismi ve yolu)

#!/usr/bin/perlprint "Content-type: text/html\n\n";$a=5;$b=$a+18; # $b nin değeri 23$c=9*5; # $c nin değeri 45.$a=$a-4; # $a nın değeri 1.print $a;print $b;print "$c<br/>";

Eğer değişkenler sırayla yazdırılacak olursa 12345 değeri görüntülenir.

2.4.2. HTML Etiketlerinin CGI Programında Kullanımı

Örnek 2.3:

Print fonksiyonu kullanarak “ ” karakterleri arasında html etiketlerini kullanabiliriz.

vi /var/www/cgi-bin/selam.cgi

#!/usr/bin/perlprint "Content-type: text/html\n\n";print "<html><head><title>Selam…</title></head>\n";print "<body>\n";print "<h2>Selamlar</h2>\n";print "</body></html>\n";

Tarayıcıda başlık çubuğunda Selam… Sayfanın içerisinde ise “selamlar” ifadelerigösterilecektir.

29

2.4.3. Özel Karakterlerin Yazdırılması

Örnek 2.4:vi /var/www/cgi-bin /ozel.cgi

#!/usr/bin/perlprint "Content-type: text/html\n\n";#Özel karakterlerin yazdırılması$string = "Ahmet yeni gömleği için Mehmet\'e 15 YTL ödedi.";$email = "adresim\@adres.com";#string ifadelerin yazdırılmasıprint "$string<br />";print "$email<br />";print '$string ve $email<br/>';

2.4.2. For Döngüsünün Kullanımı

Örnek 2.5

#!/usr/bin/perlprint "Content-type: text/html\n\n";for($i=1; $i<=10; $i++){

print "$i";print "<br/>";}

Bu program alt alta 1’den 10’a kadar olan sayıları yazdırır.

2.4.3. Dizi Yapısının Oluşturulması

Örnek 2.6#!/usr/bin/perlprint "Content-type: text/html\n\n";@isim=("Melih","Kerem","Ahmet","Banu","Yunus");print " \@isim dizisinin elemanları @isim<br/>";print "İlk eleman $isim[0] <br/>";print "Üçüncü eleman $isim[2] <br/>";print 'Dizide ', scalar(@isim) , " kişi bulunmaktadır.<br/>";

Ahmet yeni gömleği için Mehmet'e 15 YTL ö[email protected]$string ve $email

30

2.4.4. Foreeach Döngüsünün Kullanımı

Örnek 2.7

vi /var/www/cgi-bin /dongu.cgi

#!/usr/bin/perlprint "Content-type: text/html\n\n";@aylar=("Ocak","Şubat","Mart","Nisan","Mayıs","Haziran","Temmuz","Ağustos");

foreach $i (@aylar) {print "$i<br/>";

}

2.4.5. Form Etiketinin Kullanımı

Örnek 2.8

CGI programının URL’si HTML’in FORM etiketinde tanımlandı. CGI programı,sayfada yapılan butona basıldığında çalışır.

vi programı kullanarak aşağıda gösterilen dizinde bir web sayfası oluşturunuz.

vi /var/www/html/hello1.html

<html><head>

<title>Ornek 2.3 </title>

@isim dizisinin elemanları Melih Kerem Ahmet Banu Yunusİlk eleman MelihÜçüncü eleman AhmetDizide 5 kişi bulunmaktadır.

OcakŞubatMartNisanMayısHaziranTemmuzAğustos

31

</head><body>

<form action="http://www.isminiz.com/cgi-bin/hello1.cgi"><input type="submit" value="Starting CGI"></form>

</body></html>

Programın çalıştırılması

Şekil 2.4: Form üzerinden CGI programının çağrılması

Bu örnekte, “Starting CGI” butonu tıklandığında, hello1.cgi programı çalışacak vetarayıcıda Hello World ifadesi gösterilecektir. Burada formdan submit edilen (gönderilen)değer, form etiketinin, action parametresi ile değerlendirilecek ve ilgili url’de yer alanprogram çalıştırılacaktır.

2.4.6. HTML’deki A Etiketinin kullanımı

Örnek 2.9CGI programının URL’si HTML’in A etiketinde tanımlanır. CGI programı, sayfadaki

linke tıklandığı zaman çalışır.

32

Programın yapılması


<html><head> <title>Ornek 2.5</title></head><body>

<A HREF="http://www.isminiz.com/cgi-bin/hello1.cgi">Starting CGI</A></body></html>


Şekil 2.5: Link üzerinden CGI programının çağrılması

2.4.7. HTML’deki FRAME Etiketinin Kullanımı

Örnek 2.10

CGI programının URL’si HTML’nin FRAME etiketinde tanımlanır. CGI programı,HTML dosyası görüntülendiğinde cgi programı çalışacaktır.

33



<html><head><title>ornek 2.10 </title></head><frameset cols="50%,50%">

<frame src="http://www.isminiz.com/cgi-bin/hello1.cgi"><frame src="http://www.isminiz.com/cgi-bin/hello1.cgi">

</frameset></html>

Şekil 2.6: Çerçeve ile CGI programının kullanılması

Web sayfasının her bir frame’i kaynak olarak hello1.cgi programını kullanmaktadır.Bunun için gerekli yol tanımı src parametresinde gerilmiştir.

2.4.8.Sprintf Fonksiyonu

Örnek 2.11:

vi /var/www/cgi-bin /hello.cgi

#!/usr/bin/perlprint "Content-type: text/html\n\n";$n=12;$s="Hello";print sprintf("%d%07d%s",$n,$n,$s);print "\n";exit;

Perl’de değişkenler $ karakteri ile tanımlanırlar. Print komutu ile kullanılan sprintffonksiyonu formatlı yazım için kullanılır.

120000012Hello

34

%d : Desimal sayıların gösteriminde kullanılır. %04d : 0 sayısal değerin başına eklenir ve desimal sayı 4 dijit olarak gösterilir. %s : string karakter gösterilir.

2.4.9.Time Fonksiyonu

1 Ocak 1900’dan itibaren geçen zamanı sayısal olarak ifade eder.

Örnek 2.12:

vi /var/www/cgi-bin /time1.cgi

#!/usr/bin/perlprint "Content-type: text/html\n\n";print time;print "\n";exit;

2.4.10. Localtime Fonksiyonu

Time fonksiyonu ile elde edilen zamanı değerini şimdiki zamana çevirir.

Örnek 2.13:


#!/usr/bin/perlprint "Content-type: text/html\n\n";$tarih = localtime;print "Tarih: $tarih<hr><center>";exit;

Şekil 2.7: Time fonksiyonu

Şekil 2.8: Localtime fonksiyonu

35

Örnek 2.14:


#!/usr/bin/perlprint "Content-type: text/html\n\n";($sec,$min,$hour,$day,$mon,$year,$wday)=localtime(time);$yyyymmdd=sprintf("%04dY %02dM %02dD",$year+1900,$mon+1,$day);$we=sprintf("%s",("SUN","MON","TUE","WED","THU","FRI","SAT")[$wday]);$hhmmss=sprintf("%02dH %02dM %02dS",$hour,$min,$sec);print $yyyymmdd.$we.$hhmmss;print "\n";exit;

Şekil 2.9: Localtime ve time fonksiyonu

Örnek 2.15:

vi /var/www/cgi-bin /time4.cgi#!/usr/bin/perlprint "Content-type: text/html\n\n";($sec,$min,$hour,$day,$mon,$year,$wday)=localtime(time);print "sec :".$sec."\n";print "min :".$min."\n";print "hour :".$hour."\n";print "day :".$day."\n";print "mon :".$mon."\n";print "year :".$year."\n";print "wday :".$wday."\n";exit;

saniye :53 dakika :0 saat :11 gün :18 ay :11 yıl :106 hgün :1

36

2.4.11. Ana Programdan Alt program Çağırma

Örnek 2.12:

Ana programın Yapılmasıvi /var/www/cgi-bin/main.cgi#!/usr/bin/perlrequire "./sub_gettime.cgi";print &gettime();print "\n";exit;

Alt programın yapılmasıvi /var/www/cgi-bin/sub_gettime.cgi

#!/usr/bin/perlprint "Content-type: text/html\n\n";sub gettime{my ($yyyymmdd,$we,$hhmmss);($sec,$min,$hour,$day,$mon,$year,$wday)=localtime(time);$yyyymmdd=sprintf(" Y %02d M %02d D ",$year+1900,$mon+1,$day);$we=sprintf("%s",("SUN","MON","TUE","WED","THU","FRI","SAT")[$wday]);$hhmmss=sprintf(" %02d H %02d M %02d S",$hour,$min,$sec);return $yyyymmdd,$we,$hhmmss;}1

Alt program birden fazla program tarafından kullanılabileceği için çalışmalarımızdakolaylık sağlar.

Bu alt programdır. Başka programlar tarafından çağrılması mümkündür.

Şekil 2.10: Alt programın çağrılması

Y 2006 M 12 D MON 11 H 04 M 09 S

program 1 program 2

Programınişletilmesi

1

37

my($yyyymmdd,$we,$hhmmss);

“my” ifadesiyle bildirilen değişken sadece alt programda etkilidir.return $yyyymmdd,$we,$hhmmss; ifadesiyle değer ana fonksiyona geri döndürülür.

1 değeri ile alt programın sonu gösterilir.

require "./sub_gettime.cgi"; Alt programın çalıştırılacağı belirtilir.

print &gettime(); gettime alt programı çağırılır. Değer alt programdançıkış olarak döner.

2.2.12. Dosyalarla Çalışma

Örnek 2.16:

Bu bölümde bir metin dosyasından değer okuma ve yazmanın metodu anlatılmıştır.Okunan ve yazılan dosya birçok CGI program tarafından kullanılır.

Data dosyası oluşturma

vi /var/www/cgi-bin/sample_data.txt

Yukarıda gösterilen yerde bir dosya açarak aşağıdaki satırları giriniz.

111122223333

38

Programın yapılmasıProgram aşağıda gösterildiği gibi işlenir.

Program dosyada bulunan ilk satırı okur.vi /var/www/cgi-bin/read1.cgi

#!/usr/bin/perl$in_file="./sample_data.txt";open(IN_FILE,"$in_file");$record=<IN_FILE>;print $record;close(IN_FILE);exit;

İlk satırda veri dosyası $in_file değişkeni ile ilişkilendirilir. Daha sonra openfonksiyonu kullanılarak ilişkilendirilen bu dosya işlemek için açılır.

Dosyanın Açılması:open(file handle,file name);

open(IN_FILE,"$in_file");

Perl programı çalıştırılır.

Data dosyası açılır.Datadosyası

Data dosyasının içeriği okunur.

Data dosyasının içeriği çıktı olur.

Data dosyası kapatılır.

39

Değişkene aktarım:

Variable identifier=<file handle>

$record=<IN_FILE>;

Dosyadan okunan ilk satırdaki değer değişkene aktarılır. Burada, "1111" ifadesi$record değişkenine depolanır.

close(IN_FILE); Data dosyası kapatılır.

Programın çalıştırılmasıchmod 755 sample_data.txtchmod 755 read1.cgi./read1.cgi

Open fonksiyonu çalıştırıldığı zaman, aşağıdaki değerler geri döndürülür.

Dosya açıldığı zaman :TrueDosya açılmadığı zaman :False

Böylece, program eklenen open fonksiyonundan değerin döndüğüne karar verir.

2.4.13. Dosya Açılamadığı Zaman Hata Mesajının Görüntülenmesi


vi /var/www/cgi-bin/read2.cgi

#!/usr/bin/perl$in_file="./sample_data.txt";if(!open(IN_FILE,"$in_file")){

print "To fail for open file\n";exit;

}$record=<IN_FILE>;print $record;close(IN_FILE);exit;

40

Program, bitirilen deneme dosyasını okur. Eğer dosya açılamazsa aşağıdaki işlembasamakları eklenir. Dosya açılamadığı zaman "To fail for open file" mesajı görüntülenir veprogram bitirilir.

if(!open(IN_FILE,"$in_file")){print "To fail for open file\n";exit;

}

"0" değeri dosya açılamadığı zaman geri döndürülür. Çünkü, sonucun olumlu olması“!” ifadesiyle değer tersine işlenerek bulunur. Bu yüzden "if" ile başlayan cümle icra edilir.

Programın çalıştırılmasıchmod 755 read2.cgi./read2.cgi

Sonra, "To fail for open file" mesajı görüntülenir. Dosya ismini aşağıdaki gibideğiştiriniz. Programı çalıştırınız.

$in_file="./sample_data.tx";

2.4.14. Dosyada Yer Alan Tüm Kayıtların Görüntülenmesi


vi /var/www/cgi-bin/read3.cgi

#!/usr/bin/perl$in_file="./sample_data.txt";if(!open(IN_FILE,"$in_file")){

print "To fail for open file\n";exit;

}@record=<IN_FILE>;print @record;close(IN_FILE);exit;

41

@record=<IN_FILE>;print @record;

"@ variable identifier" ifadesi belirtildiği zaman, tanımlanan değişkenler düzenlenir.Bu yüzden, dosyadaki tüm kayıtları sırayla okuyabilmek için "@record" ifadesi kullanılır.


chmod 755 read3.cgi./read3.cgi

$record=<IN_FILE>;

print $record; 1111

Değişkeni okur. Çıktı sonuçları

Çıktı sonuçları

Sırayla kayıtlar okunur.

1111

@record=<IN_FILE>; 2222

print @record; 3333

Şekil 2.11: Dosyadan Kayıtların Okunması

111122223333

sample_data.txt

42

2.4.15. Okuma Dosyası İçin Program ve Kayıt

Bu uygulamada, program dosyayı okur ve yapılan diğer bir data dosyasına yazar.

Programın yapılmasıProgram aşağıdaki işlem basamaklarından oluşur.

Örnek 2.17

Hazırlık

Dosya hedefe kopyalanarak hazırlanır. Bununla birlikte, aşağıda görüldüğü gibi boşbir dosya daha oluşturulur.

vi /var/www/cgi-bin/out_data.txtchmod 755 out_data.txt

Programın yapılması:vi /var/www/cgi-bin/read4.cgi

#!/usr/bin/perl$in_file="./sample_data.txt";$out_file="./out_data.txt";if(!open(IN_FILE,"$in_file")){

Perl program icra edilir.

Data dosyası açılır.datadosyası

Data dosyasının içeriği okunur.

Okunan data dosyasınıniçeriği diğer data dosyasınagönderilir.

Data dosyası kapatılır.

Yenidosya

43

print "To fail for open IN file\n";exit;

}if(!open(OUT_FILE,">$out_file")){print "To fail for open OUT file\n";exit;

}@record=<IN_FILE>;print OUT_FILE @record;close(IN_FILE);close(OUT_FILE);exit;

if(!open(OUT_FILE,">$out_file")){print "To fail for open OUT file\n";exit;

}

Burada, dosya hedefe kopyalandığında açılır. ">" ifadesi çağırılan bir işlem modudur.Aşağıda bir çok işlem modu gösterilmiştir. Açılan dosya sadece çıktı içindir. ">" ifadesiişlem modu olarak kullanılır.

Dosyanın kullanımı İşlem mode Örnek kullanımlar

Sadece giriş için Boşluk belirtilir. open (file handle,”$filename”)

Sadece çıkış için < open (file handle,”<$filename”)

Giriş ve çıkış için +< open (file handle,”+<$filename”)

Sadece çıkış için (replacemode)

> open (file handle,”>$filename”)

Giriş ve çıkış için (replacemode)

+> open (file handle,”+>$filename”)

Sadece çıkış için (additionmode)

>> open (file handle,”>>$filename”)

Şekil 2.12: Dosya açılış modları

print File handle Output character string;

print OUT_FILE @record;

Tüm data sırayla çıkış olarak hedefe kopyalanan dosyada set edilir.

44

Programın çalıştırılmasıchmod 755 read4.cgi./read4.cgi

Dosyanın içeriğini kontrol ediniz.cat out_data.txt

İşlem modunu değiştirinizİşlem modunu “+>” ve “>>” gibi değiştiriniz ve sonuçları kontrol ediniz.

if(!open(OUT_FILE,">$out_file")){print "To fail for open OUT file\n";exit;

}

2.4.16. Erişim Sayıcı Program Yapma

Örnek 2.18 Programın yapılmasıCGI program için hazırlık: Bir sayıcı dosyası yapınız. Bu dosya sadece bir datadır.vi /var/www/cgi-bin/count.logDosyanın içine aşağıdaki değer girilir.

Dosyanın izinlerini aşağıdaki gibi değiştirilir.chmod 666 count.log çalıştırma yetkisi gerekli değildir.vi /var/www/cgi-bin/count01.cgi

#!/usr/bin/perl$filename="./count.log";open(FILE,"+<$filename");flock(FILE,2);chop($count=<FILE>);$count++;seek(FILE,0,0);print FILE "$count\n";close(FILE);flock(FILE,8);print "Content-type:text/html\n\n";print "<HTML>";printf("%04d",$count);print "</HTML>";exit;

0

45

open(FILE,"+<$filename");

Okunabilen ve yazılabilen modda açar. (+<)

Flock fonksiyonu:

flock(**,1) Genel kilitleme (Sadece okuma kabul edilir.)flock(**,2) Özel kilitleme (Okuma ve yazma mümkün değildir.)flock(**,8) Açma

flock(FILE,2);

Özel kilitleme

chop($count=<FILE>);

“count.log” dosyasındaki data okunur ve “count” değişkenine depolanır.

Sadece datanın bir satırı okunur çünkü $ işaretiyle belirtilmiştir. @ ifadesi belirtildiğizaman okunan datanın hepsi sırayla depolanır.

Okunan datanın sonunda bir line-feed karakteri vardır. Bu yüzden, line-feed karakteri,kullanılan ayırıcı(chop) ile silinir.

$count++;

Okunan dataya bir eklenir. Kısaca, sayıcının değeri bir artırılır.

seek(FILE,0,0);

seek (file handle,offset,source)

Source: 0 : Dosyanın başı1: Dosya işaretçisinin şimdiki pozisyonu2: Dosyanın sonu

Offset : Kaynaktan byte numarası

Dosya İşaretçisi dosyanın başına taşınmıştır.

print FILE "$count\n"

Sayıcının değerleri “count.log” dosyasına yazılır.

46

close(FILE); Dosya kapatılır.

flock(FILE,8); Dosyanın kilitlendiği yayımlanır.

print "Content-type:text/html\n\n";

Data, html data da tanımlandığı gibi tarayıcıya geri döndürülür.

print "<HTML>";printf("%04d",$count);print "</HTML>";

Tarayıcı üzerinde gösterilen sayıcıya ait değerdir. “printf” ifadesinin formatı C dilindeolduğu gibi aynıdır.

Programın çalıştırılması.

chmod 755 count01.cgi./count01.cgi

Çıktının aşağıda gösterildiği gibi olduğu kontrol edilir.

0001

Program tekrar çalıştırılarak sayıcı değerinin aşağıda gösterildiği gibi artıp artmadığıkontrol edilir.

0002

Counter dosyasının içeriği kontrol edilir.cat count.log

Tarayıcı üzerinde icra sonuçları kontrol edilir.

http://www.isminiz.com/cgi-bin/count01.cgi

47

Şekil 2.13: Sayfa sayacı

Şekil 2.14: Sayfa sayacının artırılması

Reload butonuna basınız ve sayıcı değerinin artıp artmadığını kontrol ediniz

Diğer bilgisayarlardan sayıcı değerinin artıp artmadığını kontrol ediniz.

Şekil 2.15: Sayfa sayacına başka bilgisayardan erişme

48


Aşağıdaki sorulara ilişkin uygulama faaliyetini yapınız.

1’den 100’e kadar olan sayıların toplamını görüntüleyen cgi programını C dilikomutlarını kullanarak yazınız.

HTML etiketlerini kullanarak, adınızı ve soyadınızı; tarayıcıda arka plan rengimavi, karakterlerin rengi kırmızı olacak şekilde görüntülenmesini sağlayacakcgi programını yazınız.

Perl dili komutlarını kullanarak, daha önce oluşturmuş olduğunuz bir metindosyasının içeriğini okuyarak, tarayıcınızda görüntüleyiniz.

İşlem Basamakları Öneriler Yazmış olduğunuz C programının

kaynak kodunu, uzantısı cgi olacakşekilde derleyiniz. Ve cgi dosyasınıilgili klasörün içine kopyalayınız.

Html etiketlerini, print komutuylabirlikte “” işaretleri arasında kullanarakcgi programını oluşturunuz.

Perl dili ile C dili temel olarakbirbirlerine benzemektedir. C dilikomut yapısını gözden geçiriniz.

Tarayıcı kullanarak oluşturduğunuzsayfaları görüntüleyiniz.

Yazmış olduğunuz HTML etiketlerinikullanırken kullanacağınız “ işareti bazımetin editörlerinde farklıyorumlanmaktadır. Bu yüzden, kodları biryerden başka bir yere kopyalıyorsanız,kodunuza doğru karakterlerinyerleştirildiğinden emin olun.

İç içe geçen etiketler kullanırken,etiketlerin uygun sıradayerleştirildiğinden emin olun.


49


Aşağıdaki soruları cevaplayarak bu faaliyette kazandığınız bilgileri ölçünüz.

OBJEKTİF TEST (ÖLÇME SORULARI)

1. Perl ve CGI birer programlama dilidir. ( D / Y )

2. Perl derleyicisi Linux işletim sisteminde yer almaktadır. ( D / Y )

3. CGI programları, tarayıcı tabanlı çalışır. ( D / Y )

4. Perl dilinde kullanılan chop fonksiyonun görevi nedir?A) Bir stringin son karakterini siler.B) Bir string ifadedeki karakter sayısını bulur.C) String bir ifadeyi sayısal hale dönüştürür.D) İki string ifadeyi birleştirir.

5. Perl dilinde komut satırları birbirinden hangi karakterle ayrılır?A) : B) , C) ; D) /

6.Aşağıdakilerden hangisi perl dilinde geçerli bir değişken ismidir?A) $$a B) a C) $a D) A

7. Ana programdan, bir alt program çağırmak istendiğinde kullanılan komut aşağıdakilerdenhangisidir?

A) load B) include C) require D) get

8. Aşağıdakilerden hangisi doğru bir dizi tanımlamasıdır?A) #dizi B) $dizi C) %dizi D) @dizi

9. Aşağıdakilerden hangisi perl dilinde formatlı yazım için kullanılır?A) print B) sprintf C) printf D) sprint

10. Perl dilinde özel karakterlerin görüntülenmesi için kullanılan karakter hangisidir?A) ‘ B) # C) | D) \

DEĞERLENDİRME

Cevaplarınızı cevap anahtarı ile karşılaştırınız. Doğru cevap sayınızı belirleyerekkendinizi değerlendiriniz. Yanlış cevap verdiğiniz ya da cevap verirken tereddüt yaşadığınızsorularla ilgili konuları faaliyete geri dönerek tekrar inceleyiniz.


50

MODÜL DEĞERLENDİRME

UYGULAMALI TEST (YETERLİK ÖLÇME)

Modülde yaptığınız uygulamaları tekrar yapınız. Yaptığınız bu uygulamaları aşağıdakitabloya göre değerlendiriniz.

AÇIKLAMA: Aşağıda listelenen ölçütleri uyguladıysanız Evet sütununa,uygulamadıysanız Hayır sütununa X işareti yazınız.

DEĞERLENDİRME ÖLÇÜTLERİ Evet HayırLinuxta vi editörü ya da gedit programını kullanarak html dosyasıoluşturabildiniz mi?Html komutlarını kullanarak, satırlarda farklı sayıda hücrelerinbulunduğu tabloyu oluşturabildiniz mi?Web sayfanıza resim ekleyebildiniz mi?Eklediğiniz resme link verip bir üst klasörde bulunan başka birsayfanın açılmasını sağlayabildiniz mi?Genişlik ve yükseklik değerlerinin girildiği bir tablonun istediğinizhücrelerine resim ekleyebildiniz mi?Sunucu tabanlı bir program yazmak için C dilini kullanabildiniz mi?CGI programı yazarken HTML etiketlerini kullanabildiniz mi?Yazdığınız CGI programını web sunucunuzda deneyebildiniz mi?Perl dili kullanarak sabit diskinizde var olan bir metin dosyasınıokuyabildiniz mi?

DEĞERLENDİRME

Hayır cevaplarınız var ise ilgili uygulama faaliyetini tekrar ediniz. Cevaplarınızıntümü evet ise bir sonraki modüle geçebilirsiniz.

MODÜL DEĞERLENDİRME

51

CEVAP ANAHTARLARI

ÖĞRENME FAALİYETİ-1 CEVAP ANAHTARI

1 B2 D3 C4 B5 A6 C7 D8 C9 D

10 B

ÖĞRENME FAALİYETİ-2 CEVAP ANAHTARI

1 YANLIŞ2 DOĞRU3 YANLIŞ4 A5 C6 C7 C8 D9 B

10 D

CEVAP ANAHTARLARI

52

KAYNAKÇA

MASUDA Yoichi, İbrahim APA, Bilgisayar Ağları, M.E.B – JICA, Ağustos,

2005.

www.w3schools.com

KAYNAKÇA

sunucu servisleri 3 - || megepmegep.meb.gov.tr/mte_program_modul/moduller_pdf/sunucu...yeni bir...

Documents