Agent skill · software engineering · affaan-m
frontend-patterns
React, Next.js, state yönetimi, performans optimizasyonu ve UI en iyi uygulamaları için frontend geliştirme kalıpları.
Why this skill is useful
Adds multiple executable React component patterns and custom hooks that enhance frontend development capabilities.
What it needs
About 7k tokens when loaded. Last updated 2026-08-06. 238,342 stars on the source repository.
What this skill does
Frontend Geliştirme Kalıpları React, Next.js ve performanslı kullanıcı arayüzleri için modern frontend kalıpları. Ne Zaman Aktifleştirmelisiniz React bileşenleri oluştururken (composition, props, rendering) State yönetirken (useState, useReducer, Zustand, Context) Veri çekme implementasyonu (SWR, React Query, server components) Performans optimize ederken (memoization, virtualization, code splitting) Formlarla çalışırken (validation, controlled inputs, Zod schemas) Client-side routing ve navigasyon işlerken Erişilebilir, responsive UI kalıpları oluştururken Bileşen Kalıpları Kalıtım Yerine Composition Compound Components Render Props Kalıbı Özel Hook Kalıpları State Yönetimi Hook'u Async Veri Çekme Hook'u Debounce Hook'u State Yönetimi Kalıpları Context + Reducer Kalıbı Performans Optimizasyonu Memoization Code Splitting ve Lazy Loading Uzun Listeler için Virtualization Form İşleme Kalıpları Doğrulamalı Controlled Form Error Boundary Kalıbı Animasyon Kalıpları Framer Motion Animasyonları Erişilebilirlik Kalıpları Klavye Navigasyonu Focus Yönetimi Unutmayın: Modern frontend kalıpları sürdürülebilir, performanslı kullanıcı arayüzleri sağlar. Proje karmaşıklığınıza uyan kalıpları seçin.
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills affaan-m/frontend-patterns--aee095