By Juan Andrés
Are you interested in our super state-of-the-art React-related news? Subscribe to our monthly Newsletter and keep updated by clicking here!
React and bindings
A common pain point for React developers is "binding" the "this" keyword. Usually, when using a function inside a component, access to "this" is needed. React doesn't bind the function automatically. This is done on purpose to avoid the expensive bind operation when it's not needed. However, this has opened the floodgates for discussion on what's the correct way to do it.
- React Binding Patterns: 5 Approaches for Handling `this`: A description of the 5 ways to bind "this". Analyzing each approach and providing a handy flowchart to define which one to use.
- Why Arrow Functions and bind in React’s Render are Problematic: A clear explanation of why the most common binding method is bad for performance. It includes a practical example to demonstrate the additional unnecessary renders that this method causes.
- React — to Bind or Not to Bind: Even if it's clear which binding approach to use, we must first consider if binding is necessary at all. Sometimes binding is not useful at all, and sometimes it can indicate an architectural problem or a code smell.
React as a PWA
Progressive Web Apps are gaining traction as a solution for several apps in different scenarios. They provide features that were previously impossible to get from a web application, mimicking the behavior of native apps.
- Progressive Web Apps with React.js: A 5-part series on creating a PWA with React, finishing with a real case study. Written by a Senior Google engineer.
- ReactPWA: A boilerplate for creating a 100% PWA with React. With excellent documentation, it can greatly help accelerate development.
.png)
Tools and libraries
- PlopJS: React (and specially Redux) can potentially require a fairly large quantity of boilerplate. This templating tool helps by providing an easy to use and powerful templating system. With it, developers can have confidence in the consistency of their code, even when working on large teams. It's also the templating engine used in react-boilerplate.
- date-fns: Working with dates is always a crucial aspect of any language. While in javascript there has been widespread adoption of Moment.js, its functions are not pure. If we want to take advantage of all the benefits purity can give us, we can use date-fns.
