XML DERS 1

XML İLE İLGİLİ BASİT BİRKAÇ ÖRNEK

Merhaba,

Siteme XML bölümü eklediğim için sakın benim XML bildiğimi sanmayın. Ben XML bilmiyorum ama sizinle birlikte burada XML öğrenmek için çalışmalar yapacağız.

XML’in önemli birşey olduğunu, web uygulamalarına yeni kabiliyetler, esneklik kazandırdığını nette okuduğum yazılarda sürekli görüyordum ama bir türlü nasıl birşey olduğunu, nasıl kullanıldığını doğru dürüst anlayamamıştım. Sonunda bir XML kitabı almaya karar verdim ve Microsoft Press tarafından basılan Michael J.Young’ın yazdığı Step by Step XML isimli kitabı aldım.

Kitaba söyle bir göz atarken bir de ne göreyim

, kitabın yazarı “Ben XML kodlarıyla birşeyler yapana kadar XML’in ne olduğunu tam anlayamamıştım” demiyor mu. Anladım ki sorun ben de değilmiş ve çok rahatladım.

KISA BİR AÇIKLAMA

XML bölümüne, basit birkaç örnek yaparak başlamayı uygun gördüm. XML ile yapılmış dökümanları görebilmeniz için XML desteği olan bir tarayıcıya ihtiyacınız var. Internet Explorer 5.00 ve daha sonra çıkan versiyonlarla burada yapılan örnekleri sorunsuz görebilirsiniz.

Web uygulamalarında XML’e ihtiyaç duymamızın önemli sebepleri var. Web sayfaları hazırlarken şu ana kadar kullandığımız HTML, öncelikle sununun, görünüşün nasıl olacağına odaklanmış bir script (betik) dili. HTML taglarının büyük çoğunlu sayfalarımızın şeklen nasıl olacağını belirlemek için kullanılıyor.

HTML’de veri ve biçim iç içe geçmiş durumda. Veriyi, bu sayfanın içinden ayıklamak ve kullanmak mümkün olmamakta… İşte ben bu tip konulardan bahseden bir sürü yazı okumuş ve sonuçta da hala XML’in ne olduğunu anlamamıştım. Bu nedenle lafı daha fazla uzatmıyorum. Şimdilik bilmeniz gereken sadece şu; XML’de veri ve verinin sayfamızda nasıl gösterileceği birbirinden ayrılmıştır ve verileri, aynı bir veritabanında yer alan veri gibi etkili bir şekilde kullanabilme imkanımız vardır.

İLK ÖRNEĞİMİZ

Hemen ilk örneğimize geçelim ve bir XML dökümanı hazırlayalım. XML dökümanı hazırlamak için şimdilik, Notepad gibi bir text editörü kullanabilirsiniz. Araba galerimizde bulunan arabaların bilgilerinin yer aldığı XML dökümanımızın kodları şu şekilde olacak:

Toyota Corolla 1999 20.000 Beyaz 6.000.000.000 Klimali, temiz Volkswagen Polo 1997 60.000 Mavi 5.500.000.000 Volvo C 70 1998 25.000 Siyah 20.000.000 Full aksesuar, deri koltuk, sunroof Nissan Primera 1.6 GX 1998 48.000 Siyah 7.500.000.000 ABS, airbag, alarm, deri koltuklar

Yukarıdaki kodları Notepad veya benzer bir text editörle yazdıktan sonra, dosyayı ArabaGalerisi.xml adıyla kaydediniz.

XML DÖKÜMANIMIZI NASIL GÖRECEĞİZ?

XML dökümanlarında, HTML sayfalarında olduğu gibi veri ve biçimin bir arada bulunmadığını söylemiştik. Yukarıda gördüğünüz kodlar, verilerin yer aldığı XML dökümanına ait. Bu dökümanda yer alan verileri biçimlendirip (yani renk, font, font boyu vs. gibi şeklen nasıl olacağını belirleyip), göstermek için birkaç yol var.

