diff --git a/content/docs/react-without-jsx.md b/content/docs/react-without-jsx.md index 85cdba45f..211ed8c20 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 ohne 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 ist keine Voraussetzung für die Benutzung von React. Besonders praktisch ist der Verzicht auf JSX dann, wenn man in seiner Entwicklungsumgebung keine Kompilierung durchführen möchte. -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. +Jedes JSX Element ist eigentlich nur "syntactic sugar" für den Aufruf von `React.createElement(component, props, ...children)`. Dementsprechend kannst du alles, was mit JSX möglich ist, auch in einfachem Javascript umsetzen. -For example, this code written with JSX: +Als Beispiel, dieser Code in JSX: ```js class Hello extends React.Component { @@ -23,7 +23,7 @@ ReactDOM.render( ); ``` -can be compiled to this code that does not use JSX: +kann in diesen Code kompiliert werden, welcher kein JSX benutzt. ```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). +Wenn du neugierig auf weitere Beispiele bist, bei denen JSX in Javascript konvertiert wird, dann probiere gerne den [online Babel-Compiler](babel://jsx-simple-example) aus. -The component can either be provided as a string, or as a subclass of `React.Component`, or a plain function for stateless components. +Die Komponente kann der Funktion entweder als String, als Unterklasse von `React.Component` oder als zustandslose (engl. stateless) Komponente in Form einer einfachen Funktion zur Verfügung gestellt werden. -If you get tired of typing `React.createElement` so much, one common pattern is to assign a shorthand: +Solltest du das häufige Tippen von `React.createElement` satt haben, ist ein gängiges Pattern, eine Kurzform zuzuweisen: ```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. +Wenn du mit dieser Kurzform von `React.createElement` arbeitest, ist es fast genauso bequem React ohne JSX zu benutzen. -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. +Als weitere Möglichkeit kannst du dich auf Community-Projekte, wie etwa [`react-hyperscript`](https://github.com/mlmorg/react-hyperscript) und [`hyperscript-helpers`](https://github.com/ohanhi/hyperscript-helpers) beziehen, welche eine kürzere Syntax zur Verfügung stellen.