React Router ipliğiyle ilgili temel sorun, doğru şekilde yapılandırmanın zor olabilmesidir. Çok fazla kurulum ve yapılandırma gerektirir ve yanlış yapılırsa beklenmeyen davranışlara veya hatalara yol açabilir. Ek olarak, React Router yarn belgeleri her zaman net veya güncel değildir, bu da geliştiricilerin sorunları gidermesini zorlaştırır.
add react-router-dom
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
<Router>
<div>
<ul>
<li><Link to="/">Home</Link></li>
<li><Link to="/about">About</Link></li>
<li><Link to="/topics">Topics</Link></li>
</ul>
<hr />
<Route exact path="/" component={Home} />
<Route path="/about" component={About} />
<Route path="/topics" component={Topics} />
</div>
</Router>
1. Bu satır, tepki-yönlendirici-dom kitaplığından BrowserRouter, Route ve Link bileşenlerini içe aktarır:
{ BrowserRouter as Router, Route, Link } “react-router-dom”dan içe aktarın;
2. Bu satır, yönlendirme işlevselliği sağlamak için tüm uygulamayı bir Yönlendirici bileşenine sarar:
3. Bu div öğesi, farklı rotalar arasında gezinmek için kullanılacak bağlantıların bir listesini içerir:
- Ana Sayfa
- Hakkımızda
- Konular
4. Bu hr öğesi, navigasyon bağlantıları ve rota içeriği arasında görsel bir ayırıcı olarak kullanılır:
5. Bu satırlar, React Router'ın Route bileşenini kullanan uygulamamız için üç farklı rota tanımlar:
6. Son olarak, bu kapanış div etiketi, uygulama sarmalayıcı div öğemizi kapatır:
React Router nedir?
React Router, geliştiricilerin React uygulamalarında rotalar oluşturmasına ve yönetmesine olanak tanıyan bir React yönlendirme kitaplığıdır. Güzergahları bileşenlere bildirimsel olarak eşlemek, URL parametrelerini işlemek ve gezinme olaylarını yönetmek için bir yol sağlar. Ayrıca dinamik rota eşleştirme, konum geçişi işleme ve kaydırma geri yükleme gibi özellikler de sağlar.
İplik Nedir?
Yarn, geliştiricilerin bağımlılıklarını daha verimli ve güvenli bir şekilde yönetmelerine yardımcı olan bir JavaScript paket yöneticisidir. Paketleri yüklemek, güncellemek ve yapılandırmak için React Router tarafından kullanılır. Yarn ayrıca geliştiricilerin projelerinin bağımlılıklarını takip etmelerine yardımcı olarak gerekli tüm paketlerin kurulu ve güncel olmasını sağlar. Bu, her biri hangi paket sürümlerini kullanmaları gerektiğini kolayca kontrol edebildiğinden, birden çok geliştiriciyle projeler üzerinde çalışmayı kolaylaştırır.
