Özet - React girişi
- React kursu
- Başlangıç
- Ders 4/84
- 5 dk
Vite projesi açıp ilk bileşenini ekleyerek temel akışı birleştirirsin.
Özet - React girişi
Bu grupta React'in ne olduğunu, Vite ile nasıl proje açtığını ve ilk bileşenini nasıl yazacağını öğrendin. Şimdi bunları birleştirme zamanı.
Tipik bir akış şöyledir: Vite ile proje açarsın, src/App.jsx içine kendi bileşenini yazarsın ve büyük harfle başlayan bir fonksiyon olarak dışa aktarırsın. main.jsx bu bileşeni alıp #root içine çizer.
Bir sonraki adımda kendin bir bileşen yazıp akışı baştan sona yaşayacaksın.
Uygulama Welcome bileşeni
Aşağıdaki iskeleti tamamla. Welcome adında bir bileşen yaz; <main> içinde <h1>Hosgeldin</h1> ve <p>React'e basla</p> döndürsün. Dışa aktarmayı unutma.
Başlangıç kodu
// Welcome bileşenini buraya yazÖrnek çözüm
function Welcome() {
return (
<main>
<h1>Hosgeldin</h1>
<p>React'e basla</p>
</main>
);
}
export default Welcome;Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 main.jsx ne yapar?
- CSS dosyalarını yükler
- Sunucuyu başlatır
- Testleri çalıştırır
- createRoot ile React'i root içine çizer Doğru cevap
Açıklama: main.jsx içinde createRoot(...).render(<App />) çağrılır.
2 Akış adımlarını eşleştir
| Kavram | Anlamı |
|---|---|
npm create vite |
Proje aç |
npm install |
Bağımlılık kur |
createRoot |
Kök çiz |
export default |
Bileşeni dışa aktar |