useState or useReducer?
Choosing the right hook is an important architecture choice. While useState and useReducer have similarities, they fit best in certain cases. If you are confused about which one is the best to use, ask, does the element of state you are manipulating depend on other elements of state, or is it independent?
The ever prolific, and handsome Kent C. Dodds wrote up an article with sample code to help you understand the difference between the useState hook and the useReducer hook.
Xbox app for PC swaps Electron for React Native UWP
Electron is a platform that packages web (JS/HTML/CSS) code into a Chromium shell to deploy on desktop. The great thing about Electron is it allows for developers with web skills to build and deploy desktop apps. A browser shell is not necessarily the best choice if you need high performance due to the multiple additional layers in place.
The Xbox application for PCs originally shipped using Electron, a popular platform for building desktop apps with web skills. The Xbox app team swapped Electron for React Native UWP for performance reasons. The app size now shrinks from 300MB to 60MB. Also, memory usage drops by more than 50% with the new React Native UWP architecture. Read why the team swapped out Electron and swapped in React Native UWP.
React Mental Models, Part 2
A mental model is a thought process or mental image that helps us understand complex systems and to solve hard problems intuitively by guiding us in the right direction. Having the right mental model makes reasoning and problem-solving much more efficient. In the second article in his 2 part series, Obed Parlapiano discusses useState, useEffect, and the component life cycle phases. Using these elements well is fundamental to architecting and writing good quality React applications.
If you haven’t read the first version of this article (a Visual Guide To React Mental Models), you should add it to your list.
8 minutes. 14 array methods.
Array has a bunch of very helpful functions you can use to manipulate array contents and structure. In this video, Zach Horton from Clean Code Studio goes over 14 Array functions in 8 minutes, each with examples.
Zach has a great style for video tutorials. If you agree, check out some of his other video like JavaScript apply, call & bind (Simplified in 2020) or 30 Minutes Of Reduce ~ Javascript (Insane power, absolutely insane).
Free Resources to learn React in 2020
Arek Nawo posted a nice list of free resources to help you stay up with the React ecosystem. This is a page you should bookmark and check back with as the information there is super helpful and organized into the type of media. There are sections for tutorials, courses, podcasts, blogs, cheat sheets, and documentation sites.
The Ultimate Guide to React Native Optimization Ebook
Mike and the Callstack team have assembled the ultimate guide to React Native optimization – a one stop shop for shipping excellent React Native apps. In this book they’ve pulled together tips, tricks, tactics, and solutions all for React Native apps. Rather than sift through blog posts looking for what you need, you can just consult this handy reference.
In addition to the blog posts, Mike and team have put together exclusive, rich content to help you with your apps.
