0

Explore Products

Best Sellers

New Releases

Books

Videos

Audiobooks

Free Learning

React and React Native

You're reading from React and React Native Build cross-platform JavaScript and TypeScript apps for the web, desktop, and mobile

Product type Paperback

Published in Apr 2024

Publisher Packt

ISBN-13 9781805127307

Length 508 pages

Edition 5th Edition

Languages

JavaScript

Tools

React

Concepts

Front End Web Development

Authors (3):

Adam Boduch

Mikhail Sakhniuk

Roy Derks

View More author details

Table of Contents (33) Chapters

Preface

1. Part I: React

2. Why React? FREE CHAPTER

3. Rendering with JSX

4. Understanding React Components and Hooks

5. Event Handling in the React Way

6. Crafting Reusable Components

7. Type-Checking and Validation with TypeScript

8. Handling Navigation with Routes

9. Code Splitting Using Lazy Components and Suspense

10. User Interface Framework Components

11. High-Performance State Updates

12. Fetching Data from a Server

13. State Management in React

14. Server-Side Rendering

15. Unit Testing in React

16. Part II: React Native

17. Why React Native?

18. React Native under the Hood

19. Kick-Starting React Native Projects

20. Building Responsive Layouts with Flexbox

21. Navigating Between Screens

22. Rendering Item Lists

23. Geolocation and Maps

24. Collecting User Input

25. Responding to User Gestures

26. Showing Progress

27. Displaying Modal Screens

28. Using Animations

29. Controlling Image Display

30. Going Offline

31. Other Books You May Enjoy

32. Index

Code Splitting Using Lazy Components and Suspense

Code splitting has been a significant part of React applications for many years, even before official support was included in the React API. The evolution of React has brought about APIs that are specifically designed to assist in code-splitting scenarios. Code splitting becomes crucial when dealing with large applications containing a vast amount of JavaScript code that needs to be delivered to a browser.

In the past, monolithic JavaScript bundles containing an entire application could cause usability issues due to long initial page load times. Thanks to code splitting, we now have much more granular control over how code is transferred from the server to the browser. This gives us ample opportunities to optimize load-time User Experience (UX).

In this chapter, we will revisit how to implement this in your React applications by using the lazy() API and the Suspense components. These features are very powerful tools in the...

The rest of the chapter is locked

Register for a free Packt account to unlock a world of extra content!

A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.

Unlock this book and the full library FREE for 7 days

Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of

Start free trial

Renews at €18.99/month. Cancel anytime

Authors (3)

Roy Derks

Roy Derks

Roy Derks is a serial start-up CTO, international speaker, and author from the Netherlands. He has been working with React, React Native, and GraphQL since 2016. You might know him from the book “React Projects – Second Edition”, which was released by Packt earlier this year. Over the last few years, he has inspired tens of thousands of developers worldwide through his talks, books, workshops, and courses.

See other products by Roy Derks

Mikhail Sakhniuk

Mikhail Sakhniuk

Mikhail Sakhniuk is Software Engineer with high proficiency in JavaScript, React and React Native. He has more than 5 years of experience in developing web and mobile applications. He has worked for startups, fintech companies, and product companies with more than 20 million users. Currently, Mikhail is working at Miro as a Frontend Engineer. In addition, he owns and maintains a few open-source projects. He also shares his experience and knowledge through books and articles.

See other products by Mikhail Sakhniuk

Adam Boduch

Adam Boduch

Adam Boduch has been involved in large-scale JavaScript development for nearly 15 years. Before moving to the frontend, he worked on several large-scale cloud computing products using Python and Linux. No stranger to complexity, Adam has practical experience with real-world software systems and the scaling challenges they pose.

See other products by Adam Boduch

Personalised recommendations for you

Based on your interests and search pattern

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m