diff --git a/content/docs/nav.yml b/content/docs/nav.yml index 3cb1a4960..a91db8e77 100644 --- a/content/docs/nav.yml +++ b/content/docs/nav.yml @@ -62,7 +62,7 @@ - id: react-without-es6 title: React Without ES6 - id: react-without-jsx - title: React Without JSX + title: React بدون JSX - id: reconciliation title: Reconciliation - id: refs-and-the-dom diff --git a/content/docs/react-without-jsx.md b/content/docs/react-without-jsx.md index 85cdba45f..193d2da12 100644 --- a/content/docs/react-without-jsx.md +++ b/content/docs/react-without-jsx.md @@ -1,14 +1,14 @@ --- id: react-without-jsx -title: React Without JSX +title: React بدون JSX permalink: docs/react-without-jsx.html --- -JSX is not a requirement for using React. Using React without JSX is especially convenient when you don't want to set up compilation in your build environment. +JSX ليست متطلب لإستخدام React .حيث يمكنك إستخدام React بدون JSX بشكل خاص عندما لاترغب في إعداد مرحلة التصريف في بيئة البناء لديك. -Each JSX element is just syntactic sugar for calling `React.createElement(component, props, ...children)`. So, anything you can do with JSX can also be done with just plain JavaScript. +كل عنصر من JSX هو فقط تجميل صياغي لمناداة الداله `React.createElement(component, props, ...children)`. اذاً، أي شيء يمكن تطبيقه باستخدام JSX من الممكن ايضاً تطبيقه بإستخدام javascript. -For example, this code written with JSX: +كمثال، هذه الشيفرة مكتوبه باستخدام JSX: ```js class Hello extends React.Component { @@ -23,7 +23,7 @@ ReactDOM.render( ); ``` -can be compiled to this code that does not use JSX: +وتصرف الى شيفرة على النحو التالي بدون JSX: ```js class Hello extends React.Component { @@ -38,11 +38,11 @@ ReactDOM.render( ); ``` -If you're curious to see more examples of how JSX is converted to JavaScript, you can try out [the online Babel compiler](babel://jsx-simple-example). +إذا كنت مهتماً لرؤية المزيد من الامثلة عن كيفية تصريف شيفرة JSX الى javascript, فبإمكانك تجربة [مصرف Babel على الإنترنت](babel://jsx-simple-example). -The component can either be provided as a string, or as a subclass of `React.Component`, or a plain function for stateless components. +يمكن تزويد المكون كسلسلة نصية, أو كصنف فرعي من `React.Component`، أو كدالة مجردة من أجل المُكونات بدون الحالة. -If you get tired of typing `React.createElement` so much, one common pattern is to assign a shorthand: +إن تعبت من كثرة كتابة `React.createElement`، فمن الأساليب الشائعة هي الطريقة المختصرة التالية: ```js const e = React.createElement; @@ -53,7 +53,7 @@ ReactDOM.render( ); ``` -If you use this shorthand form for `React.createElement`, it can be almost as convenient to use React without JSX. +إذا إستخدمت هذه الصيغة المختصرة (الثابت e) لأجل `React.createElement`، فسيكون من المناسب تمامًا استخدام React بدون JSX. -Alternatively, you can refer to community projects such as [`react-hyperscript`](https://github.com/mlmorg/react-hyperscript) and [`hyperscript-helpers`](https://github.com/ohanhi/hyperscript-helpers) which offer a terser syntax. +بدلاً من ذلك، تستطيع الرجوع إلى مشاريع مجتمع React مثل [`react-hyperscript`](https://github.com/mlmorg/react-hyperscript) و [`hyperscript-helpers`](https://github.com/ohanhi/hyperscript-helpers) والتي توفر صياغة مختصرة أكثر. diff --git a/content/docs/reference-react.md b/content/docs/reference-react.md index 35e0baae1..874a0c18e 100644 --- a/content/docs/reference-react.md +++ b/content/docs/reference-react.md @@ -38,7 +38,7 @@ redirect_from: - [`createElement()`](#createelement) - [`createFactory()`](#createfactory) -See [Using React without JSX](/docs/react-without-jsx.html) for more information. +إنظر في [إستخدام React بدون JSX](/docs/react-without-jsx.html) للمزيد من المعلومات. ### تحويل العناصر {#transforming-elements}