Some console command you might not know

I'm a full-stack developer from South Africa 🇿🇦. I love writing about JavaScript, HTML and CSS.
Search for a command to run...

I'm a full-stack developer from South Africa 🇿🇦. I love writing about JavaScript, HTML and CSS.
Indeed they are console.logs are still my goto debug thing 😂
Most of you know me for my consistency, a golden arrow in my blog series. I've written 1000 articles in 1008 days! Almost an article a day, and my honeymoon was the only holiday I ever took. I'm super proud of this achievement; it has been a fantasti...

It's not the first time I'll be talking about community. I think it's an essential aspect of any successful tool. This shows in my previous explorations of Astro, Medusa, and now Vendure as well. All these products thrive in a super open, welcoming, ...

The cool part about Vendure is how easy it is to set up and how abstract each layer is. Basically, we get the following elements: External database Server Worker Admin UI Frontend While this is amazing, it also brings a bit of complexity when it co...

The previous article looked at customizing Vendure on a data and process level. In this article, we'll look at customizing emails, as they are often a big part of a webshop system. We'll be looking at two different layers of customization for customi...

Even though Vendure is a pretty significant project out of the box, in some cases, we might want to go in and modify some elements to work to our specific use case. In this article, I'll take a high-level look at some elements we can customize within...

When it comes to debugging code, there are many options, but I find myself relying on console.logs quite often.
It's a quick and complete way to log a data set at a certain point or see where the code returns.
By all means, it may not be the best way, but it's widely used.
Did you know you can do more than a plain console.log?
A super handy console command is to group-specific logs.
You can easily start a new group with console.group('name') and end it with console.groupEnd('name').
The name of the group can be any string you would like it to be.
An example can look like this:
console.group('test group');
console.log('log line 1');
console.error('Something went wrong in the group');
console.groupEnd('test group');
This will show up as:

Ever needed to display a giant JSON array? It can be tedious the show a larger array in the console.
But there is an option to display this as a table.
const myArray = [
{
title: 'Article 1',
views: 400,
url: 'https://daily-dev-tips.com/article-1'
},
{
title: 'Article 2',
views: 6500,
url: 'https://daily-dev-tips.com/article-2'
}
];
console.table(myArray);

Another super useful command is the console.count command.
It can be used to count how often a loop is run, for instance.
for (let i = 0; i < 5; i++) {
// Do something
console.count('loop one');
}
You can provide a label as we did above.

Besides your default console.log, you might want to show data a little differently. Hence you can use one of the following to make it appear so:
console.infoconsole.debugconsole.warnconsole.errorThey will show up like this:

Note: The info used to have its own icon but seems to be mixed with a regular log now.
With these, you can easily filter on the different levels.

There are some other console commands that can be useful.
And some we might cover in a later stage:
Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on Facebook or [Twitter](https://twitter.com/DailyDevTips1