• Stars
    star
    215
  • Rank 183,925 (Top 4 %)
  • Language
    HTML
  • Created over 11 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Safe, production happy, colourful logging for chrome & firefox - makes reading your logs much easier.

Bows

Colors Safe, production happy, colourful logging - makes reading your logs much easier.

(Rain)bows makes logging debug messages in your apps much nicer.

  • It allows you to create custom loggers for each module in your app, that prefix all log messages with the name of the app, so that you can scan the messages more easily.
  • It colors the prefix differently and distinctly for each logger/module so that it's even easier to read.
  • It can be safely used in production, where logging will be disabled by default, so that you can leave log messages in your code.
  • Loggers safely wrap console.log, to maintain the line number from where they are called in the console output.

Example Output

Installation

If you are using browserify, you'll want something like:

npm install bows --save

If you use Bower:

bower install bows --save

Otherwise, download either bows.js or bows.min.js.

Features

  • Easily create prefixes for your logs, so that you can distinguish between logs from different parts of your app easily.
  • If supported, prefixes will be color coded for even easier identification.
  • Can be safely used in production, as logs will be disabled for your users, but can be enabled by you with a local storage flag.
  • Greppable logs by setting localStorage.debug = /Foo/ to only display logs for modules matching the regex to help you focus in development.
    • Invert regex to remove logs matching with: localStorage.debug ='!/Foo/
  • Customize the localStorage key by setting localStorage.andlogKey and you can use localStorage.<anyKeyYouWant> to set your log grepping.

Browser Support

  • Works in all reasonable browsers
  • Supports colors in chrome, opera, firefox >= 31.0, electron

Usage

  • Works great in browserify and the browser.

  • Creating a new logger:

    • Browserify: var log = require('bows')("My Module Name")
    • Browser: var log = bows("My Module Name")
  • Then using it is easy:

    • log("Module loaded") //-> "My Module Name | Module Loaded"
    • log("Did something") //-> "My Module Name | Did something"
  • Typically each seperate module/view/etc in your app would create it's own logger. It will be assigned it's own color to make it easy to spot logs from different modules.

  • You can pass additional arguments to bows which will be automatically prepended to each message, e.g.:

    var log = bows("My App", "[ChuckNorris]");
    log("Kicks ass!");
    //outputs:
    //My App         | [ChuckNorris] Kicks ass!
  • Logging is disabled by default. To enable logging, set localStorage.debug = true in your console and refresh the page.

  • To disable logging again, you must do delete localStorage.debug (localStorage.debug = false will not work).

  • You can leave the code in in production, and log() will just safely no-op unless localStorage.debug is set.

  • Where colors are not supported, bows will just log plain text, but still with the module prefix.

    • If you wish to manually disable colors in an environment because detection is incorrect, set localStorage.debugColors = false, to reenable delete localStorage.debugColors.

Example

  //Should be set in your console to see messages
  localStorage.debug = true
  //Configure the max length of module names (optional)
  bows.config({ padLength: 10 })

  var logger1 = bows('Module 1')
  var logger2 = bows('Module 2')
  var logger3 = bows('Module 3')

  logger1("We started up")
  logger2("We did something too")
  logger3("I'm here")
  logger3("I'm still here")
  logger2("I'm tired")
  logger1("We're done here")

Result:

Example Output

Test

Status: Build Status

This project uses phantomjs for tests. To run the tests install the development dependencies and then run:

npm test

New tests

Add a file in test, refer to enabled.html/disabled.html, then add the script to the array in test/index.js.

License & Credits

MIT

Copyright @philip_roberts / latentflip.com.

With contributions from:

Bows depends on andlog, a nice little logging module by @HenrikJoreteg.

Contributing

Please feel free to raise issues, or make contributions:

git clone https://github.com/latentflip/bows.git
cd bows
npm install #install dependencies
#edit bows.js
npm test
npm run build.js #build dist/bows.js and dist/bows.min.js, also done by `npm test`

More Repositories

1

loupe

Visualizing the javascript runtime at runtime
JavaScript
3,031
star
2

violin

Violin
CoffeeScript
262
star
3

domthing

A simple, fast, & safe, mustache/handlebars like templating engine with data-binding hooks built in.
JavaScript
214
star
4

webpack-unused

Check your frontend code for files/assets that are no longer used.
JavaScript
144
star
5

track-your-damn-time

Because I'm lazy.
JavaScript
77
star
6

dev-cert-authority

Self-signed certs for development
JavaScript
77
star
7

deval

Like eval, but backwards.
JavaScript
62
star
8

building-static-server

A static file server that runs builds and things
JavaScript
22
star
9

explode

Explodes tars, and implodes dirs.
JavaScript
11
star
10

browserify-grunt-workspaces-demo

JavaScript
9
star
11

hapi_primus_sessions

JavaScript
7
star
12

bacon-talk-realtimeconfeu

JavaScript
7
star
13

