I don’t want to lose too much time explaining the concept of Context; there are simply too many great explanations of it out there like here, here, here, here, here, and here. But I can’t just throw some code at you so here we go: Context allows you to access data anywhere and avoid excessive prop drilling in your app. The React docs do a great job summarizing the concept:
Context is designed to share data that can be considered “global” for a tree of React components, such as the current authenticated user, theme, or preferred language.
It should not be used as a substitute for Redux but rather, as the quote above suggests, as a way to distribute certain items like a user or theme to your components at varying levels of your React Component tree. The example below shows Context all in one file so “SingleFile” is a better name than “SinglePage” but whatever. The point is that everything is in one file so that you can see what’s happening despite the fact that you’d never really do it this way. …
I don’t write about politics and I don’t really write letters. I wrote one letter, about a year ago, to convince a friend to vote in this election (he had never voted in ANY election…and this year he is!) but that was pretty much it. As 2020 has progressed and the consequences of electing Donald Trump has weighed on the nation, I could not help but write one more. If you’re reading this, this letter probably isn’t “for you”…it’s actually more for the Trumpers in your life. …
Functional components are the bread-and-butter of any React application, especially with the addition and expansion of React Hooks. This post breaks down a simple functional component (Version #1) and then shows four additional ways it could be written. Enjoy:
This first version is very simple. It’s a simple function called `Button` that takes an argument,