Die folgenden Bilder zeigen eine dreisprachige, mit drei Beispielseiten erstellte Single-Page React Anwendung. Single-Page, weil die App in der Wirklichkeit nur eine HTML-Seite besitzt. Innerhalb dieser werden alle Ansichten von JavaScript erstellt. Eine typische React-HTML-Seite besitzt im body-Bereich keinen Inhalt. Nur einen leeren <div>-Container, dessen Content zur Laufzeit erstellt und nach Bedarf dynamisch angepasst (gerendert) wird.
![001-React-Example-EN [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/001-React-Example-EN.png)
![002-React-Example-EN [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/002-React-Example-EN.png)
![003-React-Example-EN [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/003-React-Example-EN.png)
![004-React-Example-DE [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/004-React-Example-DE.png)
![005-React-Example-DE [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/005-React-Example-DE.png)
![006-React-Example-DE [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/006-React-Example-DE.png)
![007-React-Example-PL [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/007-React-Example-PL.png)
![008-React-Example-PL [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/008-React-Example-PL.png)
![009-React-Example-PL [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/009-React-Example-PL.png)
Die Seiten sind responsiv, so dass auf einem Smartphone Bildschirm die Bedienleiste hinter dem Menü-Button verschwindet.
![010-React-Example-Small [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/010-React-Example-Small.png)
![011-React-Example-Small [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/03/011-React-Example-Small.png)
Der Quellcode dieses Beispiels kann von GitLab gezogen werden.
War diese Seite für dich informativ? Hat sie dir gefallen und geholfen?
Dann unterstütze die Weiterentwicklung mit einer kleinen Spende!
Die Spenden werden für die Lizenzen sowie neue Hard- und Software verwendet, die für weitere Projekte auf dieser Webseite eingesetzt werden.
