Frontend

Angular uygulama çatısı için bileşen, araç ve öğretici listesi. Web & Frontend başlığında →

Tarayıcıda coğrafi bilgi sistemleri (harita) için kütüphane listesi. Web & Frontend başlığında →

HTML5 API’leri (Canvas, WebSocket, depolama), araçları ve kaynaklarının listesi. Web & Frontend başlığında →

İyi bir mobil web deneyimi kurmak için kaynak listesi: dokunmatik olaylar, performans, çevrimdışı çalışma. Web & Frontend başlığında →

Svelte ve SvelteKit için bileşen ve araç listesi. Web & Frontend başlığında →

Tarayıcıda sanal/artırılmış gerçeklik sağlayan WebXR için kaynak listesi. Web & Frontend başlığında →

Web performansını iyileştirmek için somut öneriler toplayan kılavuz. Web & Frontend başlığında →

Bir HTML/CSS özelliğinin hangi e-posta istemcisinde çalıştığını gösteren tablo. Web & Frontend başlığında →

Bir web özelliğinin hangi tarayıcının hangi sürümünde çalıştığını gösteren tablo; kullanım oranlarıyla birlikte. Web & Frontend başlığında →

Canvas üstünde sade, duyarlı grafikler çizen JavaScript kütüphanesi. Web & Frontend başlığında →

Kopyalanıp kullanılabilecek HTML, CSS ve JavaScript kod örnekleri. Web & Frontend başlığında →

Meta’nın React tabanlı dokümantasyon sitesi üreticisi; sürümleme ve çeviri yerleşik geliyor. Web & Frontend başlığında →

Web geliştiricilere yönelik, gelişmiş hata ayıklama araçlarıyla gelen Firefox sürümü. Web & Frontend başlığında →

Bir web sayfasını yayına almadan önce HTML, CSS, JS, erişilebilirlik, performans ve SEO için denetlenecek maddeleri öncelik etiketleriyle listeler. Web & Frontend başlığında →

Frontend dünyasındaki haber, yazı ve araçları haftalık derleyen bülten. Web & Frontend başlığında →

Gerçekçi tasarım dosyaları verip onu koda dökmeni isteyen alıştırma platformu. Web & Frontend başlığında →

Kendi ürününe gömdüğün görsel sayfa düzenleyici; bileşen ve stil yöneticisini sen tanımlıyorsun. Web & Frontend başlığında →

Her HTML etiketi ve özniteliği görsel örnekle listelenmiş, tek sayfada göz gezdirilebiliyor. Web & Frontend başlığında →

HTML özniteliğiyle istek atıp dönen HTML parçasını sayfaya yerleştiriyorsun; JSON ve istemci durumu yok. Web & Frontend başlığında →

Markdown içeriği statik sitelere dönüştüren, Go ile yazılmış üretici. Web & Frontend başlığında →

Sıfırdan yazılan bağımsız tarayıcı motoru; Chromium, WebKit ya da Gecko’dan türetilmemiş. Web & Frontend başlığında →

Addy Osmani’nin JavaScript tasarım kalıplarını anlatan ücretsiz çevrimiçi kitabı. Web & Frontend başlığında →

Google Haritalar sıralamasını konum ızgarası üzerinde ölçüyor; aynı sorgunun mahalleden mahalleye nasıl değiştiğini gösteriyor. Web & Frontend başlığında →

Mozilla'nın web sitelerine önerdiği güvenlik başlıkları ve ayarları: CSP, HSTS, çerez bayrakları, CORS, SRI. Web & Frontend başlığında →

Obsidian notlarını doğrudan yayımlanmış bir dijital bahçeye çeviren eklenti. Web & Frontend başlığında →

Modern web uygulamaları için tasarım ve render desenlerini örneklerle anlatan ücretsiz kaynak. Web & Frontend başlığında →

