Member-only story

Create a Modern Dynamic Sidebar Menu in React Using Recursion

The power of recursion in React

jsmanifest
Better Programming
8 min readNov 14, 2019

--

Photo by Bundo Kim on Unsplash

Sidebars in web pages are among one of the most useful components that exist on the page due to their navigational functionality.

Today we will be building a modern sidebar in react using recursion. Recursion is a technique in which a function simply calls itself repeatedly until a condition has been met. The three rules of recursion apply when using recursion in this post:

  1. The function should have a condition that self destructs itself.
  2. The function should have a base condition.
  3. The function should be calling itself.

Sidebars are indeed essential to a web page, even if their level of attention does not come first. This is because they can help users navigate in different ways, such as content, that they may be interested in as opposed to a logical navigational menu.

But why would we even want to use recursion for sidebars? What difference does it make as opposed to writing out your sidebar items manually? If you’ve browsed through the internet for a while, you might have come across a website’s sidebar and realized that some sidebar items have subsections. Some sites have sidebars that hide or render certain items based on the page…

--

--

jsmanifest
jsmanifest

Written by jsmanifest

Team Lead Front End Developer for a TeleMedicine Company. Follow and Join Me on my Adventures. https://jsmanifest.com

Responses (1)

What are your thoughts?