Beginning ReactJS Foundations Building User Interfaces with ReactJS
eBook - ePub

Beginning ReactJS Foundations Building User Interfaces with ReactJS

An Approachable Guide

Chris Minnick

  1. English
  2. ePUB (handyfreundlich)
  3. Über iOS und Android verfügbar
eBook - ePub

Beginning ReactJS Foundations Building User Interfaces with ReactJS

An Approachable Guide

Chris Minnick

Angaben zum Buch
Buchvorschau
Inhaltsverzeichnis
Quellenangaben

Über dieses Buch

Quickly learn the most widely used front-end development language with ease and confidence

React JS Foundations: Building User Interfaces with ReactJS - An Approachable Guide walks readers through the fundamental concepts of programming with the explosively popular front-end tool known as React JS.

Written by an accomplished full-stack engineer, speaker, and community organizer, React JS Foundations teaches readers how to understand React and how to begin building applications with it. The book:

  • Explains and clarifies technical terminology with relevant and modern examples to assist people new to programming understand the language
  • Helps experienced programmers quickly get up to speed with React
  • Is stocked throughout with practical and applicable examples of day-to-day React work

Perfect for beginner, intermediate, and advanced programmers alike, React JS Foundations will quickly bring you up to speed on one of the most useful and widely used front-end languages on the web today. You can start building your first application today.

Häufig gestellte Fragen

Wie kann ich mein Abo kündigen?
Gehe einfach zum Kontobereich in den Einstellungen und klicke auf „Abo kündigen“ – ganz einfach. Nachdem du gekündigt hast, bleibt deine Mitgliedschaft für den verbleibenden Abozeitraum, den du bereits bezahlt hast, aktiv. Mehr Informationen hier.
(Wie) Kann ich Bücher herunterladen?
Derzeit stehen all unsere auf Mobilgeräte reagierenden ePub-Bücher zum Download über die App zur Verfügung. Die meisten unserer PDFs stehen ebenfalls zum Download bereit; wir arbeiten daran, auch die übrigen PDFs zum Download anzubieten, bei denen dies aktuell noch nicht möglich ist. Weitere Informationen hier.
Welcher Unterschied besteht bei den Preisen zwischen den Aboplänen?
Mit beiden Aboplänen erhältst du vollen Zugang zur Bibliothek und allen Funktionen von Perlego. Die einzigen Unterschiede bestehen im Preis und dem Abozeitraum: Mit dem Jahresabo sparst du auf 12 Monate gerechnet im Vergleich zum Monatsabo rund 30 %.
Was ist Perlego?
Wir sind ein Online-Abodienst für Lehrbücher, bei dem du für weniger als den Preis eines einzelnen Buches pro Monat Zugang zu einer ganzen Online-Bibliothek erhältst. Mit über 1 Million Büchern zu über 1.000 verschiedenen Themen haben wir bestimmt alles, was du brauchst! Weitere Informationen hier.
Unterstützt Perlego Text-zu-Sprache?
Achte auf das Symbol zum Vorlesen in deinem nächsten Buch, um zu sehen, ob du es dir auch anhören kannst. Bei diesem Tool wird dir Text laut vorgelesen, wobei der Text beim Vorlesen auch grafisch hervorgehoben wird. Du kannst das Vorlesen jederzeit anhalten, beschleunigen und verlangsamen. Weitere Informationen hier.
Ist Beginning ReactJS Foundations Building User Interfaces with ReactJS als Online-PDF/ePub verfügbar?
Ja, du hast Zugang zu Beginning ReactJS Foundations Building User Interfaces with ReactJS von Chris Minnick im PDF- und/oder ePub-Format sowie zu anderen beliebten Büchern aus Design & UI/UX Design. Aus unserem Katalog stehen dir über 1 Million Bücher zur Verfügung.

Information

Verlag
Wiley
Jahr
2022
ISBN
9781119685586
Auflage
1
Thema
Design
Thema
UI/UX Design

1
Hello, World!

Since the beginning of time, the first program anyone learns to build in any new programming language is a program that displays the words “Hello, World.” Of course, the words here aren't important, and I would encourage you to choose any words you like to replace this cliché phrase. The point of this chapter is to quickly build up your understanding of how React works by using a simple and inconsequential program. But, don't be deceived—the foundational tools and techniques that you learn about in this chapter are essential to learning React. If you only read one chapter of this book, this would be the one. In this chapter, you'll learn:
  • How to use React without a toolchain.
  • How to write your first React application.
  • How to make and modify a React application built with Create React App.

