The architecture behind a scalable React.js application
After configuring the initial template in part one, this video explains the 5 minimum things needed in a react.js application to become scalable: using environments, routing and pages, layout and navigation, data structure and organization, and data sharing among components and pages. We use react-router-dom, useReducer, useState, ContextAPI, and other tools to build an excellent skeleton template.
Here is part one, where we build the template from scratch:
• How to start project in react using vite
Here is an explanation of the useReducer.
https://4geeks.com/lesson/optimize-re...
00:00 - Building the basic template
01:20 - Making the website load fast
04:40 - What a scalable application template needs to have
05:05 - Using environment variables in your react project
12:42 - Having multiple routes and URLs in your react project
16:05 - Building a reusable layout with a Navigation Menu Bar
19:18 - Organizing your data store with useState and useReducer
22:45 - Sharing data among pages and your entire web application
35:27 - Summary and last thoughts
Follow me on Twitter:
/ alesanchezr
This video is used as part of the 4Geeks Academy bootcamps:
Full-Stack: https://4geeksacademy.com/us/coding-b...
Data Science: https://4geeksacademy.com/us/coding-b...
Cybersecurity: https://4geeksacademy.com/us/coding-b...