Erkan KESER

Web Tabanlı Uygulama Geliştirme (WTUG) Dersi - Temel Kavramlar

Web tabanlı uygulama geliştirmeye başlamadan önce bazı temel kavramları anlamak çok önemlidir. Bu bölümde, web sayfası yayınlamada kullandığımız temel terimleri ve teknolojileri ele alacağız.

1.1. Web Sayfası Yayınlamada Temel Kavramlar

1.1.1. Web Sayfası

Web sayfası, bir tarayıcıda (Google Chrome, Firefox gibi) görüntüleyebileceğiniz metin, resim, video ve diğer multimedya içeriklerinden oluşan bir dökümandır. Örneğin, bir haber sitesi veya okulunuzun web sayfası birer "web sayfası" örneğidir.

1.1.2. Web Sitesi

Birden fazla web sayfasının bir araya gelerek bir bütün oluşturduğu yapıya "web sitesi" denir. Web siteleri genellikle belirli bir amaca hizmet eder.

Örnek:  E-Okul, öğrenci bilgilerini görüntülemek için kullandığımız bir web sitesidir.

1.1.3. Alan Adı (Domain)

Alan adı, bir web sitesinin internet üzerindeki adresidir. Çoğu insan IP adreslerini hatırlayamayacağı için alan adları kullanılır.

Örnek: www.google.com bir alan adıdır.

1.1.4. Alan Adı Uzantıları

Alan adı uzantıları, web sitelerinin türünü veya amacını belirtir.

Sık Kullanılan uzantılar

.com : Ticari siteler için kullanılır.

.edu : Eğitim kurumları.

.gov : Devlet kurumları.

.org : Organizasyonlar.

1.1.5. Alan Adı Alma İşlemi

Bir alan adı almak için alan adı kayıt hizmeti sunan firmaların sitelerini ziyaret edebilirsiniz. Örneğin, GoDaddy veya Namecheap gibi platformlar kullanılabilir.

1.1.6. Hosting (Web Sitesi Barındırma)

Hosting, web sitenizi internette yayınlamak için gerekli olan bir hizmettir. Hosting hizmeti, web sitenizdeki dosyaları (resimler, HTML dosyaları vb.) depolar ve internet üzerinden erişilebilir hale getirir.

Örnek: Bir öğrenci portfolyosunu internette sergilemek için hosting hizmeti kullanabilirsiniz.

1.1.7. IP Adresi

IP (Internet Protocol) adresi, internet üzerindeki cihazları tanımlamak için kullanılan bir sayısal adres sistemidir. IP adresleri sayesinde bilgisayarlar ve sunucular birbirleriyle iletişim kurabilir.

Örnek: 192.168.1.1 bir IP adresidir.

1.1.8. Tarayıcı (Browser)

Tarayıcı, web sayfalarını görüntülemek için kullanılan bir yazılımdır. Örneğin, Google Chrome, Mozilla Firefox, Microsoft Edge gibi tarayıcılar sayesinde internete erişim sağlarız. Tarayıcılar, web sayfalarını HTML, CSS ve JavaScript gibi dillerle çalıştırır.

Örnek: Google'da bir arama yapmak için tarayıcı kullanırız.

1.2. Web Yazılımcısı Rolleri

Web geliştirme süreci farklı uzmanlık alanları gerektirir. Şimdi bu rolleri inceleyelim.

1.2.1. Ön Uç (Frontend) Yazılımcı Rolü

Ön uç geliştiriciler, web sitelerinin kullanıcılar tarafından görünen kısımlarını geliştirir. Bu rollerde genellikle HTMLCSS ve JavaScript kullanılır.

Örnek: Web sayfasına bir menü oluşturmak veya buton eklemek.

1.2.2. Arka Uç (Backend) Yazılımcı Rolü

Arka uç geliştiriciler, web sitesinin arka plandaki işlevlerini kodlar. Veri tabanı işlemleri ve sunucu tarafı programlama bu role dahildir.

Örnek: Web sitesine öğrenci bilgilerini kaydetmek.

1.2.3. Full Stack Yazılımcı Rolü

Hem ön uç hem de arka uç geliştirme becerilerine sahip yazılımcılar "Full Stack" geliştirici olarak adlandırılır.

1.3. İşaretleme Dili (HTML)

HTML (HyperText Markup Language), web sayfalarını oluşturmak için kullanılan bir işaretleme dilidir. HTML, web sayfasının yapısını tanımlar.

Örnek:

<!DOCTYPE html>
<html>
<head>
   <title>Benim İlk Web Sayfam</title>
</head>
<body>
   <h1>Merhaba Dünya!</h1>
   <p>Bu benim ilk web sayfam.</p>
</body>
</html>

1.3.1. HTML Editörleri

HTML kodlamak için kullanılabilecek editörler:

Visual Studio Code: Kullanışı kolay ve popüler bir kod editörüdür.

Notepad++: Basit bir metin editörüdür.

1.4. CSS

CSS, web sayfasının görsel tasarımını düzenlemek için kullanılır. Yazı tipleri, renkler ve sayfa düzeni CSS ile kontrol edilir.

Örnek:

css

body {
    font-family: Arial, sans-serif;
    background-color: #f0f0f0;
}
h1 {
    color: blue;
}

1.5. WYSIWYG Editörleri

WYSIWYG (What You See Is What You Get) editörleri, web sayfası tasarlarken kod yazmadan görsel bir ara yüz üzerinden çalışmanıza olanak tanır.

Örnek: Adobe Dreamweaver, WordPress.

Ölçme ve Değerlendirme

1. Web sayfası ile web sitesi arasındaki fark nedir?

Cevap: Web sayfası, bir belgedir ve tek bir içeriği gösterir. Web sitesi ise birden fazla web sayfasının birleşiminden oluşan yapıdır.

2. Alan adı ve hosting ne işe yarar?

Cevap: Alan adı, bir web sitesinin internet üzerindeki adresidir. Hosting ise web sitesini internette yayınlamak için kullanılan bir hizmettir.

3. HTML ve CSS ne için kullanılır?

Cevap: HTML, web sayfalarının yapısını oluşturmak için kullanılır. CSS ise web sayfasının tasarımını ve görünümünü düzenlemek için kullanılır.

4. Frontend ve Backend geliştirici rolleri nelerdir?

Cevap: Frontend geliştiriciler, web sitesinin kullanıcıya görünen kısmını tasarlar. Backend geliştiriciler ise arka plandaki sunucu işlemlerini ve veri tabanı işlemlerini yönetir.