sidebar nav with drawer? - reactjs

I was wondering if anyone knew what it is called when you have a sidebar nav with a collapsible drawer and main panel layout? I see this pattern everywhere now I wanted to find a tutorial on how to implement it in react or electron but all the results I get are for some other type of sidebar. This pattern is used in desktop electron-based apps like slack, vs code and microsoft teams and web apps like jira use it as well.

Okay you can use the Paper component in the the material ui framework.
docs here

Related

Tab navigation with React but not React-Native?

I'm into PWA development, and I'd like to use React components to build my UI, but not React-native components (otherwise why write PWAs...).
So I am looking for an equivalent to the top-tab-navigator component found here:
https://reactnavigation.org/docs/material-top-tab-navigator/
but without any React-Native dependency!
Changing pages by swiping would be great, even without a visual effect.
So far, I found React components to put tabs on displays inside pages, but nothing with navigator characteristics (full screen views, event on page change, ...).
Any help will be very appreciated.
Thank you!
So far, I found React components to put tabs on displays inside pages, but nothing with navigator characteristics (full screen views, event on page change, ...).

How can make this web app mobile responsive

enter image description here
I make this web app using react.js and I tried very much to do Responsive for mobile devices but I couldn't, any one solve this problem please.
I used useMediaQuery from material ui which helps very much in creating responsive site.
Here is the documentation for it.
After then for displaying responsive components
You can create new components that are fit to that window size
You can use states for toggling for the different window sizes
And then you can import them as you want.

Put React application inside another application

For react application I have to build sidebar menu and appropriate content on right side with dynamic content through navigation. This part is completed and now there are more menus in sidebar in existing application which are developed in different language and that should also be seen exactly like same sidebar and redirect to appropriate pages.
Block 1 will have only my react's application and block 2 can be page from react app or another app according to the navigation from sidemenu.
How can I achieve this?

Is it possible to change the magnifier icon on IBM Carbon Search component for React?

Despite having searched all the documentation, and even writing to the design team on Twitter, I still can't find an answer to this question.
I would like to change the magnifier icon on the React Search component of the IBM Carbon component library.
Does anyone know if it is possible, and how to do it?

how to use Parent-child transitions with Material-ui on desktop

I have a list in a drawer that is docked to the browser screen (desktop) and I want to expand the content of the list item to fill the entire drawer when I click on it just like explained in this demo:
I could find ways of doing it using Android but not using react material-ui V1.0.
Has anyone already done something like it?

Resources