Add toast messages to your React app

It’s nice to have good looking messages in your app. You can have this too with react-toastify.

react-toastify example

To have these toast messages in your app, do the following:

yarn add react-toastify

Then, in your toplevel file (sth like index.js or App.js, etc.);

import React from 'react';

  import { ToastContainer, toast } from 'react-toastify';
  import 'react-toastify/dist/ReactToastify.css';
  
  function App(){
    const notify = () => toast("Wow so easy !");

    return (
      <div>
        <button onClick={notify}>Notify !</button>
        <ToastContainer />
      </div>
    );
  }

Click Here to Leave a Comment Below

Leave a Reply: