← Ana sayfaEN
Lisans2026–2027 Güz

Web Teknolojileri ve Programlama

Web Teknolojileri ve Programlama Dersi

Öğretim dili
Türkçe
Ders saatleri
Haftada 3,5 saat uygulamalı ders (geliştirme stüdyosu)
İletişim
Duyurular, teslimler ve puanlar bu platformdan

Ders tanımı

Bu derste dinlemek değil, üretmek var. Ders bir geliştirme stüdyosu olarak işlenir: planlı teori anlatımı ve öğretim elemanı tarafından canlı kodlama yoktur. Her öğrenci dönem boyunca kendi repository'sinde tek bir ürün geliştirir: Kampüs Etkinlikleri uygulaması.

Vize öncesindeki altı sprintte önce HTML, CSS ve JavaScript ile çalışan bir web prototipi kurulur; ardından prototip Vite, TypeScript ve React ile bütünleşik bir frontend'e taşınır. Vize sonrasındaki altı sprintte aynı repository'ye Express ile REST API, MongoDB ve Mongoose ile kalıcı veri, JWT ile kimlik doğrulama, Axios ile frontend–backend entegrasyonu eklenir ve uygulama canlıya alınır. Dönem sonunda canlı bir full-stack uygulama teslim edilir.

Her sprint aynı ritmi izler: dersten önce 2–3 saatlik kaynak paketi çalışılır ve küçük hazırlık görevi tamamlanır; sınıfta öğrenci kendi kodunu geliştirir, takıldığı yerde kodun üzerinden destek alır; sprint sonunda çalışan çıktıyı gösterir, commit, push ve sprint etiketi oluşturur.

3,5 saatlik ders şöyle akar: 10 dakika hedef ve kabul ölçütleri, 155 dakika bireysel geliştirme ve kod üzerinden danışmanlık, 30 dakika çalışan çıktıyı gösterme, 15 dakika commit, push ve teslim notu.

Teknoloji seti bilinçli olarak sınırlıdır; amaç çok araç görmek değil, seçilen araçlarla çalışan bir ürün geliştirmektir. İstemci: HTML, CSS, JavaScript, TypeScript (strict), Vite, React, React Router, Axios. Sunucu: Node.js, Express, REST API, JWT, MongoDB, Mongoose. Teslim: Git, GitHub ve deployment. Next.js/SSR, refresh token/OAuth ve ileri cloud mimarisi bu dersin kapsamında değildir.

Önkoşullar Temel programlama bilgisi. Sprint 0 (Node.js, npm, Git ve GitHub kurulumu) ilk dersten önce tamamlanmalıdır.

Öğrenme çıktıları

Bu dersi başarıyla tamamlayan öğrenci:

  1. 1Anlamsal HTML ile erişilebilir sayfa yapıları kurar ve çalışmasını Git ve GitHub ile sürümler
  2. 2Mobil öncelikli, duyarlı ve erişilebilir arayüzleri CSS (Flexbox, Grid) ile tasarlar
  3. 3JavaScript ile arayüzü veriden üretir; arama, filtre ve form doğrulama gibi etkileşimler geliştirir
  4. 4Strict TypeScript ile veri modeli ve saf fonksiyonlar yazar, Vite ile proje iskeleti kurar
  5. 5React ile tipli ve tekrar kullanılabilir bileşenlerden oluşan, state, form ve yönlendirme içeren bir arayüz geliştirir
  6. 6Express ile REST API sözleşmesi tasarlar ve uygular; doğru HTTP durum kodları ve hata yönetimi kullanır
  7. 7MongoDB ve Mongoose ile kalıcı veri katmanı kurar; tam CRUD ve istek doğrulaması uygular
  8. 8Parola özeti, JWT ve kullanıcı sahipliğiyle kimlik doğrulama ve yetkilendirme uygular
  9. 9Frontend'i Axios ile kendi REST API'sine bağlar; yükleniyor ve hata durumlarını yönetir
  10. 10Full-stack uygulamayı canlıya alır; ortam değişkenleri, CORS ve uçtan uca testlerle doğrular
  11. 11Yazdığı kodu ve kullandığı yardımı açıklayarak kendi ürününü sahiplenir

Haftalık plan

