<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Gurjot Singh</title>
    <description>The latest articles on DEV Community by Gurjot Singh (@gurjotsaini53).</description>
    <link>https://dev.to/gurjotsaini53</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F717874%2Ff31744ff-9d64-4228-aae1-9748a7757db9.jpeg</url>
      <title>DEV Community: Gurjot Singh</title>
      <link>https://dev.to/gurjotsaini53</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/gurjotsaini53"/>
    <language>en</language>
    <item>
      <title>If you are a JS developer, doing console.log , this can be a game changer</title>
      <dc:creator>Gurjot Singh</dc:creator>
      <pubDate>Sat, 18 Apr 2026 10:09:11 +0000</pubDate>
      <link>https://dev.to/gurjotsaini53/if-you-are-a-js-developer-doing-consolelog-this-can-be-a-game-changer-4dlb</link>
      <guid>https://dev.to/gurjotsaini53/if-you-are-a-js-developer-doing-consolelog-this-can-be-a-game-changer-4dlb</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3s5b48we4dwpnx46hlu1.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3s5b48we4dwpnx46hlu1.png" alt=" " width="800" height="1000"&gt;&lt;/a&gt;&lt;strong&gt;Lookman:&lt;/strong&gt; The Debugger You'll Actually Enjoy Using&lt;br&gt;
Logging shouldn't feel like a chore. We’ve all been there: peppering our code with console.log("here1"), console.log("data", data), and then spending twenty minutes trying to find where that specific log is coming from in the source code.&lt;/p&gt;

&lt;p&gt;Lookman is a lightweight, breakpoint-free JavaScript debugging utility designed to give you superpowers without the overhead of a heavy library.&lt;/p&gt;

&lt;p&gt;Why not just use console.log?&lt;br&gt;
Because Lookman does the heavy lifting for you:&lt;/p&gt;

&lt;p&gt;📍 Automatic Source Mapping: It tells you exactly which file and line the log came from.&lt;/p&gt;

&lt;p&gt;🔄 State Monitoring: It detects if a value changed since the last time that line ran.&lt;/p&gt;

&lt;p&gt;⏳ Async First: Pass it a Promise, and it logs the pending, resolved, and rejected states automatically.&lt;/p&gt;

&lt;p&gt;🚀 Installation&lt;br&gt;
No npm install fatigue here. Just grab the file and go.&lt;/p&gt;

&lt;p&gt;Bash&lt;/p&gt;

&lt;h1&gt;
  
  
  Copy lookman.js into your project
&lt;/h1&gt;

&lt;p&gt;cp lookman.js src/utils/lookman.js&lt;br&gt;
🔥 Quick Start&lt;br&gt;
JavaScript&lt;br&gt;
import { dbg } from './lookman.js';&lt;/p&gt;

&lt;p&gt;const user = { name: 'Alice', age: 30 };&lt;br&gt;
dbg(user, 'user'); &lt;/p&gt;

&lt;p&gt;// Output: [src/app.js:12] user [object] { name: 'Alice', age: 30 }&lt;br&gt;
The best part? dbg() returns the value, so you can wrap expressions without breaking your flow:&lt;/p&gt;

&lt;p&gt;JavaScript&lt;br&gt;
const result = dbg(calculateComplexMath(), 'math-check');&lt;br&gt;
✨ Power Features&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Reactive Watching (dbg.watch)
Stop wondering when a property gets mutated. Wrap an object in a Proxy and see every change in real-time.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;JavaScript&lt;br&gt;
const state = dbg.watch({ count: 0 }, 'state');&lt;br&gt;
state.count = 1; &lt;br&gt;
// ⚡ WATCH [app.js:5] state.count -&amp;gt; 1 (was: 0)&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Intelligent Promises
Don't write .then(res =&amp;gt; console.log(res)). Just wrap the fetch.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;JavaScript&lt;br&gt;
const data = await dbg(fetchUser(id), 'UserFetch');&lt;br&gt;
// ⏳ pending...&lt;br&gt;
// ✅ resolved (+88ms) { id: 1, name: 'Alice' }&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Change Detection
In a loop or a React render? dbg.silent() only barks when the value actually changes, saving your console from being flooded.&lt;/li&gt;
&lt;/ol&gt;

</description>
    </item>
  </channel>
</rss>