XML dökümanımızı, biçimlendirilmiş şekilde göstermeden önce, bu haliyle nasıl göründüğüne bir bakalım isterseniz. XML desteği olan tarayıcınız varsa linke tıklayarak dökümanın nasıl görüneceğine bakabilirsiniz. Tag’ların başında yer alan + (artı) ve – (eksi) işaretlerine tıklayınca neler olduğunu da deneyiniz.

Şimdi sıra geldi XML dökümanımızı biçimlendirerek görüntülemeye. Bunun için Style Sheet kullanacağız. Cascading Style Sheet’leri duymuşsunuzdur. HTML dökümanlarımızı biçimlendirmek için kullandığımız biçim dosyaları. Cascading Style Sheet’leri XML dökümanlarını göstermek için kullanabileceğimiz gibi, özel olarak XML için tasarlanmış XSL (Extensible StyleSheet Language) style sheet de kullanabiliriz. Tabii bunlardan bahsetmek için henüz erken.

XML dökümanımızı, CSS kullanarak göstermek için iki şey yapacağız. Birincisi CSS dosyamızı hazırlayacağız. İkincisi de XML dökümanımıza, verileri göstermek için hazırladığımız CSS dosyasını kullanmasını söyleyeceğiz. İlk olarak Notepad veya benzeri bir text editör kullanarak CSS dosyamızı hazırlayalım. Kodlar şu şekilde olacak:

/* Dosya adi : ArabaGalerisi01.css */

ARABA
{display:block;
margin-top:12pt;
font-size:10pt}

MARKA
{font-weight:bold;
font-style:italic}

MODEL
{font-style:italic}

FIYAT
{font-weight:bold}

Yukarıda kodları yer alan CSS dosyamızı ArabaGalerisi01.css adıyla kaydedelim. Şimdi sıra geldi XML dökümanımıza verileri göstermek için bu CSS dosyasını kullanmasını söylemeye. Bunun için XML dökümanımıza şu satırı ekleyeceğiz:

Dökümanımızın son hali şu şekilde olacak:

Toyota Corolla 1999 20.000 Beyaz 6.000.000.000 Klimali, temiz Volkswagen Polo 1997 60.000 Mavi 5.500.000.000 Volvo C 70 1998 25.000 Siyah 20.000.000 Full aksesuar, deri koltuk, sunroof Nissan Primera 1.6 GX 1998 48.000 Siyah 7.500.000.000 ABS, airbag, alarm, deri koltuklar

Son olarak da, az evvel yaptığımız örnekle karışmasın diye XML dökümanımızı ArabaGalerisi01.xml adıyla kaydedeceğiz. Artık XML dökümanımızı tarayıcımız ile görebiliriz. File Manager (Dosya yöneticisi) ile ArabaGalerisi01.xml dökümanımızı bulup, ismine tıklayarak dökümanımızı açabiliriz. Dökümanın nasıl göründüğünü görmek için linke tıklayınız.

SON BİR ÖRNEK

CSS dosyamızı biraz daha değiştirerek, XML dökümanımızı farklı bir şekilde gösterelim. Bunun için text editörümüzle ArabaGalerisi02.css isimli yeni bir CSS dosyası hazırlayalım. Kodları şu şekilde olacak:

/* Dosya adi : ArabaGalerisi02.css */

ARABA
{display:block;
margin-top:12pt;
font-size:10pt}

MARKA
{display:block;
font-size:12pt;
font-weight:bold;
font-style:italic}

MODEL
{display:block;
margin-left=15pt;
font-weight:bold}

YIL
{display:block;
margin-left=15pt}

KM
{display:block;
margin-left=15pt}

RENK
{display:block;
margin-left=15pt}

FIYAT
{display:block;
font-weight:bold;
margin-left=15pt}

DIGER
{display:block;
margin-left=15pt}

Tabii XML dökümanımıza ArabaGalerisi02.css isimli style sheet’i kullanmasını söylemeyi unutmayalım. XML dökümanındaki

satırını

olarak değiştiriniz ve XML dökümanını ArabaGalerisi02.xml ismiyle kaydediniz.

İlk yorum yapan olun

Bir yanıt bırakın

E-posta hesabınız yayımlanmayacak.


*