#366 Reading Source Code: React

sponsor

Dynamic Organization Routing with React

If you’re building a B2B/multi-tenant application, you’ll want to have some dynamic way to know which organization your users are accessing at any point in time. With PropelAuth’s hosted pages, your users can create organizations in your app, enabling you to easily check their roles, memberships, and more in your React app.

this week's favorite

Reading Source Code: React

It’s daunting to even think about reading the code of a framework I’ve been using for years. I’ve always seen React as a black box that takes JSX and puts things on the screen without thinking too much about it.

Avoid anonymous components with `displayName`

There are two exceptions where the devtools are unable to infer a name of a component. Contexts and 'wrapped' or 'higher-order' components, i.e. components wrapped in memo and forwardRef. The devtools need some help to be able to display a name for those, this is where the displayName property comes in.

Architecting React Apps Like it's 2030

There is one problem that every React Developer falls into during his journey. This is how to structure a good app architecture.

7 Tips for Clean React TypeScript Code you Must Know 🧹✨

Clean code isn't code that just works. It refers to neatly organized code which is easy to read, simple to understand and a piece of cake to maintain.

How to Use React Context With Hooks for Global State Management

Why Would You Want To Use the React’s Context API for Global State Management? The answer is simply that although you can pass a state from the main parent component all the way down to all child components via props, it becomes very cumbersome after 2 levels => deep prop drilling is a bad practice leading to code that is hard to read and maintain. And that’s when you should have a look at a state management library (e.g., Redux) or the built-in React Context.

newsletters

Would you like to become a sponsor and advertise in one of the issues? Check out our media kit and get in touch.