React Context API ve Hooklar | Part 1

React ile Redux ya da MobX karmaşına girmeden Uygulama Geliştirin
Rating: 4.6 out of 5 (37 ratings)
3,683 students
Turkish

React
React Context API
React Hook Yapıları
Sıfırdan React İle Uygulama Geliştirme

Requirements

  • Temel seviyede React bilgisi

Description

Bilgilendirme:

Öncelikle Udemy tarafından yapılan bir değişiklik nedeni ile 2 saat üzeri eğitimler ücretsiz olarak yayınlanamıyor. Bu nedenle React Context API ve Hooklar eğitimini 3 parçaya bölmem gerekti.

En yeni bilgilendirme:

React Context API ve Hooklar Eğitimine ait Part 1, Part 2 ve Part 3 Kurs açılış sayfalarındaki metnin aynı olması sebebi ile Udemy tarafından içerik kopyalama olarak işaretlenmiş ve eğitimlerim yayından kaldırılmış, bir süre yayında olmamasının sebebi de tam olarak buydu. Aslında üç eğitim de bana ait ama sitem bunun ayrımını yapamamış ve benden her bir eğitimin


Bu kurs başlı başına bir eğitim değildir. Anlamlı hale gelebilmesi için yukarıda da belirttiğim gibi Part 1 ve Part 2 eğitimlerini tamamlamış olmanız gerekmektedir.


Her şeyden önce nasıl bir uygulama yapacağımızı görmek isterseniz:

https://yaztest-rch.web.app/

adresine giderek uygulamayı test edebilirsiniz.


Peki Bu kursun olayı ne?

React ile uygulama geliştirmenin en önemli kısmı Durum Yönetimi(State Management)dir. Çoğu zaman bileşen seviyesinde Durum verileri kullanarak bileşenlerimizi yönetmeye çalışsak da uygulama genelinde birden fazla bileşenin kullandığı veriler vardır. İşte bu verileri merkezi bir yerden yönetmek React Geliştirme sürecinin en uğraştırıcı ve çoğu zaman kafa karıştırıcı kısmı olmuştur. Bu karmaşayı azaltmak adına Redux ve MobX gibi paketler geliştirilmiş, pek çok soruna çözüm getiriyor olsalar da ortada bir sorun var; yapılarını anlamak, anlayınca da uygulamak epey zahmetli olabiliyor. React geliştiricileri bu soruna çözüm olmak adına yeni bir çözüm getirdiler:

React Hooks!

Peki nedir bu React Hooks? Aslında yardımcı fonksiyonlara verilen bir isim. "useState", "useContext", "useEffect" gibi ön tanımlı Hook Fonskiyonları olmakla birlikte kendi Hook metodlarımızı da geliştirebiliyoruz ama bu kursta sadece ön tanımlı olanlardan bahsedeceğim. Ön tanımlılara dönecek olursak Fonksiyon Tipte bileşenlerde state kullanımı ya da yaşam döngüsü metodları kullanabilme, doğrudan reducer bloklarına erişebilme, context oluşturma, contextlere erişebilme gibi işleri hızlı ve sancısız yapmamızı sağlıyorlar.

Peki ya State(Durum) Yönetimi?

İşte bu hook metodlarından ,useContext ve useReducer metodları bir veri kümesi oluşturmak ve herhangi bir bileşen içerisinden ulaşabilmek gibi işlemleri bir kaç satır ile yapmamızı sağlıyor tabi bu "bir kaç satır" ifadesi hali hazırda Redux ya da MobX ile uyguluma geliştirmiş olanlar için bir çağrışım yapıyordur.


Bu bölümde

  • Proje Oluşturma ve genel bilesenlerin yazılması

  • EventListener ile klavyeden gelen komutların yakalanması

  • Bir Input alanına girilen metnin belirli kriterlere göre işlenmesi

  • Context yapılarına giriş

    konularını anlatmaya çalıştım.

Sözü daha fazla uzatmadan en iyisi eğitime geçelim.


Ve bir de: ses seviyesi az ama bunun sebebi tamamen mikrofonumun profesyonel olmaması ve profesyonel mikrofonların pahalı olması. :)

Herkese iyi kodlamalar!


NOT: Yeni Udemy yönetmeliğine göre Ücretsiz Eğitimler 2 saatten fazla olamayacak. Bu nedenle Seriyi partlar halinde yayınlanmıştır.

Who this course is for:

  • Front-End developer
  • Arayüz Tasarımcısı
  • Başlangıç Seviye React Geliştiricisi
  • Web Developer

Course content

3 sections12 lectures1h 50m total length
  • Giriş
    03:32
  • Proje Oluşturma ve Temel Bileşenler
    14:41
  • Proje Oluşturma ve Temel Bileşenler - 2
    10:21
  • Bileşenleri Ayırma ve Veri Aktarma
    10:11
  • EventListener ile Klavyeden Gelen Komutları Yakalama
    12:49
  • Girilen Metni Kontrol Etme
    10:35
  • Girilen Metni Kontrol Etme - 2
    12:23
  • Girilen Metni Kontrol Etme - 3
    13:03
  • Skor Kartlarını Oluşturma ve CSS Düzeltmeleri
    12:35

Instructor

Bilgisayar Mühendisi
Mehmet Ali Fırat
  • 4.7 Instructor Rating
  • 234 Reviews
  • 9,101 Students
  • 5 Courses

Lisans Eğitimimi 2015 Erciyes Bilgisayar Mühendisliği bölümünden mezun olarak tamamladım ve şimdilerde Abdullah Gül Üniversitesinde Yüksek Lisans yapmaktayım. Aynı zamanda 2015 yılından beri Full-stack Yazılım Mühendisi olarak aktif olarak çalışmakta ve Masaüstü ve Web Uygulamaları geliştirmekteyim. Yeni teknolojiler öğrenmeyi, öğrendiğini kullanmayı ve kullandırtmayı seven birisiyim; bundandır ki basit cevaplar bekleyen sorulara uzun uzun yeni teknolojilerden bahseder, bu teknolojileri öğretmeye çalışırım etrafımdaki insanlara. Her ne kadar yeni teknolojiler ve üzerine konuşması ve çalışması keyifli güzellikler olsa da bir de ilk göz ağrılarımız başımız sıkıştığında sığındığımız klasiklerimiz vardır. Ben de sıkı bir C# geliştiricisi olarak uygulamaların çoğunu bu dilde geliştirmiş olsam da pek çok kez de hızlıca ve pratik çözümler ortaya koymak için kendimi eli-kolu her şeye uzanan Python'un kapısında buluyorum. Tabi web uygulamalarım için yeni gözdem React ve React Native ile de mobil uygulama ortamı için de küçük de olsa projeler geliştirmekteyim.

Youtube kanalımdanda beni takip etmeyi unutmayın. Fırsat buldukça oradan da ücretsiz eğitimler yayınlamaktayım.

"Happy Coding!" ;)