Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update react-without-jsx.md #92

Merged
merged 3 commits into from
Nov 2, 2020
Merged

Update react-without-jsx.md #92

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f784331
Update react-without-jsx.md
Oct 29, 2020
bbed78a
Apply suggestions from code review
RichardOtvos Nov 2, 2020
bcaf9f1
Add missing line breaks.
Nov 2, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 10 additions & 11 deletions content/docs/react-without-jsx.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
id: react-without-jsx
title: React Without JSX
title: React JSX nélkül
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.
Nem kötelező a JSX-et választani, ha Reactet használsz. A React JSX nélkül különösen hasznos, ha nem akarsz külön fordítási lépést létrehozni a build környezetedben.

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.
Minden egyes JSX elem csak egy rövidítés a `React.createElement(component, props, ...children)` metódus hívására. Így, mindent amit JSX-szel le tudsz írni, meg tudod csinálni JSX nélkül is, sima JavaScriptet használva.

For example, this code written with JSX:
Például, ez a JSX-szet használó kódrészlet:

```js
class Hello extends React.Component {
Expand All @@ -23,7 +23,7 @@ ReactDOM.render(
);
```

can be compiled to this code that does not use JSX:
átírható a következő, JSX-szet nem használó kódra:

```js
class Hello extends React.Component {
Expand All @@ -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).
Próbáld ki [az online Babel fordítót](babel://jsx-simple-example), ha szeretnél több példát látni rá, hogyan alakítjuk át a JSXet JavaScriptté.
balazsorban44 marked this conversation as resolved.
Show resolved Hide resolved

The component can either be provided as a string, as a subclass of `React.Component`, or a plain function.
A komponens megadható sztringként, a `React.Component` alosztályaként vagy egy sima függvényként.

If you get tired of typing `React.createElement` so much, one common pattern is to assign a shorthand:
Ha úgy érzed, hogy túl időigényes mindig kigépelni a `React.createElement`-et, egy gyakori megoldás, a függvény egy rövidítéshez rendelése:

```js
const e = React.createElement;
Expand All @@ -53,7 +53,6 @@ ReactDOM.render(
);
```

If you use this shorthand form for `React.createElement`, it can be almost as convenient to use React without 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.
A `React.createElement`-nek ezt a rövidített formáját használva, már sokkal kényelmesebb React kódot írni, még JSX nélkül is.

Ha inkább más alternatív megoldást keresel, nézz bele a közösségi projektbe mint amilyen a [`react-hyperscript`](https://github.com/mlmorg/react-hyperscript) és a [`hyperscript-helpers`](https://github.com/ohanhi/hyperscript-helpers) amik segíthetnek tömörebb kódot írni.