oguzzkilic
commented
6 years ago Selamlar,
Create-React-App facebook tarafından geliştirilmiş zero-configuration yapısına sahip bir boilerplate. Boilerplate'ler içerisinde bir çok konfigürasyonla beraber gelirler. Bu sayede hızlıca geliştirme yapmaya başlayabiliyoruz.
src içerisinden bahsedelim;
src/index.js
bu dosya react uygulaması ayağa kalktığında(çalıştığında) ilk görülen dosya. Burada public/index.html içerisinde react uygulamasının hangi div içerisine append edilerek çalıştırılacağını belirleyen kısım bulunuyor.
ReactDOM.render(<App />, document.getElementById('root');
dediğimiz satır index.html içerisindeki <div id="root"></div> içerisinde çalıştır anlamına geliyor.
Senin tüm uygulaman <App /> component'inin içerisine include olmalı.
App.js'in içerisine baktığında component'ı görebilirsin. Default haliyle bu şekilde geliyor ancak biz App'i layout olarak düşünüp react-router ekleyerek şu route ile match olduğunda şu component'imi yükle diyoruz ve sonuç olarak her route değişiminde include olan component'ler App içerisine include olduğu için tüm uygulamanı App.js yönetmiş oluyor.
Varsayılan haliyle direkt olarak uygulama geliştirmen sağlıklı olmaz. Biz bunun için src içerisinde ufak bir folder structure yaratıyoruz.
- components
- containers
- pages
- layouts => App.js
gibi gibi. Aslında her şey bir component sadece hiyerarşik isimlendirmeler ile katmanlara bölüyoruz. En ufak birim component, bir kaç component'ın birleşip bir araya geldiği kümeler container, ve daha sonra hepsinin kapsandığı bir page yapısı kurmalısın.
Örnek olarak şu repository'i inceleyebilirsin;
Sevgiler, Oğuz.
Merhaba Oğuz,
Öncelikle medium üzerinde yayınladığın "Modern Front-End Yaklaşımı" yazın için çok teşekkür ederim, aklımdaki birçok sorunun cevabını buldum. Deneme projesi olarak bir hello world düzeyinde bir proje yapıyorum proje dediysem öyle geniş çaplı birşey değil react'ın çalışma mantığını anlayabileceğim bir hello world projesi :) ancak yaptıklarımın doğru mu yoksa yanlış mı olduğunu bilemiyorum.Bu konuda bana yardım edebilir misin?
node js kurulu bilgisayarımda, aşağıdaki gibi projeyi oluşturuyorum.
npm install create-react-app create-react-app deneme cd deneme npm start
bu projede public ve src şeklinde klasörlerim bulunuyor publicdeki index.html'in bildiğimiz static html olduğunu anladım ama src klasörü içerisindeki mantığı tam anlayamadım componenti neye göre oluşturuyoruz, hangi dosyada işliyoruz bunu bir türlü oturtamadım.
Şimdiden yardımının için teşekkür ederim.Yazın içinde tekrardan teşekkürler :)