reactjswireframe

React JS when click menu button, entire page shift right

I need your suggestion. I want to develop website in React JS. For start I draw a wireframe. I'm planning to use react libraries if possible. Below is my wireframe. Can I know for a start, what I should search. The 1st image will be the UI. When I click the hamburger button, the page will slide right as shown in 2nd image. Please help guys

Image 1 enter image description here

Image 2 enter image description here

Solution

  • There's a few things you will need to consider:

    1. Storing and toggling the open/close state of your sidebar
    2. The layout of your DOM elements
    3. The transformation of your page content

    Here's a sandbox to help you out: https://codesandbox.io/s/adoring-napier-s8gs09?file=/src/App.js