React gives developers complete freedom over how state is managed within a component. React has two types of components: class components and functional components, which were introduced in React v16.

Class components use methods to manage state, such as this.state and this.setState for state, and componentDidMount() for running a side effect once a component has mounted. If interested, you can read more about these methods.

However, since most React developers now use React functional components, we’ll be focusing on functional components and their state, which is managed using React hooks.

In this article, we’ll be taking a look at some…

Product management is one of the most often misunderstood roles in any organization. Although often thought of as the decision maker of all product decisions, in most organizations, that’s not the case, as they don’t have enough authority over most of the things that make their product successful.

A product manager is the person who identifies the customers needs, the large business objectives that features or products will fulfill, determine what success is for a project, and bring together a team to actually build the vision.

Product management is a relatively new role. While design and engineering both have a…

In React, by default errors can propagate all the way up an application and break an entire app upon the next render. These issues were often caused by an earlier error in the application code but weren’t handled gracefully and cause the entire rendering cycle to start.

In React 16, the concept of “error boundaries” were introduced to address this issue. Error boundaries are React components that catch errors anywhere in their children, log the errors, and display a fallback UI instead of crashing the application.

Error boundaries can catch errors during rendering, lifecycle methods, and constructors of all the…

React is meant to be an incredibly flexible software library, with no clear best practice when it comes to application structure or design. However, there are still some best practices and general rules that developers can use to write better React code.

Software architecture is meant to be productive and flexible for developers. The goal of good software is to keep the codebase maintainable and modular if any modifications or additions are needed.

I’ve put together some of the best practices I’ve picked for writing good React code, ones that have proven to be effective in applications large and small.

…

One of the hardest parts of developing a product is the dizzying amount of components that are often required for any full stack application. Building a dropdown menu or a button from scratch is time consuming, taking away from potential time spent on actual features.

Tools like Tailwind CSS have popped up to address this problem, accelerating the design -> code component of programming. However, Tailwind can be limiting, it’s not built for React or styled components (instead using CSS classes) and doesn’t provide any pre-built components, just tags to make building components faster.

I’ve recently fallen in love with…

Storybook is used by companies like Airbnb, Lyft, IBM, Shopify, and thousands of other companies to document and develop components in isolation.

In this article, we’ll be discussing what exactly Storybook is, and why you should be using it in your next project.

What is Storybook?

Storybook is a tool for building and documenting UI components. This isn’t a React exclusive tool, they also support React Native, Angular, Vue, and many other frameworks.

With Storybook, you can develop entire UI’s without ever having to spin up a development project, so you can focus on developing one thing at a time.

Storybook helps you…

The rise of low-code and no-code platforms have had people concerned about the replacement of developers in favor of these platforms and other automated concerns. If you’re a software developer, you may be worried about these platforms replacing your job, but I believe that’s not a valid concern.

What is Low Code and No Code?

Lets start with talking about what exactly are Low Code and No Code platforms. They’re shorthand for a set of services that allow you to connect various services together, often with a drag-and-drop interface and highly visual workflow creators that enable non-software developers to create highly functional apps.

No-Code has been around…

If you’re a frontend developer, you’ve probably dealt with the massive amount of bloat and boilerplate that can come with Redux. Setting up actions and reducers can lead to hundreds of line of code that relatively simple, but necessary.

Due to these problems, I switched over to using Recoil for a while, but then I remembered about Redux Toolkit.

What is Redux Toolkit

Redux Toolkit is:

The official, opinionated, batteries-included toolset for efficient Redux development

With a variety of utilities and a slightly opionated framework, it reduces the amount of fluff code you have to write to implement Redux.

Even better, it’s officially supported…