Previously, we implemented authentication for this Firebase in React application. Along the way, we added authorization with roles. You may have experienced a flicker every time you reload/refresh your browser, because the application doesn't know from the start if a user is authenticated or not since the authenticated user is null. It will happen…

So far, you've used broad authorization rules that check user authentication, where the dedicated authorization higher-order component redirects them to the login page if the user is not authenticated. In this section, you will apply a more specific authorization mechanism. It works with roles (e.g. Admin, Author) assigned to a user, but also with…

Interested in reading this tutorial as one of many chapters in my advanced React with Firebase book? Checkout the entire The Road to Firebase book that teaches you to create business web applications without the need to create a backend application with a database yourself. This comprehensive tutorial walks you through a real-world application…

Today, I am super excited to announce the release of The Road to GraphQL - Your journey to master pragmatic GraphQL in JavaScript with React.js and Node.js . Writing this book proved to be a challenge with GraphQL technologies changing often, but I managed to get an updated version published in time to keep you ahead of the curve. Perhaps the best…

As I worked with my recent client to develop their lay out the groundwork for their React application, I found out that testing was an important topic for them. They are shipping their React application into embedded systems only once or twice a year. As conclusion there must be a guarantee that everything is working as expected, because there are…

Recently a client of mine inspired me to learn RxJS for State Management in React. When I did a code audit for their application, they wanted to get my opinion about how to proceed with it after only using React's local state . They reached a point where it wasn't feasible to only rely on React's state management . The initial discussion was…

There are too many people who encounter the following warnings. I have seen many GitHub issues regarding it and many people are asking me about it as well. That's why I wanted to have this article to address it and reference to it. Warning: Can only update a mounted or mounting component. This usually means you called setState, replaceState, or…

In a previous application, you have learned how to mock a GraphQL server in different ways when having Apollo Client as GraphQL client in your React application. The following application shows you how you can take this knowledge to the next level for writing tests for your Apollo Client queries and mutations. So far, the Apollo Client instance can…

The article is a short how to use CSS Modules in your create-react-app application . It shows you how to setup CSS Modules, but also how to use them in your components. After you have setup your application with create-react-app (e.g. npx create-react-app my-app ), you don't need to install anything else to make CSS modules work. They come out…