Translation of React - EN to TR - (UC. 0% to 100% - TWP. 1% to 100%) - 515 Words Translated #Part13

in #utopian-io7 years ago (edited)

logo-og.png

REACT

Hello friends,
I have recently finished translating two different sections of React, which is a JavaScrript library. In this contribution, I translated 515 words in total for completing my daily task. I managed to translate the project's Uncontrolled Components section from 0% to 100% and Typechecking With PropTypes section from 1% to 100%. I will keep translating more.

Uncontrolled Components:

In most cases, we recommend using controlled components to implement forms. In a controlled component, form data is handled by a React component. The alternative is uncontrolled components, where form data is handled by the DOM itself.

To write an uncontrolled component, instead of writing an event handler for every state update, you can use a ref to get form values from the DOM.
...

Typechecking With PropTypes:

As your app grows, you can catch a lot of bugs with typechecking. For some applications, you can use JavaScript extensions like Flow or TypeScript to typecheck your whole application. But even if you don't use those, React has some built-in typechecking abilities. To run typechecking on the props for a component, you can assign the special propTypes property.
...

React Main Page in Crowdin:

2018-01-01 (8).png

Before

2018-01-01 (5).png

Typechecking With PropTypes:

2018-01-01 (1).png

During the Translation

2018-01-01 (11).png

2018-01-01 (12).png

After

Uncontrolled Components:

2018-01-01 (3).png

Typechecking With PropTypes:

2018-01-01 (7).png

Conclusion

2018-01-01 (9).png

2018-01-01 (10).png


EN:

Since an uncontrolled component keeps the source of truth in the DOM, it is sometimes easier to integrate React and non-React code when using uncontrolled components. It can also be slightly less code if you want to be quick and dirty. Otherwise, you should usually use controlled components. If it's still not clear which type of component you should use for a particular situation, you might find this article on controlled versus uncontrolled inputs to be helpful.

Default Values
In the React rendering lifecycle, the value attribute on form elements will override the value in the DOM. With an uncontrolled component, you often want React to specify the initial value, but leave subsequent updates uncontrolled. To handle this case, you can specify a defaultValue attribute instead of value. Likewise, <input type="checkbox"> and <input type="radio"> support defaultChecked, and <select> and <textarea> supports defaultValue.

PropTypes exports a range of validators that can be used to make sure the data you receive is valid. In this example, we're using PropTypes.string. When an invalid value is provided for a prop, a warning will be shown in the JavaScript console. For performance reasons, propTypes is only checked in development mode.

The defaultProps will be used to ensure that this.props.name will have a value if it was not specified by the parent component. The propTypes typechecking happens after defaultProps are resolved, so typechecking will also apply to the defaultProps.


TR:
Kontrolsüz bir bileşen, doğruluğun kaynağını DOM'da tuttuğundan, bazen kontrolsüz bileşenleri kullanırken React ve React olmayan kodların entegrasyonu daha kolaydır. Çabuk ve dağınık olmak isterseniz biraz daha az kod da olabilir. Aksi takdirde, genellikle kontrollü bileşenleri kullanmalısınız. Belirli bir durum için hangi bileşeni kullanmanız gerektiği belli değilse, bu kontrollü girişlere karşı kontrolsüz girişler makalesi yardımcı olabilir.

Varsayılan Değerler
Yaşam döngüsünü işleyen React'ta, form öğelerindeki value özniteliği DOM'daki değeri geçersiz kılacaktır. Kontrolsüz bir bileşenle, React'ın genellikle başlangıç değerini belirtmesini ancak sonraki güncellemeleri kontrolsüz bırakmasını istersiniz. Bu durumu işlemek için value yerine bir defaultValue niteliği belirleyebilirsiniz. Aynı şekilde, <input type="checkbox"> ve <input type="radio">, defaultChecked'i; <select> ve <textarea> ise defaultValue niteliğini destekler.

PropTypes, aldığınız verilerin geçerli olduğundan emin olmak için kullanılabilecek bir dizi doğrulayıcıyı dışa aktarır. Bu örnekte, PropTypes.string'i kullanıyoruz. Bir kiriş için geçersiz bir değer verildiğinde, JavaScript konsolunda bir uyarı görüntülenecektir. Performans nedenleriyle propTypes yalnızca geliştirme modunda kontrol edilir.

defaultProps, this.props.name öğesinin üst bileşen tarafından belirtilmemiş olması durumunda bir değere sahip olduğundan emin olmak için kullanılacaktır.defaultProps çözümlendikten sonra propTypes typechecking'i gerçekleşir. Bu nedenle, typechecking defaultProps'a da uygulanır.


Translation Part 1
Translation Part 2
Translation Part 3
Translation Part 4
Translation Part 5
Translation Part 6
Translation Part 7
Translation Part 8
Translation Part 9
Translation Part 10
Translation Part 11
Translation Part 12
Translation Part 13 ==> (You're here!)
Translation Part 14
Translation Part 15
Translation Part 16
Translation Part 17
Translation Part 18
Translation Part 19


Proof Link
My Crowdin Profile
React - Crowdin
React - Github



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Free vote for you! Yay!

Thanks!

Thank you.

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

Hey @sym I am @utopian-io. I have just upvoted you!

Achievements

  • You have less than 500 followers. Just gave you a gift to help you succeed!
  • Seems like you contribute quite often. AMAZING!

Suggestions

  • Contribute more often to get higher and higher rewards. I wish to see you often!
  • Work on your followers to increase the votes/rewards. I follow what humans do and my vote is mainly based on that. Good luck!

Get Noticed!

  • Did you know project owners can manually vote with their own voting power or by voting power delegated to their projects? Ask the project owner to review your contributions!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x