Skip to content

Recurrent React problems

Environment variables in React
Useful link: Environment variables

REACT_APP_TEST_VAR=123 npm start

– variables are embedded during build time.
– only the variables that start with REACT_APP_are embedded in our app (when the application is made with CREATE REACT APP)

The component does not rerender on a state update:
1. Makje sure the reducer returns a copy of the state or work with immutable objects
2. If the state is a nested object, use clonedeep from lodash or an immutable object

Fetch does not reject a promise on Status code 400 or 500
fetch() will only reject a promise if the user is offline, or some unlikely networking error occurs, such a DNS lookup failure. In order to reject a promise in case of a status code different from 200, use a generic handleError function

Handler before the result is stringified

function handleErrors(response) {
function handleErrors(response) {
if (!response.ok) throw Error(response.statusText);
return response;

Handler after the result is stringified

function handleErrors(response) {
return response.json().then(result => {
if (result.errorMessage) {
throw result
return result

Fetch error handler

Promise handler is not being called on dispatch

1. Make sure the dispatch is being called and you do not call the action directly from the import

Async await in map/forEachfunctions

1. wrap the map-function in a await Promise.all( => await doAsyncCall(item))
2. do NOT use forEach in an async call. Use for (let item in items){await doAsyncCall(item)}

Published inUncategorized

Be First to Comment

Leave a Reply

Your email address will not be published. Required fields are marked *