In this article, we will create a tooltip component with react and react hooks. Let’s create a new react application with npx create-react app and delete everything inside the App.js file. Tooltip Component Create a new index.js file at the following path: src/Tooltip/index.js . Let’s start creating our tooltip: import React from…

Hi everyone! Today we’re going to create a simple expandable tree component with react hooks! Enjoy! Different Ways To Create A Tree Before diving into coding let’s discuss the way we’re going to create our tree. I know atleast two ways of doing that. The first one is creating an actual tree structure where children are…

In this part we will add the ability to resize our panel in any direction! — If you haven’t read Part 1 please take a look cause the following code will be based on what we’ve already achieved. Resizable Panel To keep things short let’s create a Resizer component inside Panel/components folder and add the following code:

In this part we will create a panel that can be freely dragged with react and react hooks. — I’ve created a new react app using npx create-react app and deleted the default files, so right now the project structure looks like this:

By the end of this article you will create your own context menu with React Hooks. Create A New React Project To create a new application we will use Create React App. In order to do it you’ll need to have Node ≥ 8.10 and npm ≥ 5.6 installed on your machine. Run the following…