Learning React

Build beautiful, modern, and modularized UIs with React’s latest version

Want to make the process of building modular, reusable user interface components simple and intuitive? React.js is the answer, with its Learn Once, Write Anywhere approach. This course will help you understand the power behind this approach and build beautiful, modern, and modularized UIs with React’s latest version.

This course will cover all of the React.js basics such as its API, which will help you create elements and components; the virtual DOM and the JSX syntax extension; using state; working with browser events; and component lifecycle methods. You will build an application from scratch throughout the course and use the knowledge you've gained in a practical way. You will also learn to update various elements of a site or application seamlessly without delay, without disrupting the rest of the display or requiring the user to refresh. Also, get introduced to the new concept of hooks.. Finally, you will work with a server API to persist data using local storage.?(Note that we use Node.js 10.13.0 for this course, which will run successfully with the React features we cover.)

By the end of the course, you will be fully capable of using ReactJ.js tools to build several UI elements, making them reactive to user input, and extending your knowledge of DOM manipulation to customize your own UIs in the future.

The Github repo for this course is: https://github.com/PacktPublishing/Learning-React

Who this course is for

If you are a web developer, JavaScript developers and want to learn and build front-end of your web applications with modernized UI, then this is the course you need!Web Developers and Programmers who want to learn React.js by taking an engaging, step-by-step approach, will benefit from this course.

What you will learn from this course


Table of Contents

  1. Introduction to the World of React
    • The Course Overview
    • Thinking in React
    • Start Using React Right away
    • Local React Dev Environment Setup with create-react-app
    • Building Our First Custom React Component
    • Using State and Conditional Rendering in JSX
    • Using React Dev Tools to Help Build and Debug Our Apps

  2. Dive into Interactive React Apps
    • Handle Mouse, Keyboard, Form, and Browser Events
    • Basic Form Validation
    • Create a Shopping List Component
    • Persist Shopping List State with Local Storage

  3. Modular React Components and Shared State
    • Overview:Mini Address Book App
    • Use Stateful and Stateless Components to Build UIs
    • Pass Props Down to Nested Components
    • Update Parent Component State from a Child Component
    • Persist Address Book State with Local Storage
    • Intro to Hooks
    • Implement the useState and useEffect

  4. Multi-Page React Apps with React Router
    • Overview: Multi-Page React App
    • React Router 5 Setup and Configuration
    • Handle Dynamic URL Values, and Error State
    • Convert Render Props into Components
    • Conditionally Render Components, Redirects

  5. Fetch Data from Third-Party APIs
    • Overview: React App + Star Wars API
    • Fetch DATA from swapi.co
    • Extract Logic into Separate Components
    • Fetch Data Based on URL/Route
    • Persist API Data in Local Storage

  6. Prepare and Deploy React Apps to Production
    • Build React App to Optimize for Production
    • Deploy to Netlify: Drag and Drop
    • Deploy to Netlify: Command Line
    • Deploy to Netlify: Continuous Deployment
    • What’s Next? Eject from CRA, More Hosting Options

Copyright © 2019 Packt Publishing

All rights reserved. No part of this course may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews. Every effort has been made in the preparation of this course to ensure the accuracy of the information presented. However, the information contained in this course is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this course. Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this course by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

Livery Place
35 Livery Street
Birmingham B3 2PB, UK.
ISBN 978-1-78961-268-4

www.packtpub.com