Orta8 hafta8 bölüm · 40 ders · 8 ödev

React Router ile Fullstack (Remix)

React Router'ın framework kipini, web standartları üzerine kurulu fullstack bir çerçeve olarak öğreten program. Rota modülleri, loader ve action modeli, formlar, oturum ve kimlik doğrulama, önbellek ve yayın. Remix'in fikirleri artık React Router'da: sunucu ve istemci arasındaki sınırı HTTP'nin diliyle çizmeyi öğreniyorsun.

Verilen süreler tahminidir; kurumunuzun saat planlamasına göre revize edilir.

Kime uygun

· React biliyor, veri yüklemeyi ve formları platformun diliyle çözmek isteyenler
· Mevcut Remix ya da React Router projelerini sürdürenler

Ön koşullar

· React ve TypeScript temelleri
· SQL Temelleri önerilir

Müfredat

React Router ve Remix: nasıl birleşti28 dk

Kurulum, rota yapılandırması ve proje iskeleti26 dk

Render kipleri: SSR, SPA ve ön-render30 dk

Web standartları: Request, Response ve FormData24 dk

Bölüm ödevi: Çok sayfalı iskelet uygulama40 dk

Çok sayfalı iskelet uygulamaödev

React Router — Belgelerbağlantı

React Router — Framework Kipibağlantı

MDN — FormDatabağlantı

Rota modülü: bileşen, loader, action bir arada28 dk

Layout, Outlet ve iç içe rotalar26 dk

Bağlantılar, NavLink ve ön-yükleme30 dk

Dinamik parametreler ve bölünmüş rotalar28 dk

Bölüm ödevi: İç içe düzenli bir pano45 dk

İç içe düzenli bir panoödev

React Router — Rota Modülleribağlantı

React Router — Yönlendirmebağlantı

React Router — Navigasyonbağlantı

loader ile veri yüklemek26 dk

useLoaderData ve tip güvenliği30 dk

Yükleme durumu ve akış (streaming)24 dk

Hata sınırları ve 40428 dk

Bölüm ödevi: Loader'larla beslenen liste ve ayrıntı sayfası50 dk

Loader'larla beslenen liste ve ayrıntı sayfasıödev

React Router — Veri Yüklemebağlantı

React Router — Hata Sınırlarıbağlantı

React — Suspensebağlantı

Form ve action ile mutasyon26 dk

Doğrulama ve hata gösterimi30 dk

redirect ve sayfa yenileme olmadan güncelleme28 dk

useFetcher ve optimistik arayüz26 dk

Bölüm ödevi: Doğrulamalı oluştur/düzenle/sil akışı40 dk

Doğrulamalı oluştur/düzenle/sil akışıödev

React Router — Action'larbağlantı

React Router — Form Doğrulamabağlantı

React Router — useFetcherbağlantı

Drizzle ya da Prisma ile veritabanı30 dk

Çerez ve oturum depolama24 dk

Korumalı rotalar ve yetkilendirme28 dk

Şifre güvenliği ve CSRF26 dk

Bölüm ödevi: Kayıt, giriş ve korumalı panel45 dk

Kayıt, giriş ve korumalı panelödev

React Router — Oturumlar ve Çerezlerbağlantı

Drizzle ORM — Belgelerbağlantı

OWASP — Oturum Yönetimibağlantı

Kaynak rotaları: API, RSS ve dosya yanıtları30 dk

Meta ve belge başlığı28 dk

Sitemap ve robots26 dk

Erişilebilir gezinme30 dk

Bölüm ödevi: RSS ve JSON uç noktaları olan içerik sitesi50 dk

RSS ve JSON uç noktaları olan içerik sitesiödev

React Router — Kaynak Rotalarıbağlantı

React Router — Metabağlantı

WAI-ARIA Authoring Practicesbağlantı

HTTP önbellek başlıkları24 dk

Prefetch stratejileri28 dk

Kod bölme ve paket boyutu26 dk

Sunucuda veri tekrarını önlemek30 dk

Bölüm ödevi: Önbellek başlıklarıyla hızlandırılmış sayfalar40 dk

Önbellek başlıklarıyla hızlandırılmış sayfalarödev

MDN — HTTP Önbelleklemebağlantı

React Router — Performansbağlantı

web.dev — Core Web Vitalsbağlantı

Rota ve bileşen testleri28 dk

Playwright ile uçtan uca test26 dk

Node.js, Cloudflare ve Vercel'e yayın30 dk

Buradan sonra nereye24 dk

Bitirme projesi: Uçtan uca uygulama: loader/action modeli, oturum, SEO ve yayın60 dk

Uçtan uca uygulama: loader/action modeli, oturum, SEO ve yayınödev

React Router — Testbağlantı

Playwright — Belgelerbağlantı

React Router — Dağıtımbağlantı

DersÖdevKaynak

Bu programı kurumunuzun kendi sınıfında, müfredat, ders ve değerlendirme dahil yürütüyorum.

Kurumunuza getirin