Console Ninja - Your logs on steroids
Tags: javascript, webdev, vscode, extensions
Published: 2024-04-29 07:00:00

Good morning everyone and happy MonDEV! ☕

How did this past week go? Have you tried to set up any experiments leveraging Ollama?
During the conversations following the last newsletter, I received the question in different forms on how to manage the deployment of Ollama and its models once the project is online.
Although there are multiple ways to do it, it may be helpful to know that, both for local development and for the deployment phase, there is an [official docker image](https://hub.docker.com/r/ollama/ollama) ready to use. This should make it easier for everyone to work locally and then deploy afterwards!

Closing this parenthesis on last week, this Monday I want to dedicate it to a tool that in its simplicity, can make our workflow much more straightforward.
I think we all love the good old `console.log()`, used in our projects in various creative ways during debugging (yes, I'm looking at you, I know you prefer `console.log()` over a healthy debugger).
However, keeping an eye on every single log both in the code and in the preview sometimes can be time-consuming; wouldn't it be better instead to be able to access the log result directly in the editor, without having to follow the log flow in the browser console and track down the relevant line each time?

The tool for today does just that, improving our experience with console.log(): it is [Console Ninja](https://console-ninja.com/), an extension for VS Code that connects to the watcher of your projects and shows next to each `console.log()` in your editor, the corresponding result received during the code execution. This way it becomes much simpler and more direct to compare the live results.
Moreover, it doesn't only show the latest result; in fact, the results history is displayed, one next to the other, allowing to distinguish each time what the result was.

Actually, log in the editor is not limited to your `console.log()`, but also to Exceptions. Additionally, it integrates a well-structured console directly in VS Code, interfacing with all the previously suggested parts.

That's all, my advice is to go and try it out because as I said, this is a tool that in its simplicity improves our workflow, and this can only be verified by trying it out ;)
Let me know as always what you think and if you found it useful!

### Some updates

In the last few days, a couple of new things have come out among the various things I had planned, and as you know, I like to keep you updated!

First of all, as I announced, I started publishing on Dev.to the series of articles about developing applications with Tauri. In the first article, you can find a general introduction to the series and Tauri, as well as an analysis of the structure of a project developed with this toolkit. You can find it at [this link](https://dev.to/giuliano1993/learn-tauri-by-doing-part-1-introduction-and-structure-1gde).
I plan to release the next article in the series in a couple of weeks.

As always, every feedback is welcome.

Furthermore, I released a small update for the [Make-js-component extension for VS Code](https://marketplace.visualstudio.com/items?itemName=ghostylab.make-js-component-vscode); now you can create a new component starting from a selection made in your code; this way it will be easier to extract individual parts of code and directly create the related component!

![Make JS component from selection ](https://github.com/Giuliano1993/make-js-component-vscode/blob/3e06e033c52199e96bde624ba5decfeaff1cf2ab/reamdevideo/MJC-selection.gif?raw=true)

Also in this case, every contribution and feedback are welcome; if you have suggestions, improvement proposals, or find bugs, the project is totally open source so I leave you the [repo link](https://github.com/Giuliano1993/make-js-component-vscode) for anything.

With that said, I just have to wish you a good week!

Happy coding 0_1