React sitenizi mümkün olduğunca hızlı ve erişilebilir hâle getirmek mi istiyorsunuz? Doğru yere geldiniz.
React, kullanıcı arayüzleri oluşturmayı kolaylaştıran açık kaynak bir kitaplıktır. Bu öğrenme yolunda, ekosistemdeki farklı API'ler ve araçlar ele alınmaktadır. Bu API'leri ve araçları kullanarak uygulamanızın performansını ve kullanılabilirliğini artırabilirsiniz.
Bu kılavuzda, React uygulamasını nasıl oluşturacağınız ve kullanacağınız açıklanmaktadır. Bu bölümdeki diğer tüm kılavuzlarda, React uygulamasının hızını veya erişilebilirliğini optimize etmeyle ilgili konular ele alınır.
Bu neden yararlı?
Hızlı ve güvenilir uygulamaların nasıl oluşturulacağını açıklayan birçok içerik olsa da hızlı ve güvenilir React uygulamalarının nasıl oluşturulacağını gösteren çok fazla içerik yoktur. Bu kılavuzlarda, yalnızca React ekosistemine özgü kitaplıklar, API'ler ve özelliklerden bahsedilerek tüm bu konular React uygulaması açısından ele alınır.
Neler öğreneceksiniz?
Bu öğrenme yolundaki eğitimlerde aşağıdaki konulara odaklanılmaz:
- React'i kullanma
- React'in işleyiş şekli
Bu iki kavrama gerektiğinde değinilecek olsa da bu bölümdeki tüm kılavuzlarda ve kod laboratuvarlarında, hızlı ve erişilebilir React siteleri oluşturmaya odaklanılır. Bu nedenle, React hakkında temel düzeyde bilgi sahibi olmanız gerekir.
Create React App
Create React App (CRA), React uygulamaları oluşturmaya başlamanın en kolay yoludur. Modül paketleyici (webpack) ve derleyici (Babel) içeren bir derleme sistemi de dahil olmak üzere birçok temel özelliğin yerleşik olduğu varsayılan bir kurulum sağlar.
Komut satırı kabuğunda yeni bir uygulama oluşturmak için aşağıdakileri çalıştırmanız yeterlidir:
npx create-react-app app-name
Komut çalıştırıldıktan sonra aşağıdaki komutları kullanarak uygulamaya gidip uygulamayı çalıştırabilirsiniz:
cd new-app
npm start
Aşağıdaki yerleşik kodda, yeni başlatılmış bir CRA uygulamasının dizin yapısı ve gerçek web sayfası gösterilmektedir.
CRA'nın, test için temel bir Jest kurulumu içeren bir webpack ve Babel derleme işlemi oluşturmak için kullandığı birden fazla yapılandırma dosyası ve derleme komut dosyası vardır. Kullanıcının işini kolaylaştırmak için bu dosyalar gizlidir ve CRA'dan ayrılmadan erişilemez. Mümkün olduğunda çıkarma işlemini yapmaktan kaçının. Bu işlem, tüm yapılandırma dosyalarını kendi kaynak kodunuz olarak almanız anlamına gelir ve bu da yönetimi zorlaştırabilir.
Yeni bir CRA uygulamasının dizin yapısı yalnızca uygulamanızda çalışmak için gerçekten değiştirmeniz gereken dosyaları içerir. Bu konu CRA dokümanlarında ayrıntılı olarak açıklanmıştır.
Sırada ne var?
Create React App oluşturmaya nasıl başlayacağınızı öğrendiğinize göre, bu eğitim yolundaki tüm kılavuzlardan yararlanarak uygulamanızın performansını ve erişilebilirliğini nasıl iyileştireceğinizi öğrenin: