Skip to content

ndom91/console-toaster

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

20 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🍞 console-toaster

Toastify your console.logs!

NPM JavaScript Style Guide

Tiny heads-up display which will show your console.log and console.error messages in toasts on your screen.

In addition, you get a counter of the two in the bottom left. Clicking on either will show you a history of log lines.

Clicking on a log toast itself will launch a google search of that error message.

πŸš€ Install

npm install --save console-toaster

πŸ“‹ Usage

import React from 'react'
import Container from 'rest-of-app'
import Toaster from 'console-toaster'

const App = props => {
  return (
    <div>
      <Toaster />
      <Container />
    </div>
  )
}

This will get you a little heads up menu on the left, and your console.log() and console.error() calls in toast messages along the right. Don't worry, they'll still show up in your console as well.

Screenshot1

Clicking on either log or error will display the latest log entries

Screenshot2

πŸ—„ Props

<Toaster
  position={'bottom' || 'top'}
  duration={4000}
  destination={`https://google.com/search?q${error}`}
  className={''}
/>

πŸ“– License

MIT

About

Tiny console toaster 🍞

Resources

Stars

Watchers

Forks

Contributors 2

  •  
  •