A step-by-step guide to integrating Node.js, Express, and React. — The application To go through the steps of connecting and running together a Node.js server with a React application, we will build a simple web application to search for artworks on the Art Institute of Chicago’s API. We will set up a basic login page, save a token on the browser to…

A brief overview of some cool features on Redux Toolkit that will boost code quality on your next React project — Do you often find yourself modifying half a dozen different files just to add a new Redux action? Maintaining gigantic reducer functions that keep getting bigger and bigger? Or maybe wasting hours debugging faulty reducers that mutate deeply nested state objects? …

Brush up on these core (and some tricky) React concepts before your next interview. — What is the virtual DOM? Updating the DOM and repainting the UI is expensive, so React uses a virtual representation of the real DOM, kept in memory and synced with the real DOM, to optimize the changes needed and improve the performance of the application. Whenever the UI is updated with new elements, a new…

A short guide to implementing JWT authentication on a Node.js+React stack. — Authentication and authorization are key components in any modern web application. Many technologies can be found today to verify user identity and authorize access to server resources, but JSON Web Tokens continue to be a standard and adopted technology in the industry. We will create a basic authentication scheme through…

A non-intimidating guide in two parts to set up React Native projects with state management and static typing integration. Concept We’ll be cloning Instagram’s home UI to understand how to couple Redux and TypeScript with a React Native app. …

Over the last few years the development and improvement of front-end frameworks and graphic design software, paired with an explosion of new sources of information and inspiration for web developers and designers, has brought the area to a peak where the limit is our own creativity. …

Up until React version 16.8, we could either define a new component as a JavaScript function, that received props (or inputs) and returned a React element describing what should be displayed on the screen, or as an ES6 class with a local state and lifecycle methods. Structuring our logic with…