Going to the previous page is essential part of browsing experience. In this article, we will explore how to implement a ‘go back’ feature in React. How ‘go back’ feature works Browsers keep track all URLs you visit when browsing a website. This information is…
The react-router library provides essential custom components for navigating React web applications. In this article, we’ll focus on <Link>, the custom component similar to an anchor (<a>) tag in normal HTML. We’ll show you how to set an onClick handler, so when users click <Link>,…
React web applications are essentially component trees with branches – a component might render multiple components, which render more components on their own. To build any kind of useful web application, you need to know how to render multiple components in React. Common mistake when…
Nowadays many web applications are overloaded with content. Sometimes you need to highlight certain elements or components by setting scroll position in React. In this article, we’ll show you how to set scroll position when component mounts or when users click a button. Set scroll…
To render the same component multiple times in React, you need to do two things: There are multiple ways to get the array of components. Render a component multiple times To render multiple components, React developers usually loop through an existing array (usually an array…
It’s important to not overload your web app with unnecessary information. It’s much better to have components with expand/collapse feature. Display essential bits of information (title, category, short description) and let users expand for full information. In this article, we will show you how to…
React is all about reusability. You can define a component’s structure, appearance and reuse it. You can pass props to customize component’s content and even appearance. In this article, we will explore how to use forEach() to loop over an array of objects, automatically create…
<select> and <option> elements are extremely useful for collecting user inputs. As a web developer, you can use <select> to define a fixed set of options and limit user input to those options. In some cases, you want to set a generic option as a…
Past few years have seen a lot of developments (improvements) in web development, as well as the quality of interactive web applications. The demand for stylish, functional and dynamic web apps was strong up until 2022. That should continue into 2023. However, starting a career…