[Javascript] Format console.log with CSS and String Template Tags

The Chrome console allows you to format messages using CSS properties. This lesson walks you through the syntax of formatting your logs with css then refactoring into a template tag function to make formatting more reusable.

 

const debug = (label, style, obj) => {
    console.log(`%c${label}`, `${style}`, `${obj}`);
};

debug(
    `debug: `,
    `color: white; background-color: grey; padding: 0 0.5em;`,
    JSON.stringify({name: 'Zhentian'}));