Feature-based
- React Native kursu
- Uzman
- Ders 13/47
- 5 dk
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.
Başlangıç kodu
import React, { useState } from 'react';
// useAuth hook'unu buraya yaz
export default useAuth;Örnek çözüm
import React, { useState } from 'react';
const useAuth = () => {
const [user, setUser] = useState(null);
const login = () => {};
return { user, login };
};
export default useAuth;Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Feature-based mimaride 'auth' özelliği nerede durur?
- features/auth/ klasöründe Doğru cevap
- src/components/ altında
- node_modules içinde
- android/ klasöründe
Açıklama: Her özellik kendi klasöründe yaşar.
2 Özellik klasörü adı
features/____/components/LoginButton.tsxfeatures/auth/components/LoginButton.tsxAçıklama: auth özelliği features/auth altında yaşar.
3 Klasör içeriklerini eşleştir
| Kavram | Anlamı |
|---|---|
components |
Bileşenler |
hooks |
useXxx fonksiyonları |
services |
Veri/servis katmanı |
types.ts |
TypeScript tipleri |