aofsoru.com

Web Tabanlı Kodlama Dersi 7. Ünite Sorularla Öğrenelim

Önemli Web Çatıları Ve Kullanımı

1. Soru

Web çatısı nedir?

Cevap

Web çatısı (web framework) ya da web uygulaması çatıları (web application framework) internet ortamında çalışan siteler, servisler, kaynaklar ve arayüzler üretmek için tasarlanmış yazılımlardır.


2. Soru

CGI nedir?

Cevap

Bu sistemde, sunucu bilgisayarda çalışan programlar kullanıcıdan gelen veriyi işleyerek statik sonuç sayfaları üretebilmekteydi. Bu yaklaşımın en büyük problemi her bir istek için sunucu bilgisayarda ayrı bir süreç (process) çalıştırılmasıydı. Basit işlemler için oluşturulmuş olsalar bile, tüm süreçlerin toplam iş yükü sunucularda önemli bir darboğaz oluşturabiliyordu.


3. Soru

Web çatılarının kullanım alanlar nelerdir?

Cevap

Web çatılarının kullanım alanları bir dilin yeteneklerini geliştirmekten, uygulama yazılımları ile programlama üretmeye kadar değişkenlik gösterebilmektedir.


4. Soru

MVC nedir?

Cevap

MVC (model-view-controller) bir yazılım geliştirme desenidir. Bu desen veri soyutlanması esasına dayanır. Buna göre, kontrolcü (controller) adı verilen bir ara sistem, veri (model) ve arayüzler (view) arasında köprülük görevi görmektedir. Sistemin avantajı, yazılan kodların tekrar tekrar kullanılabilmesi ve çeşitli uygulamalar için arayüzler (views) sağlayabilmesidir.


5. Soru

Web çatılarının yararları nelerdir?

Cevap

Bir web çatısı kullanmanın en önemli avantajı, kodların tekrar kullanılabilir olmasıdır. Web çatıları deneyimli geliştiriciler ve geliştirici takımları tarafından tekrar kullanılabilirlik ilkesi ile üretilir. Web çatısı kullanmanın bir diğer yararı ise ücretsiz yardım kanallarını kullanıma sunmasıdır.


6. Soru

“Front-end” ve “back-end” ne anlama gelmektedir?

Cevap

Programlama literatüründe kullanıcının gördüğü arayüzlere ön yüz (front-end) denmektedir. Bunun yanında, uygulamaların arkasında çalışan veri tabanı erişimi, hesaplama rutinleri gibi işlevlere ise arka yüz (back-end) adı verilmektedir. Büyük ölçekli uygulamaların ön yüz ve arka yüz geliştirici takımları işbirliği içinde çalışmaktadır.


7. Soru

Tepkisel tasarım (responsive design) nedir?

Cevap

Tepkisel tasarım (responsive design), sitelerin ve uygulamaların çeşitli ekran ve tarayıcı genişliklerine göre kendilerini yeniden düzenleyebildiği bir tasarım yaklaşımıdır. Bu yaklaşımın amacı, sitenin tasarım ve ölçeklendirmesini değiştirerek, okunurluğu desteklemek ve kullanıcı etkileşimini iyileştirmektir. Yaklaşımın temelinde CSS 3 tanımlamaları ile birlikte gelen medya sorguları (media querries) yer almaktadır.


8. Soru

Bir Bootstrap projesinin anatomisi nasıldır?

Cevap

HTML dokümanı, CSS dokümanı, Javascript dokümanları ve Simgelerden oluşur.


9. Soru

Bootstrap projeleri için gerekli dokümanlar projeye kaç yöntem ile eklenebilir?

Cevap

Bootstrap projeleri için gerekli dokümanlar projeye iki yöntemle eklenebilir. Bu yöntemlerin kendilerine özgü avantaj ve dezavantajları bulunmaktadır. Kullanılabilecek ilk yöntem, içerik dağıtım ağları (Content Delivery Network) üzerinden sunulan uzak dosyaları projeye eklemektir. İkinci yöntemde ise, gerekli dosyalar sunuculardan indirilerek yerel dosyalar hâlinde projeye eklenir. Aşağıda bu yöntemlerin avantajları, sınırlılıkları ve gerçekleştirilme yolları sunulmuştur.


10. Soru

Uzak yöntem ile oluşturulan bir Bootstrap projesinde dosya bağlatısı nereye yazılmalıdır?

Cevap

Uzak yöntemle oluşturulacak bir Bootstrap projesinin giriş sayfası Resim 7.2’de görüldüğü şekilde kodlanmalıdır. İlk satırdaki doctype etiketi ile bu dokümanın bir HTML 5 dokümanı olduğu tarayıcıya bildirilmektedir. İkinci satırda dokümanın içeriğinin Türkçe dilinde olduğu belirtilmektedir. Üçüncü satırda başlayan HEAD bloğu 11. satıra kadar devam etmektedir. HEAD bloğundaki ilk üç meta etiketinin öncelikli yazılması zorunludur.


11. Soru

Uzak yöntem ile oluşturulacak bir Bootstrap projesinde dosya bağlantısındaki min (bootstrap.min.css) ne ifade etmektedir?

Cevap