domthing-demo

JavaScript
6
star
14

hapi-auth-action-token

JavaScript
6
star
15

stylizer

Simple stylus api for moonboots etc.
JavaScript
6
star
16

LearningD3

JavaScript
5
star
17

d3

JavaScript
5
star
18

domthingify

Browserify transform for domthing.
JavaScript
4
star
19

async-data-loader

JavaScript
4
star
20

timetime

JavaScript
4
star
21

websocket-debug

JavaScript
4
star
22

RedisWeb

A basic web interface for redis.
Python
4
star
23

browserify-eco

JavaScript
4
star
24

eventloop-book

JavaScript
4
star
25

atom-talky-test

CoffeeScript
4
star
26

jade-to-jsx

Generate react components from jade files
JavaScript
4
star
27

active_support_js

CoffeeScript
3
star
28

Tumblog

Styles and Writings for my tumblog
Python
3
star
29

snake

CoffeeScript
3
star
30

scales

JavaScript
3
star
31

BigDecimal.js

Arbitrary-precision decimals library for JavaScript
JavaScript
3
star
32

game-of-life-lua

Game of life in lua
Lua
3
star
33

node-glob-cli

JavaScript
2
star
34

ScotRubyConf

Ruby
2
star
35

weevil

WebWorker eval.
JavaScript
2
star
36

heroku-screengrabber

JavaScript
2
star
37

foundation-stylus

CSS
2
star
38

latentflip.github.com

My blog.
JavaScript
2
star
39

tracker-roadmap

Product roadmap generated automatically from Pivotal Tracker data
Ruby
2
star
40

sinatra-heroku-boilerplate

A simple Sinatra framework app for Heroku deployment, mainly for the purpose of rapid prototyping. Incorporates HTML5 Boilerplate, with HAML, SASS and basic DataMapper config.
JavaScript
2
star
41

beats

JavaScript
2
star
42

geodb

This is a hacky project to make a really basic nosql like geo database. You most probably don't want to use it, unless you're me ;)
JavaScript
2
star
43

Mowars

Python
2
star
44

underscore-koans

underscore-koans
JavaScript
1
star
45

Inflation

JavaScript
1
star
46

joyrtc

JavaScript
1
star
47

rebase

1
star
48

Projects

JavaScript
1
star
49

scotlandjs

JavaScript
1
star
50

Bash-Config

Personal bash config
Vim Script
1
star
51

flood-video

JavaScript
1
star
52

react-jade-example-wut

JavaScript
1
star
53

base32-crockford-browser

JavaScript
1
star
54

kerblam-online

JavaScript
1
star
55

scotruby

Ruby
1
star
56

make-better

Makefile
1
star
57

code-split

JavaScript
1
star
58

tape-suite

Simple suites for tape.
JavaScript
1
star
59

7li7w

Seven languages in seven weeks
Io
1
star
60

erroreteg

This is just silly.
JavaScript
1
star
61

CHS11

Culture Hack Scotland
JavaScript
1
star
62

how-much

CoffeeScript
1
star
63

user-flow

JavaScript
1
star
64

heroku-lockdown

Ruby
1
star
65

JellyTalk-Showoff

Ruby
1
star
66

banking

Ruby
1
star
67

install-deps

JavaScript
1
star
68

conway

JavaScript
1
star
69

mockup

Template for quick wireframe mockups.
Ruby
1
star
70

example-site

JavaScript
1
star
71

sort_test

Ruby
1
star
72

Citipedia--SIcamp-

JavaScript
1
star
73

blogtastic

Blog app using Rails
Ruby
1
star
74

SimpleDecimal.js

CoffeeScript
1
star
75

virtual_attribute

Virtual Attributes that play nice with forms & active_record
Ruby
1
star
76

scottish-ruby-conf-2013-talk

1
star
77

redux-game

JavaScript
1
star
78

boring

JavaScript
1
star
79

watchify-server

JavaScript
1
star
80

BioInf

Python
1
star
81

hjs-webpack-example

JavaScript
1
star
82

stack-queue-visualisation

An attempt to visualise the JavaScript runtime
JavaScript
1
star
83

lytic

JavaScript
1
star
84

bookstore

1
star
85

BBBPAPP

JavaScript
1
star
86

advent-of-code

Elixir
1
star
87

bacon_js_spreadsheet

JavaScript
1
star
88

Ruby-Quizzes

Quizzes from the Ruby Quiz book
Ruby
1
star
89

xmpp-devtools

JavaScript
1
star
90

Mona-Lisa

Matlab genetic algorithm 101
Objective-C
1
star
91

level-tree-db

A leveldb backed tree structure.
JavaScript
1
star
92

Canvas

Canvas is a simple drawing application that allows you to quickly sketch ideas and create drawings. Pen pressure is simulated using touch/mouse velocity, helping to give line drawings a more natural feeling.
JavaScript
1
star
93

Fourscore

JavaScript
1
star