REACT WITHOUT A BUILD TOOLCHAIN

Most React application development uses a build toolchain (such as the one created by Create React App) running in Node.js as its foundation. It is possible, however, to include React in an existing website or to build a website that makes use of React by just importing a couple of scripts into a web page. You can even use React code alongside JavaScript code written using another library or framework.
Follow these steps to make an HTML page and to add React to it:
  1. Create a new folder in your Documents folder and open it in Visual Studio Code.
  2. Open the Command Palette (Command+Shift+P on MacOS or Control+Shift+P on Windows) and run the File: New File command, or select File ➪ New File from the top menu.
  3. Save your new file as index.html.
  4. Type ! followed by the Tab key to generate an HTML template using emmet. If you prefer, you can also type the following code into your new blank file: 
    <!DOCTYPE html> <html lang="en"> <head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1.0">  <title>Hello, React!</title> </head> <body>   </body> </html>
  5. Between the <body> and </body> tags, create an empty div element and give it an id attribute with the value of app. This is where you're going to tell React to render its output. In the React world, we call this the container element. The actual id value doesn't matter here, but app is a simple, easy to remember, and meaningful value that is very commonly used.
    NOTE You can put a React container element anywhere inside the body element of a web page.
  6. Go to https://reactjs.org/docs/cdn-links.html in your browser and find the script tags for including React and ReactDOM from a content delivery network (CDN), as shown in Figure 1-1.
  7. Copy both script tags and paste them right before the </body> tag in index.html.
    NOTE The reason these must go at the end of the body of your web page is that they can make changes to your web page. Because of the way JavaScript loads and then executes immediately after it loads, the browser will show an error message if your React code is loaded and executed before the container element is loaded.
    The first script, react.development.js, is the actual React library that handles the rendering of React components, the flow of data between components, responding to events, and all of the func...

Inhaltsverzeichnis

  1. COVER
  2. TABLE OF CONTENTS
  3. TITLE PAGE
  4. INTRODUCTION
  5. 1 Hello, World!
  6. 2 The Foundation of React
  7. 3 JSX
  8. 4 All About Components
  9. 5 React DevTools
  10. 6 React Data Flow
  11. 7 Events
  12. 8 Forms
  13. 9 Refs
  14. 10 Styling React
  15. 11 Introducing Hooks
  16. 12 Routing
  17. 13 Error Boundaries
  18. 14 Deploying React
  19. 15 Initialize a React Project from Scratch
  20. 16 Fetching and Caching Data
  21. 17 Context API
  22. 18 React Portals
  23. 19 Accessibility in React
  24. 20 Going Further
  25. INDEX
  26. COPYRIGHT
  27. DEDICATION
  28. ABOUT THE AUTHOR
  29. ABOUT THE TECHNICAL EDITOR
  30. ACKNOWLEDGMENTS
  31. END USER LICENSE AGREEMENT
Zitierstile für Beginning ReactJS Foundations Building User Interfaces with ReactJS

APA 6 Citation

Minnick, C. (2022). Beginning ReactJS Foundations Building User Interfaces with ReactJS (1st ed.). Wiley. Retrieved from https://www.perlego.com/book/3259187/beginning-reactjs-foundations-building-user-interfaces-with-reactjs-an-approachable-guide-pdf (Original work published 2022)

Chicago Citation

Minnick, Chris. (2022) 2022. Beginning ReactJS Foundations Building User Interfaces with ReactJS. 1st ed. Wiley. https://www.perlego.com/book/3259187/beginning-reactjs-foundations-building-user-interfaces-with-reactjs-an-approachable-guide-pdf.

Harvard Citation

Minnick, C. (2022) Beginning ReactJS Foundations Building User Interfaces with ReactJS. 1st edn. Wiley. Available at: https://www.perlego.com/book/3259187/beginning-reactjs-foundations-building-user-interfaces-with-reactjs-an-approachable-guide-pdf (Accessed: 15 October 2022).

MLA 7 Citation

Minnick, Chris. Beginning ReactJS Foundations Building User Interfaces with ReactJS. 1st ed. Wiley, 2022. Web. 15 Oct. 2022.