Bu dosyaların isimlerindeki min ifadesi dosyaların küçültülmüş (minified) sürümlerini ifade etmektedir. Bu sürümlerde dosya boyutuna katkı getirebilecek boşluk ve paragraf sonu karakterlerinin hepsi kaldırılır. Bu nedenle dosya içerikleri çok uzun bir satır olarak gösterilir. Bu dosyalar daha küçük boyutlu olsa da, içeriklerinin okunması ve düzenlenmesi daha zordur. Dosyaları incelemek ve düzenlemek isteyen programcılar isminde “min” ifadesi bulunmayan dosyaları tercih etmelidir.


12. Soru

Tipografi (typography) nedir?

Cevap

Tipografi (typography) yazılı materyallerin okunaklı, kavranabilir ve çekici hazırlanması ile ilgilenen bir sanat dalıdır. Tipografinin araçları arasında, yazı tipi (font), yazı yüksekliği, satır yüksekliği, satırlar arası boşluklar, metin elementleri arasındaki boşluklar gibi özellikler yer almaktadır.


13. Soru

Bootstrap projesinde temel işaretleme etiketleri nelerdir?

Cevap

Mark - Metnin arkasını boyayarak vurgular. <mark>metin</mark>

S - Metnin üstünü çizer. <s >metin</ s>

del - Silinmiş metni vurgulamak için üstünü çizer. < del>metin</del >

ins -  Eklenmiş metni vurgulamak için altını çizer. <ins >metin</ins >

u - Metni vurgulamak için altını çizer. < u>metin</ u>

small  - Metni bulunduğu ortamda %85 oranında küçültür. <small >metin</small >

strong - Metni vurgulamak için kalın yazar. <strong >metin</ strong>

em - Metni vurgulamak için yatık yazar. < em>metin</em >


14. Soru

Bootstrap projesinde listeler nelerdir?

Cevap

Bootstrap, HTML dilinde tanımlı üç liste türüne destek vermektedir: sırasız listeler (<ul>), sıralı listeler (<ol>) ve tanımlama listeleri (<dl>).


15. Soru

Bootstrap projesinde Table etiketinde kullanılabilecek sınıflar nelerdir?

Cevap

table-striped - Tablo satırlarını bir koyu, bir açık olacak şekilde boyar.

table-bordered - Tablonun dış kenarlıklarını ve hücreler arasındaki dikey kenarlıkları ekler.

table-hover - Fare üzerine geldiğinde tablo satırlarını vurgular.

table-condensed - Hücreler arası boşlukları azaltarak daha yoğun bir tablo oluşturur.


16. Soru

Bootstrap projesinde tablolarda kullanılabilecek kavramsal sınıflar nelerdir?

Cevap

active - İçeriği vurgulamak için kullanılır.

success - Olumlu ya da başarılı bir içeriği belirtir.

info - Düşük vurgulu, bilgilendirici içerikleri belirtir.

warning - Okuyucu dikkatini gerektiren içerikleri belirtir.

danger - Olumsuz ya da tehlikeli içerikleri beliritr.


17. Soru

Bootstrap sistemindeki kırılma noktaları ve genişlik belirteçleri nelerdir?

Cevap

Xs - x < 768px

Sm - 768px ? x ? 991px

Md - 992px ? x ? 1199px

Lg - x ? 1200px


18. Soru

Container nedir?

Cevap

Container sınıfı sayfa içeriğini ve kurulacak ızgara sistemini kapsamak için üretilmiştir. Sayfa içerikleri ve ızgara sistemi container özellikli bir element içine yerleştirilmelidir. Akışkan ve sabit genişlikli olmak üzere iki container sınıfı bulunmaktadır. Akışkan container sınıfı (container-fluid) her zaman tarayıcı genişliğinin tümünü kapsayacak şekilde boyutlandırılır.


19. Soru

HTML’de kaç farklı şekilde elementler düğme olarak kullanılır?

Cevap

Üç farklı HTML elementi düğme olarak kullanılabilir: <a>, <button> ve <input>. Aşağıda bu elementlerin düğme görünümü kazanması için gerekli işaretlemeler ve etkiler gösterilmiştir.


20. Soru

Bootstrap sisteminde giriş elementleri nelerdir?

Cevap

Bootstrap sisteminde input, textarea ve select elementleri formlarda kullanılmak üzere desteklenmektedir. Elementler için açıklama metinleri label etiketleri içinde verilmelidir. Label etiketleri ile input elementleri bağlantısı id-for eşleşmesi ile sağlanır. input elementine verilen id değeri, label elementinin for özelliğine yazılarak eşleşme sağlanır. Bu kullanım sayesinde açıklama metnine tıklandığında ilgili element aktif hâle geçebilmektedir. Özellikle işaret kutusu (checkbox) ve radyo düğmeleri gibi küçük elementler için bu kullanım oldukça kullanıcı dostudur. Her label-input çifti form-group sınıflı div elementleri içine alınmalıdır. Bu yolla form elementlerinin düzgün yerleşimi sağlanır. input elementlerinin Bootstrap görüntü ve etkileşim özelliklerini kazanması için form-control sınıfı eklenir. Bu sınıf eklendiğinde element bulunduğu ortamdaki genişliğin tamamını kaplayacaktır.


Yukarı Git

Sosyal Medya'da Paylaş

Facebook Twitter Google Pinterest Whatsapp Email