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…
The article is a short how to add Sass support to your create-react-app application . It shows you how to setup Sass, but also how to use it in your components. You will learn how to style a specific component with it and how to define global style, such as variables for your color schema, that can be used throughout your application. After you…
The article is a short tutorial on how to achieve global state in React without Redux. Creating a global state in React is one of the first signs that you may need Redux (or another state management library such as MobX) in your application, because in React the local state is located on a component level. Hence you cannot have a real global state…