HaftaKonuOkuma ve çalışmalar
0Dönem öncesi hazırlık (Sprint 0)Node.js, npm, Git ve GitHub kurulumu; notlandırılmaz
1Sprint 1: HTML ve GitBeş sayfalık, birbirine bağlı HTML prototipi
2Sprint 2: CSS, responsive tasarım ve erişilebilirlikMobil ve masaüstünde kullanılabilir arayüz
3Sprint 3: JavaScript, DOM ve kullanıcı etkileşimiVeriden liste, arama, filtre ve form doğrulama
4Sprint 4: Vite iskeleti ve TypeScript veri katmanıStrict TypeScript veri modeli ve saf fonksiyonlar
5Sprint 5: React bileşenleriPrototipin props kullanan tipli bileşenlere taşınması
6Sprint 6: State, form, router ve bütünleşik frontendListe, detay, ekleme, en az 4 route ve 404
7Vize haftasıCanlı gösterim, repository, README, production build ve domain
8Sprint 7: Express sunucusu ve REST API sözleşmesiBellek içi veriyle çalışan REST API
9Sprint 8: MongoDB Atlas, Mongoose ve kalıcı veriMongoDB'ye yazan ve okuyan API
10Sprint 9: CRUD, istek doğrulama ve hata yönetimiPATCH, DELETE, 400 ve 404 yanıtları, hata middleware'i
11Sprint 10: Authentication, JWT ve authorizationKayıt, giriş, korumalı route ve etkinlik sahipliği
12Sprint 11: Axios ile frontend–backend entegrasyonuOrtak Axios istemcisi ve korumalı CRUD akışı
13Sprint 12: Deployment ve production doğrulamasıCanlı frontend ve backend, CORS, smoke test
14Final haftasıCanlı demo: giriş, etkinlik oluşturma, güncelleme, silme ve sahiplik kontrolü

Değerlendirme

%40Vize%60Final
VizeToplam 100 puan

Rozet bonusu: Tam isabet (bir sprintten tam puan) +1, İlk adım (ilk puanın girildi) +1, Seri (art arda 2 tam puan) +2, İstikrar (her sprintte %75+) +3, Yarı yol (vize 50+) +3; en fazla +10, not en fazla tam puan.

  1. Sprint-14 puan
  2. Sprint-26 puan
  3. Sprint-310 puan
  4. Sprint-415 puan
  5. Sprint-520 puan
  6. Sprint-625 puan
  7. Teslim20 puan
FinalToplam 100 puan

Rozet bonusu: Tam isabet (bir sprintten tam puan) +1, İlk adım (ilk puanın girildi) +1, Seri (art arda 2 tam puan) +2, İstikrar (her sprintte %75+) +3, Yarı yol (final 50+) +3; en fazla +10, not en fazla tam puan.

  1. Sprint-78 puan
  2. Sprint-812 puan
  3. Sprint-916 puan
  4. Sprint-1020 puan
  5. Sprint-1124 puan
  6. Final Teslim20 puan

Kaynaklar

Ders kuralları

Sprint puanlaması: Her sprint aynı oranla değerlendirilir: %40 çalışan temel işlev, %20 öğrenme hedefini gösteren kod, %20 commit, push, etiket ve teslim notu, %20 yapılan değişikliği açıklama. Ayrı bir “bütünleşik proje” puanı yoktur; teknik başarı geliştirildiği sprintte puanlanır. Puan arttıkça sorumluluk da birikir: her yeni sprint önceki özellikleri koruyarak ilerler.

Vize ve final haftaları: Vize ve final notunun büyük bölümü sprintlerden, kalanı o haftanın gösterim ve tesliminden gelir; puan dağılımı Değerlendirme bölümündedir. Vize haftasında çalışan React frontend canlı gösterilir (repository, README, production build ve domain). Final haftasında canlı full-stack uygulamada giriş yapma, etkinlik oluşturma, güncelleme, silme ve sahiplik kontrolü gösterilir.

Teslim: Her sprint sonunda commit, push ve sprint etiketi (ör. sprint-01) oluşturulur; teslim notunda bilinen eksikler belirtilir. Sprintler ayrı repository'ler değil, aynı ürünün kayıt altına alınmış sürümleridir.

Sprint 0: Notlandırılmaz; teknik sorunları Sprint 1'den önce görünür kılmak için ilk dersten önce tamamlanır.

Öğretim elemanının rolü: Öğretim elemanı sınıfta dolaşır, kodu yerinde inceler ve yönlendirir. Sorun çözülmüş kod verilmez; hatayı bulma yönü verilir. Her öğrenci kendi kodunu çalıştırır, gösterir ve açıklayabilir.

Yapay zekâ: Yapay zekâ araçları kullanılabilir; kullanılan yardım teslim notunda belirtilir ve eklenen kod açıklanabilmelidir. Anlamadığın kod teslim edilemez.