Tüm dünya haritasını tek bir PMTiles dosyası olarak sunan açık kaynak harita yığını; dosya S3 gibi düz bir depoda… Web & Frontend başlığında →

Markdown notlarını — özellikle Obsidian kasalarını — bağlantılı bir siteye dönüştüren üretici. Web & Frontend başlığında →

React formlarını az yeniden render’la yöneten, doğrulama getiren kütüphane. Web & Frontend başlığında →

Teknik SEO kontrol listesi; başlık yapısı, şema işaretlemesi ve sayfa hızı maddeleri uygulanabilir. Web & Frontend başlığında →

Shopify tema şablon dilinin nesne, filtre ve etiket referansı. Web & Frontend başlığında →

Web tasarım ve geliştirme üzerine derinlemesine makaleler, kitaplar ve pratik rehberler. Web & Frontend başlığında →

SVG’yi betikle üretmek ve canlandırmak için JavaScript kütüphanesi; Raphaël’in modern tarayıcılara yazılmış hâli. Web & Frontend başlığında →

Bağımlılığı olmayan, erişilebilirlik odaklı kaydırıcı/karusel kütüphanesi. Web & Frontend başlığında →

Tarayıcının çirkin alert kutusunu güzel, özelleştirilebilir modallarla değiştiren kütüphane. Web & Frontend başlığında →

Görsel arayüz tasarımından temiz React, Vue ya da HTML kodu üreten düşük kodlu platform. Web & Frontend başlığında →

Topluluk eliyle yürütülen erişilebilirlik sitesi; WCAG’a dayanan sade bir kontrol listesi, yazılar ve araç-kaynak listeleri. Web & Frontend başlığında →

HTML’i spesifikasyona göre denetliyor; tarayıcının sessizce toparladığı kapatılmamış etiket ve geçersiz iç içe geçmeleri ortaya çıkarıyor. Web & Frontend başlığında →

WebAIM’in erişilebilirlik değerlendirme aracı; bir adres girince ya da tarayıcı eklentisiyle sayfanın üstüne hataları… Web & Frontend başlığında →

W3C’nin “How to Meet WCAG” sayfası: her başarı ölçütü, düzeyi (A, AA, AAA) ve onu karşılayan teknikler ile yaygın… Web & Frontend başlığında →

Microsoft’un 24 derslik müfredatı; her ders öncesi ve sonrası sınav, sonunda proje var. Web & Frontend başlığında →

Web geliştirmeyi temelden ileriye sade anlatan YouTube kanalı. Web & Frontend başlığında →

Google’ın web kalitesi (performans, erişilebilirlik, PWA) rehberleri ve ölçüm araçları. Web & Frontend başlığında →

Utah State Üniversitesi bünyesindeki erişilebilirlik merkezi; kontrast denetleyicisi, WAVE aracı ve yıllık "Million" taraması buradan çıkıyor. Web & Frontend başlığında →

WebAssembly standardının resmî sitesi: belirtimler, kavramlara giriş ve hangi önerinin hangi tarayıcı ve çalışma… Web & Frontend başlığında →

Bir sitenin erişilebilirlik, hız, güvenlik ve uyumluluk sorunlarını tarayan, her kuralı açıklayan açık kaynak linter… Web & Frontend başlığında →

Hazır CSS animasyonlarını oynatıp ayarlayarak kodunu kopyalatan kütüphane. CSS & Arayüz Kitleri başlığında →

CSS’e tarayıcı ön eklerini (‑webkit‑, ‑moz‑) otomatik ekleyen araç. CSS & Arayüz Kitleri başlığında →

Kurumsal arayüz tasarım dili Ant Design için kaynak listesi. CSS & Arayüz Kitleri başlığında →

CSS dili, araçları ve kaynaklarını konuya göre toplayan liste. CSS & Arayüz Kitleri başlığında →

CSS dilini ve modüllerini (Flexbox, Grid, seçiciler) öğrenmeye odaklı kaynak listesi. CSS & Arayüz Kitleri başlığında →

