React Tutorial 2023 49 – useContext Hook’u 3 – Context API Nedir?

Merhabalar.

useContext Hook’unun kullanımına geçmeden önce son bir kavram kaldı o da Context API mantığını anlamak.

React Context API, React uygulamalarında veri paylaşımını kolaylaştıran bir kavramdır. Bu API, bir bileşen ağacı içinde paylaşılan verilere erişimi sağlar, böylece verileri props (özellikler) aracılığıyla bir bileşenden diğerine iletmek zorunda kalmazsınız.

React uygulamalarında, genellikle verileri bir üst bileşenden diğer alt bileşenlere iletmek amacıyla props kullanılır. Ancak, uygulama büyüdükçe ve veri iletilmesi gereken bileşen sayısı arttıkça, bu yöntem yönetilemez hale gelebilir. İşte burada Context API devreye girer.

Context API, bir tür global depo gibi düşünülebilir. Bunu kullanarak, belirli bir bileşenin altındaki tüm bileşenlere erişebilecekleri bir konteyner sağlayabilirsiniz. Bu, özellikle uygulama genelinde paylaşılan durum bilgileri gibi verilerin yönetimi için kullanışlıdır.

Context API, createContext, Provider, ve Consumer olarak adlandırılan üç ana bileşeni içerir. createContext ile bir bağlam oluşturulur, Provider ile bu bağlamı kullanarak paylaşmak istediğiniz verileri belirli bir bileşen ağacında paylaşırsınız ve Consumer ile bu verilere erişebilirsiniz.

Bu sayede, veriyi props zinciri boyunca iletmek zorunda olmadan, herhangi bir bileşenin ihtiyaç duyduğu verilere erişebilirsiniz. Context API, özellikle tema, oturum durumu veya kullanıcı yetkilendirmesi gibi global durumların yönetimi için kullanılır.

Mantığı anladıysak bir sonraki yazımda görüşmek üzere. Uygulamalı olarak daha detaylı ele alacağım.