WHY HAVE FRIENDS WHEN YOU HAVE CODE
In this article, we’re going to learn the best way (or at least one of the best) to set up your React file structure. This will allow you to keep organized as you develop your app, which makes maintaining and expanding it a whole bunch easier. DISCLAIMER: I have adapted the method outlined here from … Read More “React File Structure | React Tutorial for Beginners” »
In this article you’ll learn how to create React class components. In the previous article in this series, we learned how to make functional components. Class components are similar, except they use JavaScript classes instead of functions. NOTE: While class components are still valid in React, it is recommended to use functional components instead! … Read More “React Class Components | React Tutorial for Beginners” »
In the last article, we learned some basic rules of JSX. Here, I’m going to show you how to create functional components in React. Prerequisite Knowledge JavaScript functions, including arrow functions ES6 import/export syntax Basic knowledge of JSX Steps to Creating a Functional Component Create a JS or JSX file Make a function with the … Read More “React Functional Components | React Tutorial for Beginners” »
In the last article in this series, we learned how we can quickly create a React application with the create-react-app utility. In this guide, I’m going to introduce you to JSX and explain some of the most basic rules of JSX. Contents Introduction to JSX JSX expressions can only have one top-level element React fragments … Read More “Basic Rules of JSX | React Tutorial for Beginners” »
Creating a React application is simpler than ever – all you need is a terminal and access to NPM/NPX. With the release of the create-react-app (CRA) utility, you can get started with react with a single command. In this guide, I’ll show you how to create your first React app with CRA. Prerequisite Knowledge None! … Read More “Create-React-App | React Tutorial for Beginners” »
If you’ve made the decision to learn React, I’m glad for you! Learning React is, in my opinion, one of the best choices you can make as a web developer. If you’re here because you want to learn more about React before committing to it, then that’s awesome too! I’m sure you’ll find that … Read More “Introduction to React.js | React Tutorial for Beginners” »
You can improve both the performance and render speed of your components with the useMemo hook. For large apps or even small ones that make expensive calculations or HTTP requests, the useMemo hook can make a huge difference in the speed of your application. So in this guide, I’m going to explain what situations useMemo … Read More “React useMemo Hook: How to Optimize Your Components’ Speed” »
The MERN technology stack is one of the most popular. It stands for MongoDB, ExpressJS, ReactJS, and NodeJS. As you can imagine, it takes a lot of dedicated learning and persistence to learn that many technologies and frameworks just to develop a full-stack app! In this MERN stack roadmap, I’m going to show you how … Read More “MERN Stack Roadmap: a Guide for Developers” »
If you’re wondering how to create event listeners in React (and I assume you are) then you’re in for a pleasant surprise – it is surprisingly simple. Here I’ll show you how to add event listeners to React components. To add an event listener to a React component, first write the handler function, then attach … Read More “How to Create Event Listeners to a React Component” »
There are many cases in which you will need to change a parent component’s state from a child component. Very often you will have a state that needs to be accessed as well as mutated from many places in your app. This is actually a problem that is also solved by state management libraries such … Read More “React: How to Change a Parent Component’s State from a Child Component” »