CSS’i eklentilerle dönüştüren PostCSS aracı için kaynak listesi. CSS & Arayüz Kitleri başlığında →

Tailwind CSS için eklenti, bileşen, şablon ve araç listesi. CSS & Arayüz Kitleri başlığında →

Tailwind CSS ve React projelerine doğrudan kopyalanabilen modern arayüz bileşenleri ve mikro etkileşim koleksiyonu… CSS & Arayüz Kitleri başlığında →

Hazır bileşenler ve ızgara sistemi; tasarım kararı vermeden çalışan bir arayüz çıkarıyorsun. CSS & Arayüz Kitleri başlığında →

Bootstrap düzenini sürükle-bırak ile görsel olarak kurup kodunu üreten araç. CSS & Arayüz Kitleri başlığında →

Flexbox tabanlı, yalnız CSS’ten oluşan (JavaScript yok) modern framework. CSS & Arayüz Kitleri başlığında →

Projelerde kullanılabilecek hazır CSS buton stilleri ve kodları. CSS & Arayüz Kitleri başlığında →

Modern açılış sayfası ve arayüz şablonları (Tailwind ağırlıklı). CSS & Arayüz Kitleri başlığında →

Verilen hedef görseli en az kodla, CSS ile yeniden üretmeye çalıştığın oyun. CSS & Arayüz Kitleri başlığında →

Küçültülmüş (minified) CSS’i okunur biçime getiren ve düzenleyen araç. CSS & Arayüz Kitleri başlığında →

Sık kullanılan düzen ve bileşenlerin (kart, ortalama, sabit başlık) hazır CSS tarifleri. CSS & Arayüz Kitleri başlığında →

Belirli cihaz boyutları için CSS medya sorgusu üreten basit araç. CSS & Arayüz Kitleri başlığında →

CSS kodunu boşluk ve yorumları atarak küçülten (minify) basit bir araç; API’si de var. CSS & Arayüz Kitleri başlığında →

Her CSS özelliğini görsel örnekle gösteren başvuru. CSS & Arayüz Kitleri başlığında →

Yirmi yıllık CSS tekniği arşivi; Flexbox ve Grid rehberleri yaygın başvuru kaynağı hâline geldi. CSS & Arayüz Kitleri başlığında →

CSS, HTML, JavaScript ve .htaccess için yıllar içinde biriktirilmiş parçacık arşivi. CSS & Arayüz Kitleri başlığında →

Lea Verou’nun CSS yumuşatma eğrilerini elle kurup hazır ayarlarla canlı karşılaştıran aracı. CSS & Arayüz Kitleri başlığında →

CSS yumuşatma (easing) eğrilerini görsel olarak kuran araç; cubic-bezier’in yanında linear() ile yay ve sıçrama eğrilerini de üretiyor. CSS & Arayüz Kitleri başlığında →

Yaygın yumuşatma (easing) eğrilerini görselleştiriyor; her biri için cubic-bezier değerini kopyalatıyor. CSS & Arayüz Kitleri başlığında →

Organik şekiller için CSS border-radius üreten görsel araç. CSS & Arayüz Kitleri başlığında →

Kurbağaları hizalayarak Flexbox öğreten oyun; Grid Garden’ın kardeşi. CSS & Arayüz Kitleri başlığında →

Bootstrap’ın uzun süreli rakibi olan duyarlı arayüz çatısı; XY ızgarası, erişilebilirlik odaklı bileşenler ve e-posta… CSS & Arayüz Kitleri başlığında →

HTML, CSS ve JavaScript kod örnekleri ve öğreticilerini toplayan geniş dizin. CSS & Arayüz Kitleri başlığında →

Havuç sulayarak CSS Grid öğreten 28 bölümlük oyun. CSS & Arayüz Kitleri başlığında →

CSS Grid düzenini sürükle-bırak çizip kodunu üreten araç. CSS & Arayüz Kitleri başlığında →

