react-toastify alternatives and similar libraries
Based on the "Notification" category.
Alternatively, view react-toastify alternatives based on common mentions on social networks and blogs.
-
notistack
Highly customizable notification snackbars (toasts) that can be stacked on top of each other -
react-notifications-component
Delightful and highly customisable React Component to notify your users -
cogo-toast
DISCONTINUED. Beautiful, Zero Configuration, Toast Messages for React. Only ~ 4kb gzip, with styles and icons
SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
Do you think we are missing an alternative of react-toastify or a related project?
README
React-Toastify
🎉 React-Toastify allows you to add notifications to your app with ease. No more nonsense!
Installation
$ npm install --save react-toastify
$ yarn add react-toastify
Features
- Easy to set up for real, you can make it work in less than 10sec!
- Super easy to customize
- RTL support
- Swipe to close 👌
- Can choose swipe direction
- Super easy to use an animation of your choice. Works well with animate.css for example
- Can display a react component inside the toast!
- Has
onOpenandonClosehooks. Both can access the props passed to the react component rendered inside the toast - Can remove a toast programmatically
- Define behavior per toast
- Pause toast when the window loses focus 👁
- Fancy progress bar to display the remaining time
- Possibility to update a toast
- You can control the progress bar a la
nprogress😲 - You can limit the number of toast displayed at the same time
- Dark mode 🌒
- And much more !
The gist
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>
);
}
Demo
A demo is worth a thousand words
Documentation
Check the documentation to get you started!
Contribute
Show your ❤️ and support by giving a ⭐. Any suggestions are welcome! Take a look at the contributing guide.
You can also find me on reactiflux. My pseudo is Fadi.
Contributors
Code Contributors
This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].
Financial Contributors
Become a financial contributor and help us sustain our community. [Contribute]
Individuals
Organizations
Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]
Release Notes
You can find the release note for the latest release here
You can browse them all here
License
Licensed under MIT
*Note that all licence references and agreements mentioned in the react-toastify README section above
are relevant to that project's source code only.