React JS when click menu button, entire page shift right

Question

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

Learn css "Transform" with "scale, translate, rotate, ...", then you should be able to do it — Jakub Štellner, Sep 22 '22 at 15:40
thanks alot ya for this idea i need a starting point but no idea what to search for. thx for giving a hint. appreciate that — shalene, Sep 22 '22 at 15:46

score 1 · Accepted Answer · answered Sep 22 '22 at 16:17

1

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

Storing and toggling the open/close state of your sidebar
The layout of your DOM elements
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

answered Sep 22 '22 at 16:17

Alex Gourlay

365
1
12

that is fast. can share how you do it ya. want to research furthers on this. i'm new to react but willing to learn – shalene Sep 22 '22 at 16:56

React JS when click menu button, entire page shift right

1 Answers1