React için Google Material tasarımını uygulayan bileşen kütüphanesi. CSS & Arayüz Kitleri başlığında →

8-bit NES estetiğinde retro görünümlü CSS çerçevesi. CSS & Arayüz Kitleri başlığında →

Yumuşak gölgeli “neumorphism” kutuları için CSS üreten araç. CSS & Arayüz Kitleri başlığında →

Tarayıcılar arası varsayılan stil farklarını eşitleyen küçük CSS temeli. CSS & Arayüz Kitleri başlığında →

Yalnızca birkaç KB olan, küçük ve modüler bir CSS framework’ü (Yahoo). CSS & Arayüz Kitleri başlığında →

Web uygulamaları için özenli animasyonlara ve sıra dışı görsel detaylara sahip hazır arayüz bileşenleri seçkisi… CSS & Arayüz Kitleri başlığında →

Yardımcı sınıflarla stil yazıyorsun; derleme adımı kullanılmayan sınıfları atıyor, CSS dosyası büyümüyor. CSS & Arayüz Kitleri başlığında →

Hazır CSS gradyanlarını gösterip kodunu veren araç. CSS & Arayüz Kitleri başlığında →

Topluluğun katkı verdiği açık kaynak arayüz bileşeni galerisi: buton, kart, yükleyici, anahtar. CSS & Arayüz Kitleri başlığında →

CSS’i resmî W3C kurallarına göre doğrulayan araç; URL, dosya ya da doğrudan metin kabul ediyor. CSS & Arayüz Kitleri başlığında →

Bir web uygulamasını yerel bir kabuğa saran, cihaz API’lerine erişim veren çalışma zamanı. Mobil & Masaüstü başlığında →

Web teknolojileriyle çapraz platform mobil arayüz geliştiren açık kaynak çatı. Mobil & Masaüstü başlığında →

Google’ın açık tasarım sistemi ve arayüz kılavuzları; Android arayüzünün temeli. Mobil & Masaüstü başlığında →

Sitenizi farklı tarayıcı ve işletim sistemlerinde canlı test etmenizi sağlayan servis. Test & Kalite başlığında →

