# Frontend nedir?

*Geliştirme · Son güncelleme: 25 Ekim 2026*

Bir web sitesinin ya da uygulamanın kullanıcılar tarafından doğrudan görülen, tıklanan ve etkileşime girilen ön yüz katmanıdır.

## Tanım

Frontend, bir yazılımın kullanıcıyla buluştuğu tüm görsel ögeleri, düğmeleri, formları ve animasyonları içeren istemci tarafıdır. Tarayıcıda veya mobil cihazda çalışan kodlar, sunucudan gelen veriyi kullanıcının rahatça anlayabileceği şık bir arayüze çevirir. Kullanıcı deneyiminin hızı, erişilebilirliği ve estetik başarısı doğrudan bu katmanın kalitesine bağlıdır.

*Bir restoranın ışıklandırması, masaları, menü kartı ve garsonların hizmet sunduğu şık yemek salonuna benzer; mutfaktaki ocak ve depo ise arka planda kalır.*

## Nasıl çalışır?

HTML sayfanın iskeletini oluşturur, CSS görsel tasarımı giydirir ve JavaScript kullanıcı tıklamalarına göre sayfayı hareketlendirir. Bu bileşenler tarayıcı tarafından yorumlanarak ekrana çizilir. Kullanıcı bir işlem yaptığında frontend bu isteği arka plana iletir ve gelen yanıtı anında arayüzde günceller.

## Nerede kullanılır?

Ziyaret ettiğiniz her web sayfasında, telefonunuza yüklediğiniz mobil uygulamalarda ve akıllı cihazların dokunmatik ekran menülerinde yer alır.

## Sık karıştırılanlar

Backend kavramı ile zıttır. Frontend ekranda gördüğünüz her şeyle ilgilenirken backend veritabanı, sunucu hesaplamaları ve arka plan güvenliğini yönetir.

## Sorular ve yanıtlar

**Frontend geliştirmek için hangi dilleri bilmek gerekir?**

Web dünyasında temel standart HTML, CSS ve JavaScript üçlüsüdür. Günümüzde bu yapı React, Vue gibi modern kütüphanelerle birlikte kullanılır.

**Frontend tasarımı ile UI/UX tasarımı aynı şey midir?**

Hayır. UI/UX tasarımı görsel planlama ve kullanıcı araştırması iken frontend bu tasarımların çalışan birer yazılım koduna dönüştürülmesidir.

## İlgili terimler

- [Backend](https://trescout.com/dictionary/backend/)
- [User Interface](https://trescout.com/dictionary/user-interface/)
- [Frontend Stack](https://trescout.com/dictionary/frontend-stack/)
- [GUI](https://trescout.com/dictionary/gui/)
- [Web Interface](https://trescout.com/dictionary/web-interface/)

## İlgili araçlar

- [Taste Skill](https://trescout.com/discover/taste-skill/)
- [Vite](https://trescout.com/discover/vite/)
- [OpenMAIC](https://trescout.com/discover/openmaic/)
- [CopilotKit](https://trescout.com/discover/copilotkit/)
- [Developer Portfolios](https://trescout.com/discover/developer-portfolios/)

Bu açıklama TreScout için yapay zekâ ile sade dille hazırlandı · yanlış ya da eksik gördüğünüz bir şey olursa [hello@trescout.com](mailto:hello@trescout.com). TreScout her gün GitHub, Hacker News ve Hugging Face'te öne çıkanları Türkçe özetler.

---
Kaynak: TreScout Teknoloji Sözlüğü · https://trescout.com/dictionary/frontend/
TreScout her gün GitHub, Hacker News ve Hugging Face'te öne çıkanları Türkçe özetler.
