# MDB React 5
React Backdrop options for a responsive popup with Bootstrap 5. Prevent close on click outside with static backdrop, remove backdrop, enable interactivity & more.
Check out [React Modal Backdrop Documentation](https://mdbootstrap.com/docs/react/extended/modal-backdrop/) for detailed instructions & even more examples.
## Basic example
```js
import React, { useState } from 'react';
import {
MDBBtn,
MDBModal,
MDBModalDialog,
MDBModalContent,
MDBModalHeader,
MDBModalTitle,
MDBModalBody,
MDBModalFooter,
} from 'mdb-react-ui-kit';
export default function App() {
const [basicModal, setBasicModal] = useState(false);
const toggleShow = () => setBasicModal(!basicModal);
return (
<>
LAUNCH DEMO MODAL
Modal title
...
Close
Save changes
);
}
```
## How to use?
1. Download MDB 5 - FREE REACT UI KIT
2. Choose your favourite customized component and click on the image
3. Copy & paste the code into your MDB project
[▶️ Subscribe to YouTube channel for web development tutorials & resources](https://www.youtube.com/MDBootstrap?sub_confirmation=1)
## More examples(click on the image to see a live demo)
### Static Backdrop:
[](https://mdbootstrap.com/docs/react/extended/modal-backdrop/#section-static)
### No Backdrop:
[](https://mdbootstrap.com/docs/react/extended/modal-backdrop/#section-no-backdrop)
You can find other examples [here](https://mdbootstrap.com/docs/react/extended/modal-backdrop).
## More extended React documentation