React Navigation Nasıl Kurulur?

React Native ile bir mobil uygulama geliştiriyorsak ve uygulamamızda birden fazla ekranımızın olmasını istiyorsak işler birazcık karışıyor. İki veya daha fazla ekranın birbirleri arasında iletişim kurmasını, sayfalar arası geçişi sağlayan bazı kütüphaneler mevcut. Ben bu yazımda en popüleri olan React Navigation kurulumundan bahsedeceğim.

Öncelikle ReactNavigation adında yeni bir proje oluşturdum. (Proje oluşturmak için gerekli bilgiye buradan ulaşabilirsiniz.) Eğer mevcut bir projeniz varsa bu kısmı atlayıp kurulumu oraya da yapabilirsiniz.

I. ADIM

React Navigation’ı projemize kurmak için aşağıdaki komutu terminalde çalıştırmalıyız.

npm install @react-navigation/native

II. ADIM

I. adım tamamlandıktan sonra ise projeye birkaç kütüphane daha eklememiz gerekiyor. Projenizde Expo kullanıyorsanız ilk komutu, kullanmıyorsanız ikinci komutu terminale yazarak gerekli kütüphanelerin hepsini kuralım. (Eğer bu kütüphaneler zaten projenizde yüklüyse ve son sürümdeyse bu adımı atlayın!)

Expo kullanıyorsanız:

expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view

Expo kullanmıyorsanız:

npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view

III. ADIM

React Native sürümünüz 0.60'ın altındaysa aşağıdaki komutu çalıştırmanız gerekiyor. Fakat React Native’in 0.60 ve üstü sürümlerinde linkleme işlemi otomatik yapıldığından dolayı bu komutu çalıştırmanıza gerek yok. (React Native sürümüzünü öğrenmek için projenizin package.json dosyasına bakabilirsiniz.)

react-native link

Eveet son olarak, Mac kullanıyorsanız ve iOS için geliştirme yapıyorsanız linklemelerin tamamlanması için aşağıdaki komutu çalıştırın.

npx pod-install ios

Üç adımda React Native projemize React Navigation kurulumunu tamamladık. Bu kütüphanenin nasıl kullanıldığını öğrenmek için bir sonraki yazıma buradan ulaşabilirsin.