React Ders Notları

Bu repository, React Vite derslerimizde işlediğimiz konuları ve projeleri toparlayan bir kaynak olarak hazırlanmıştır. Dersler hafta hafta işlenmiş olup, her bir hafta içinde işlenen konuların kod örneklerine, açıklamalarına ve dokümantasyonuna ulaşabilirsiniz. Bu sayede öğrencilerimiz, işlenen dersleri tekrar edebilir ve kodlar üzerinde kendi çalışmalarıyla pratik yapabilirler.

İçindekiler

• Genel Bilgiler
• Kurulum ve Çalıştırma
• Hafta Hafta Ders İçeriği
  • Hafta 1: React Giriş ve Kurulum
  • Hafta 2: JSX ve Bileşenler
  • Hafta 3: Props ve State Yönetimi
  • Hafta 4: React Router ve Dinamik Yönlendirme
• Katkıda Bulunma

Genel Bilgiler

Bu repository, derslerde üzerinde çalıştığımız kodların yanı sıra ek dokümantasyon ve açıklamalar içermektedir. Her hafta işlediğimiz konuları tekrar gözden geçirmek ve daha derinlemesine anlamak için kullanabilirsiniz.

• React Sürümü: 18.x
• Vite Sürümü: Son sürüm
• Node.js Sürümü: 20.17.0
• npm Sürümü: 10.8.2

Kurulum ve Çalıştırma

Repository’yi kendi bilgisayarınıza indirip çalıştırmak için şu adımları takip edebilirsiniz:

1. Bu repository'yi klonlayın:

   git clone https://github.com/RamenChan/ReactViteChapters.git
   cd react-ders-notlari

2. Bağımlılıkları yükleyin:

   npm install

3. Proje dosyasını çalıştırın:

   npm run dev

4. Tarayıcıda projeyi görüntüleyin: Tarayıcınızı açın ve http://localhost:3000 adresine gidin.

Hafta Hafta Ders İçeriği

1. Hafta: React Giriş ve Kurulum

• Konu Başlıkları: React ve Vite tanıtımı, React'in temel kavramları, projenin oluşturulması.
• Kod Örnekleri: İlk React bileşeni oluşturma ve basit JSX kullanımı.
• Öğrenim Hedefleri: React’in yapısını anlamak ve ilk React uygulamanızı oluşturmak.

2. Hafta: JSX ve Bileşenler

• Konu Başlıkları: JSX’in temelleri, bileşen yapıları, fonksiyonel ve sınıf bileşenler.
• Kod Örnekleri: Farklı bileşen türleriyle uygulamalar.
• Öğrenim Hedefleri: JSX ve bileşen yapılarında ustalaşmak.

3. Hafta: Props ve State Yönetimi

• Konu Başlıkları: Props kullanımı, state yönetimi, event handling.
• Kod Örnekleri: State ve props ile dinamik veri işleme.
• Öğrenim Hedefleri: React bileşenleri arasında veri paylaşımını ve state yönetimini öğrenmek.

4. Hafta: React Router ve Dinamik Yönlendirme

• Konu Başlıkları: React Router kullanımı, sayfalar arası geçiş, dinamik rotalar.
• Kod Örnekleri: Sayfa yönlendirmeleri ve parametrelerle dinamik rotalar.
• Öğrenim Hedefleri: React uygulamalarında çoklu sayfa yapısı ve yönlendirmeyi öğrenmek.

Katkıda Bulunma

Repository'ye katkıda bulunmak isterseniz, şu adımları takip edebilirsiniz:

1. Fork ederek kendi GitHub hesabınıza alın.
2. Yeni bir branch oluşturun:

   git checkout -b yeni-özellik

3. Değişikliklerinizi yapın ve commit edin:

   git commit -m "Yeni özellik eklendi"

4. Pull Request gönderin.

##Yazarlar

Bekiralp Zengin

Kemal özcan

Abdi Yıldızoğlu

Umut Nuri Uğur

Mehmet Görünmek