Bu eşleştirme ekran video kaydında Sarah Drasner bana katılıyor ve React ile ilgili ilk öğrendiklerimden bazılarında bana rehberlik ediyor. Bazı "gerçek dünya" tarzı işlevselliği ele alıyoruz: bir yorum formu.
Bu, React için oldukça temel olan pek çok şey gerektirdiğinden (veya en azından bana öyle göründüğü için) çalışmak için oldukça kullanışlı bir kullanıcı arayüzü olduğu ortaya çıktı. Örneğin, state(bizim büyük "durumumuz" yorumların kendisidir) ve görünümü oluşturmayla ilgilenen bileşenlerle (örneğin, yorum formu bir bileşendir ve her yorum bir bileşendir) ilgilenen bir ana "Uygulama" .
Sonra çok daha küçük React şeylerine, ama aynı zamanda React-land'de anlaşılması gereken devasa şeylere de girdik, örneğin:
props- bileşenler arasında veri aktarmanın bir yolu. Gönderdiğinizde HTML niteliklerine benziyorlar ve this.props biçiminde bir nesne olarak ulaşıyorlar.refs- oluşturduğumuz form öğesinden verileri nasıl yakaladığınız.keys- Bir bileşeni tekrarlandığında benzersiz şekilde tanımlamanın bir yolu. Burada yorumları tekrarlıyoruz (birden fazla yorum olabilir), bu nedenle herhangi birini değiştirebilecek bir işlevselliğe sahip olsaydık, React'i verimli kılan şey bir anahtara sahip olmaktır (hepsi yerine sadece o tek yorumun yerini alabilir) .
Artı bir ton daha!
İşte üzerinde çalıştığımız demo:
CodePen'de Chris Coyier (@chriscoyier) tarafından yazılan React-Powered Yorum Formunu Başlatan Kalem'e bakın.
React öğreniminizi bunun ötesinde nasıl yükseltirsiniz? Buradan başlayın.