Feature-based

Feature-based mimari öğrenirsin.

Feature-based mimari

Feature-based mimari, kodu teknik katmana göre değil, özelliğe göre gruplandırır. Her özellik (ör. auth, profile, cart) kendi klasöründe yaşar; içinde bileşenler, hook'lar, servisler ve tipler bir arada bulunur.

Bu yaklaşım büyük uygulamalarda dosya bulmayı kolaylaştırır. Bir özelliği taşımak ya da silmek tek klasörde halledilir. features/ kök klasörü yaygın bir konumlandırma biçimidir.

Klasör yapısı

Tipik bir features/auth klasörü şunları içerir: components/ (LoginButton, LoginForm), hooks/ (useAuth), services/ (authService) ve types.ts. Özelliğe özgü her şey buradadır.

Başka bir özellik bu klasöre directly bağımlı olmamalı; paylaşılan kod shared/ ya da common/ içine konur. Bu, özellikler arası gevşek bağ (loose coupling) sağlar.

Uygulama useAuth hook'u

Bir useAuth hook'u yaz. user ve login döndürsün; ikisi de başlangıçta null ve boş fonksiyon olsun. Hook'u export ile dışa aktar.

Örnek çözümü göster

import React, { useState } from 'react';

const useAuth = () => {
  const [user, setUser] = useState(null);
  const login = () => {};
  return { user, login };
};

export default useAuth;

Kendini test et

Feature-based mimaride 'auth' özelliği nerede durur?
- features/auth/ klasöründe
- src/components/ altında
- node_modules içinde
- android/ klasöründe
Cevabı göster

features/auth/ klasöründe — Her özellik kendi klasöründe yaşar.

Özellik klasörü adı

features/____/components/LoginButton.tsx

Cevabı göster

features/auth/components/LoginButton.tsx

Klasör içeriklerini eşleştir

components

Bileşenler
hooks

useXxx fonksiyonları
services

Veri/servis katmanı
types.ts

TypeScript tipleri

Sıradaki ders: Layered

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler