Written by Chak Shun Yu, a software engineer with a current focus on frontend and React, located in the Netherlands. This blog is where I write about everything I encounter and learn during my journey to become a better developer. You can also follow me on Twitter and Dev.
After nearly a full year of writing technical about code readability, I learned a lot about it. But the most important thing that I learned about writing readable code is that it isn't for myself, but for others.
Although behaviour testing is extremely relevant in the field of React, not every developer will have equal familiarity and mastery of it. This article discusses a set of fundamental questions related to behaviour testing in React based on experience in multiple React engineering teams.
State management is one of the most important aspects of React development. However, not every state update should result in a re-render. This article covers how to prevent unnecessary state update re-renders by avoiding the state update or triggering the state update with the existing state.
Mocking React components is a crucial skill for creating proper React tests. This article will show you how to mock your React components in different scenarios using Jest, namely default exported components, named exported, components that come from ES6 modules and including the props with them.
As a React developer, reviewing is part of our daily responsibilities. However, knowing what to focus on during React reviews isn't a trivial task. This article shares all the questions that I ask myself when reviewing React code and will help you navigate your way through React reviews.
Besides development, React design patterns can also be used to increase the quality of code reviews. However, doing so isn't trivial and requires a different understanding. This article covers how to easily integrate several common React patterns into your React reviews.
As code proposers and members of a team, we have the responsibility to set up our reviewers for success. This article covers 6 concrete tips that will make your React pull requests easier to review and allow you to receive higher-quality reviews today.
As code proposers, we try to pass all the checkmarks of the reviewer. Oftentimes the focus is on the code, but there's more to a PR than just the code. This article covers 5 non-code related mistakes that developer make that leads to their PRs becoming more difficult to review.
Testing components is important in React development but is also often overlooked and neglected. After several years of not knowing what to test or how to approach it, I came up with a testing checklist. This article shares that checklist, discusses the topics, and will help you reach better tested React components.
Everyone hates meetings, especially bad ones. But in the current pandemic situations, remote meetings are part of our work more than ever. This article shares 5 actionable tips that helped us increase the efficiency of our meetings as an engineering team.
Custom hooks are essential to implementing logic flows and making any React app interactive. This article will cover 3 approaches to implementing customs hooks in React and analyze their level of readability.
This article shows you how to spy on an exported function, imported function, named export, or named import in Jest.
Reviewing is a core process in software development, but not all code reviews are created equally. This article shares 5 actionable tips that helped me deliver higher quality code reviews and will help you take your code reviews to the next level.
Snapshot testing your React components is convenient, easy, and low effort, but they are also unreliable, unrealistic, and volatile. Over the years, they have fallen out of favour in the field of React testing. This article looks into the remaining proper use cases for snapshot testing React components.
One of the most common usages of TypeScript in a React codebase is typing a component's props. But have you ever thought about how readable your component's props typing is? Let's find out by analysing three different implementation approaches.
Showing UI elements conditionally to users is essential to make any React app interactive and more than a static website. Based on different inputs and interactions, your React app will render different elements. This article will cover the 2 most common approaches to implement inline conditional rendering in React and analyze their level of readability.
Content streams are an important part of any React project, but also introduces a lot of complexity. Long term, making sure that the code is readable has a serious impact on the maintainability. This article will cover and analyze the readability of two fundamental approaches to handling content states in your React components.
Hooks are an important aspect of any React project and mocking them in tests is not always straightforward. This article will show you how to navigate the spectrum between the control and effort of mocking and the representability of your tests so you can create your own solutions.
Being a junior developer isn't easy and not much is expected from them. But with the right mindset and actions, juniors can actually provide a lot of value to a team from the moment they join. You are not a liability, but an asset.
Writing proper behaviour tests in React with Enzyme and Jest is not a trivial task. I have spent three years on this topic and in this article, I will share my learnings and guidelines to how you can get more useful, reliable, and meaningful behaviour tests for your React code.
Pair programming as a concept bears tremendous potential. This article goes over 5 ways that will help you make pair programming sessions more effective.
In this article, I will three tips for when it makes sense to mock and how to approach mocking in your tests that will help you with mocking.
Pair programming is not only fun, but also helps teams with productivity, truck factor, levelling out knowledge gaps, onboarding newcomers, and quality of work.
In this article, I go over the different available mocking approaches, the differences between them, and the different use cases for mocking one particular function from an imported module in Jest.
A story, self reflection, and learning from an early stage in my engineering job about how I totally forgot about the most important audience of all: reviewers.
A story from an early stage in my engineering job about how I tried too much to come up with the perfect solution, rather than keeping it simple and not unnecessarily wasting time, and a reflection of what I could've done different.
Why using the second argument of Redux's `connect` function will lead to more maintainable and higher quality React code, as well as significantly improving how you're able to test your components.
Statement and reflection on what, why, and how a post graduate student will attempt to learn as much as possible form his first front-end developer job.
When I started to write this post, I had finished my first serious week of contributing to open source. I mainly contributed to the project Storybook. This post will describe the contributions and interactions that took place this week. It will also focus on the path that led up to this week.