what is a toast? Toasts are show messages or popup messages you can show your users to alert them of any information related to their expirience withint the UI.

source: /f/apachefriends/xampp/htdocs/webune/quiz/frontend/reactV1

To implement toast in a React Component, use this code examle:

QuizIndex.jsx:

import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
....
const notify = (type = 'default', msg) => toast(msg, { type });

JSX:

  return (
 <>
      <ToastContainer
        position="top-center"
        autoClose={5000}
        hideProgressBar={false}
        newestOnTop={false}
        closeOnClick
        rtl={false}
        pauseOnFocusLoss
        pauseOnHover
        theme="colored" />
</>
)
 

Usage:

notify('error', "Error #14 - There was a problem with your request to the server.");