Bir Content-Security-Policy başlığını yapıştırınca atlatılabilir kuralları (unsafe-inline, geniş joker karakterler… Test & Kalite başlığında →

Mozilla'nın bir sitenin başlıklarını, çerezlerini ve TLS ayarlarını güvenlik en iyi uygulamalarına göre puanlayan… Test & Kalite başlığında →

Bir sitenin HTTP yanıt başlıklarını (CSP, HSTS, X-Frame-Options, Permissions-Policy vb.) tarayıp A–F arası not veren ve… Test & Kalite başlığında →

Bir sayfanın yükleme performansını gerçek cihaz ve konumlardan ölçen test. Test & Kalite başlığında →

JavaScript ile tarayıcıda 2B oyun geliştirmek için HTML5 oyun çatısı. Oyun Geliştirme başlığında →

Node.js’i WebContainer ile tarayıcıda çalıştırıyor; üretilen tam yığın uygulama sunucuya gitmeden anında önizleniyor. YZ · Uygulama Araçları başlığında →

Sohbetle uygulama kurup Supabase bağlantısını ve dağıtımı da üstleniyor. YZ · Uygulama Araçları başlığında →

Metinden React bileşeni üretiyor; çıktı shadcn/ui ve Tailwind kullanıyor, yani mevcut bir projeye kopyalanabilir kod çıkıyor. YZ · Uygulama Araçları başlığında →

Metin ya da kaba çizimden arayüz tasarımı üretip düzenlenebilir tasarım dosyası veriyor. YZ · Üretken Medya başlığında →

GeoCities ruhunu yaşatan, 1 GB ücretsiz alan ve tarayıcı içi kod editörüyle statik HTML/CSS siteleri barındıran… Öz-Barındırma & Kişisel Bulut başlığında →

Statik siteleri tek komutla yayına alan ücretsiz barındırma. Öz-Barındırma & Kişisel Bulut başlığında →

Web güvenliğine odaklı, saldırı sınıflarına (XSS, SSRF, deserialization) göre bölünmüş kaynak listesi. Saldırı, Savunma & OSINT başlığında →

HTML5 ve tarayıcı tuhaflıklarından doğan XSS vektörlerinin numaralandırılmış koleksiyonu; her vektör için çalıştığı tarayıcılar belirtiliyor. Saldırı, Savunma & OSINT başlığında →

Renk paleti ve ton basamakları üreten araç. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Kurallarla yönlendirilen, yeniden kullanılabilir bileşen sistemleri (design system) listesi. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Dijital tasarımcılar için web tasarımı kaynak listesi. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Öne çıkan web tasarımlarını ödüllendiren ve sergileyen galeri. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Bir sonraki renk şemanı seçmene yardım eden kaynak listesi. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Google fontlarını tek tek, hızla çevirerek kendi metninle karşılaştıran araç. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Açık kaynak yazı tiplerini npm paketi olarak kendi sunucunda barındırmanı sağlıyor. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Etkileşimli arayüz ve site tasarlayıp yayına alan tasarım aracı. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Açık lisanslı yazı tipi kataloğu; dosyaları indirip kendi sunucundan servis edebiliyorsun. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Yüklediğin görselin üzerine tıklayarak HEX/RGB kodu alıyor ve görselden bir palet çıkarıyor. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

İyi tasarlanmış web sitelerinin küratörlü galerisi; sektöre, üsluba ve renge göre süzülebiliyor. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Tarayıcıda tel kafes ve prototip; Figma’nın tasarım derinliği yok ama hızlı bir akış şeması ya da ekran taslağı için yeterli ve daha hafif. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Açık kaynak Figma arayüz şablonları koleksiyonu. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Bütünsel tasarım dili örnekleri için galeri; tipografi ve hareket kullanımı güçlü siteler derleniyor. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Aynı arayüz bileşenini farklı tasarım sistemlerinde yan yana gösteren referans. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Bir oran seçip görsel tipografik ölçek üreten ve CSS’ini veren hesaplayıcı. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Her gün yayımlanan ücretsiz arayüz bileşeni tasarımları; kaynak dosyaları Figma ve Sketch biçiminde indirilebiliyor. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Bölüm bazlı tasarım örnekleri: hero, fiyatlandırma, SSS, footer ayrı ayrı. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Bir font dosyasını sürükleyince içindeki her şeyi döküyor: karakter kümesi, OpenType özellikleri, değişken eksenler ve bunları açan hazır CSS. Arayüz Tasarımı, Renk & Yazı Tipi başlığında →

Programlama dili ve araç logolarının ikon fontu; özgeçmiş, sunum ve README’lerde teknoloji rozeti olarak kullanılıyor. İkon, Fotoğraf & İllüstrasyon başlığında →

Tek çizgi kalınlığında, sade ve tutarlı açık kaynak ikon seti. İkon, Fotoğraf & İllüstrasyon başlığında →

Rengi ve saydamlığı ayarlanıp CSS’i kopyalanan tekrarlı SVG arka plan desenleri. İkon, Fotoğraf & İllüstrasyon başlığında →

Tasarımları renklendirmek için 2100+ ücretsiz ikon; ikon fontu olarak da kullanılabiliyor. İkon, Fotoğraf & İllüstrasyon başlığında →

100’den fazla ikon setini tek API/bileşen altında birleştiren kütüphane. İkon, Fotoğraf & İllüstrasyon başlığında →

Ücretsiz ve ücretli toplam 31 binden fazla ikonluk çizgi stilinde set; tamamı için abonelik gerekiyor. İkon, Fotoğraf & İllüstrasyon başlığında →

Hafif JSON tabanlı vektör animasyonların arşivi ve düzenleyicisi. İkon, Fotoğraf & İllüstrasyon başlığında →

1600’den fazla SVG ikon içeren kütüphane; React, Vue, Svelte için hazır paketleri var. İkon, Fotoğraf & İllüstrasyon başlığında →

Hem çizgi hem dolu biçimde gelen, tutarlı açık kaynak ikon seti. İkon, Fotoğraf & İllüstrasyon başlığında →

SVG yol verisini (d özniteliği) görsel olarak düzenleyip komutları tek tek gösteriyor. Medya, Dosya & Diyagram başlığında →

CSS seçicilerini bir masa üzerindeki yemekleri seçerek öğreten oyun. Öğrenme & Yol Haritaları başlığında →

Kule savunması oyunu üzerinden CSS Flexbox öğreten site. Öğrenme & Yol Haritaları başlığında →

Web geliştirici olmak için öğrenilecek becerileri (HTML, CSS, JS, araçlar, test, performans) görsel bir harita olarak… Öğrenme & Yol Haritaları başlığında →

Gömülü editörle ön yüz (HTML/CSS/JS) meydan okumaları; her dönem yeni bir tema veriliyor. Pratik & Alıştırma başlığında →

Gerçekçi tasarım ve gereksinimlerle web projeleri kurduran meydan okuma sitesi. Pratik & Alıştırma başlığında →

Web geliştirmeyi projeler üzerinden, tam bir açık müfredatla öğreten platform. Pratik & Alıştırma başlığında →

Aynı yapılacaklar uygulamasını onlarca JavaScript çatısında gösteriyor. Pratik & Alıştırma başlığında →

Erişilebilir arayüzü kod düzeyinde anlatan rehber; her örnekte önce yanlış yaklaşımı sonra doğrusunu gösteriyor. Kopya Kâğıtları & Başvuru başlığında →

Fitts, Hick, Jakob gibi arayüz tasarımını yöneten psikoloji yasalarının kısa ve görsel derlemesi. Kopya Kâğıtları & Başvuru başlığında →

Etiket, olay işleyicisi ve tarayıcıya göre filtrelenebilen XSS vektörleri listesi. Kopya Kâğıtları & Başvuru başlığında →

Açık kaynak, tarayıcıda çalışan Markdown editörü; canlı önizleme ve dışa aktarma. Editör, IDE & Terminal başlığında →

HTML, CSS ve JavaScript’i tarayıcıda deneyip paylaştığın oyun alanı. Çevrimiçi Kod Alanları & Derleyiciler başlığında →

HTML, CSS ve JS’i canlı önizlemeyle deneyebileceğin tarayıcı içi kod alanı. Çevrimiçi Kod Alanları & Derleyiciler başlığında →

JavaScript, HTML ve CSS’i biçimlendiren, küçültülmüş kodu açan araç. Dönüştürücü, Biçimlendirici & Denetleyici başlığında →

Tasarım denemeleri için yer tutucu metin (lorem ipsum) üreten klasik araç. Dönüştürücü, Biçimlendirici & Denetleyici başlığında →

Sayfayı yalnızca metne indiriyor. Tarayıcının okuma modundan farkı sayfanın tamamını düz metne çevirmesi: reklam ve… Dönüştürücü, Biçimlendirici & Denetleyici başlığında →

Bir sitenin hangi teknolojilerle (çatı, sunucu, analitik) kurulduğunu gösteren araç ve tarayıcı eklentisi. Dönüştürücü, Biçimlendirici & Denetleyici başlığında →

HubSpot’un bir sitenin performans, SEO, mobil uyum ve güvenliğini puanlayan ücretsiz aracı. Dönüştürücü, Biçimlendirici & Denetleyici başlığında →

Geliştiriciler için ücretsiz araç, kütüphane ve tasarım kaynaklarını kategorilere göre indeksleyen açık kaynaklı… Listeler, Dizinler & Keşif başlığında →