<?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: britz</title>
    <description>The latest articles on DEV Community by britz (@12britz).</description>
    <link>https://dev.to/12britz</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.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3842116%2Fd884053e-1730-4472-883b-c9753850f640.jpeg</url>
      <title>DEV Community: britz</title>
      <link>https://dev.to/12britz</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/12britz"/>
    <language>en</language>
    <item>
      <title>I built "sysview" — a beautiful terminal system monitor for developers</title>
      <dc:creator>britz</dc:creator>
      <pubDate>Wed, 08 Apr 2026 13:41:23 +0000</pubDate>
      <link>https://dev.to/12britz/i-built-sysview-a-beautiful-terminal-system-monitor-for-developers-3h08</link>
      <guid>https://dev.to/12britz/i-built-sysview-a-beautiful-terminal-system-monitor-for-developers-3h08</guid>
      <description>&lt;p&gt;Every developer has been there: you're deep in a debugging session, your laptop fan is screaming, and you need to know &lt;em&gt;right now&lt;/em&gt; — which process is eating your CPU, what port is blocking your server, how much RAM is left.&lt;/p&gt;

&lt;p&gt;You open five different tools or start copy-pasting &lt;code&gt;lsof&lt;/code&gt; and &lt;code&gt;ps aux | grep&lt;/code&gt; incantations from memory.&lt;/p&gt;

&lt;p&gt;There had to be a better way.&lt;/p&gt;

&lt;p&gt;So I built &lt;strong&gt;sysview&lt;/strong&gt; — a TypeScript-based CLI that gives you a color-coded, opinionated view of your entire system in one command. No dashboards to set up, no agents to install, no config files.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm &lt;span class="nb"&gt;install&lt;/span&gt; &lt;span class="nt"&gt;-g&lt;/span&gt; @12britz/sysview
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  💡 Why I built this
&lt;/h2&gt;

&lt;p&gt;My day job involves performance testing at scale — running load tests, monitoring resource exhaustion, diagnosing bottlenecks on Linux servers and dev machines alike.&lt;/p&gt;

&lt;p&gt;Tools like &lt;code&gt;htop&lt;/code&gt; are great but don't give you quick CLI-composable output. &lt;code&gt;lsof -i -n -P&lt;/code&gt; works but the output is a wall of text. &lt;code&gt;df -h&lt;/code&gt;, &lt;code&gt;free -m&lt;/code&gt;, &lt;code&gt;ps aux&lt;/code&gt; — you're constantly context-switching between commands.&lt;/p&gt;

&lt;p&gt;I wanted something that felt like a &lt;strong&gt;developer's version&lt;/strong&gt; of a system monitor:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Opinionated defaults&lt;/li&gt;
&lt;li&gt;Clear color coding (green = good, yellow = watch out, red = fix this)&lt;/li&gt;
&lt;li&gt;Progress bars for quick visual scanning&lt;/li&gt;
&lt;li&gt;A &lt;code&gt;watch&lt;/code&gt; mode for continuous monitoring&lt;/li&gt;
&lt;li&gt;Git context, because I'm almost always inside a repo&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  ✨ What sysview does
&lt;/h2&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Command&lt;/th&gt;
&lt;th&gt;What you get&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview ports&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Listening ports — process name, PID, address&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview memory&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;RAM usage with visual progress bar&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview cpu&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Model, speed, load, per-core breakdown&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview disk&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;All mounted volumes with usage %&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview network&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Active network connections&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview ps&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Processes sorted by CPU or memory&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview top&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Interactive real-time process monitor&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview git&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Status, branches, log, remotes, diff, contributors&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;`sysview kill &amp;lt;pid\&lt;/td&gt;
&lt;td&gt;port&amp;gt;`&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview watch&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Real-time dashboard with configurable refresh&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;sysview dashboard&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Full system overview in one screen&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;




&lt;h2&gt;
  
  
  🚀 Quick tour
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Ports — no more &lt;code&gt;lsof&lt;/code&gt; archaeology
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight console"&gt;&lt;code&gt;&lt;span class="go"&gt;❯ sysview ports

┌──────────────────────────────────────────────────┐
│            sysview - ports                        │
└──────────────────────────────────────────────────┘

┌──────────┬────────────────────┬──────────┬────────────────────┬──────────┐
│ PORT     │ PROCESS           │ PID      │ ADDRESS            │ STATUS   │
├──────────┼────────────────────┼──────────┼────────────────────┼──────────┤
│ :3000    │ node              │ 42872    │ 127.0.0.1          │ ● LISTEN │
│ :5432    │ postgres          │ 99101    │ 127.0.0.1          │ ● LISTEN │
│ :6379    │ redis-server      │ 87321    │ 0.0.0.0            │ ● LISTEN │
└──────────┴────────────────────┴──────────┴────────────────────┴──────────┘

4 ports listening
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Memory — at a glance
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight console"&gt;&lt;code&gt;&lt;span class="go"&gt;❯ sysview memory

┌────────────────────┬───────────────┬───────────────┬───────────────┬──────────┐
│ TYPE               │ USED         │ TOTAL         │ FREE          │ USAGE    │
├────────────────────┼───────────────┼───────────────┼───────────────┼──────────┤
│ Physical Memory    │ 16.4 GB      │ 64 GB         │ 47.6 GB       │ 25.6%    │
└────────────────────┴───────────────┴───────────────┴───────────────┴──────────┘

██████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ 25.6%
55.8 GB available
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  CPU — model, load, per-core
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight console"&gt;&lt;code&gt;&lt;span class="go"&gt;❯ sysview cpu

┌──────────────────────────────┬────────────────────┐
│ METRIC                       │ VALUE              │
├──────────────────────────────┼────────────────────┤
│ Model                        │ Apple M1 Max       │
│ Cores                        │ 10                 │
│ Speed                        │ 2.4 GHz            │
│ Current Load                 │ 11.6%              │
│ Running Processes            │ 587                │
└──────────────────────────────┴────────────────────┘

Load: █████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ 11.6%

Per-Core Usage:
┌──────────┬──────────────────────────────────────────────────┐
│ CORE 0   │ ███████████████░░░░░░░░░░░░░░░░░░░░░░░░ 38.7%  │
│ CORE 1   │ ███████████████░░░░░░░░░░░░░░░░░░░░░░░░ 38.0%  │
│ CORE 2   │ ██████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ 13.9%    │
│ CORE 3   │ ████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░  9.3%    │
└──────────┴──────────────────────────────────────────────────┘
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Git — your repo at a glance
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight console"&gt;&lt;code&gt;&lt;span class="go"&gt;❯ sysview git --all

Branch:  main
Status:  Clean working tree
Ahead: 0   Behind: 0

Recent Commits:
│ a4f92c1  feat: add dashboard watch mode          2h ago
│ b3e81d2  fix: process tree edge case on linux    5h ago
│ c7d90a3  chore: update README with examples      1d ago

Contributors:
│ 12britz   ██████████████████  24 commits
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;💡 &lt;strong&gt;Performance tip:&lt;/strong&gt; I run &lt;code&gt;sysview watch --start -i 500&lt;/code&gt; during local load tests to watch CPU and memory trends in real time alongside my k6 output. The 500ms refresh is smooth with negligible overhead.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  🔧 Tech stack
&lt;/h2&gt;

&lt;p&gt;The whole thing is &lt;strong&gt;TypeScript&lt;/strong&gt; with a clean &lt;code&gt;src/&lt;/code&gt; structure, compiled and published to npm.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://github.com/sebhildebrandt/systeminformation" rel="noopener noreferrer"&gt;&lt;code&gt;systeminformation&lt;/code&gt;&lt;/a&gt; — cross-platform OS metrics (abstracts macOS vs Linux beautifully)&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/cli-table/cli-table3" rel="noopener noreferrer"&gt;&lt;code&gt;cli-table3&lt;/code&gt;&lt;/a&gt; — the colorful bordered tables&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/chalk/chalk" rel="noopener noreferrer"&gt;&lt;code&gt;chalk&lt;/code&gt;&lt;/a&gt; — terminal color output&lt;/li&gt;
&lt;li&gt;Raw TTY writes for flicker-free &lt;code&gt;top&lt;/code&gt; and &lt;code&gt;watch&lt;/code&gt; modes&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Works on &lt;strong&gt;macOS&lt;/strong&gt; and &lt;strong&gt;Linux&lt;/strong&gt;, Node.js ≥ 16.&lt;/p&gt;




&lt;h2&gt;
  
  
  🤔 What's next
&lt;/h2&gt;

&lt;p&gt;A few things I'm thinking about:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;&lt;code&gt;--json&lt;/code&gt; flag&lt;/strong&gt; on every command — so you can pipe sysview output into scripts or CI pipelines&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Threshold alerts&lt;/strong&gt; in &lt;code&gt;watch&lt;/code&gt; mode — flash a warning when CPU crosses 80% instead of passively showing it&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Process search&lt;/strong&gt; — &lt;code&gt;sysview ps node&lt;/code&gt; to fuzzy-filter by name instantly&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  ⭐ Try it out
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# Install globally&lt;/span&gt;
npm &lt;span class="nb"&gt;install&lt;/span&gt; &lt;span class="nt"&gt;-g&lt;/span&gt; @12britz/sysview

&lt;span class="c"&gt;# Full system overview&lt;/span&gt;
sysview dashboard

&lt;span class="c"&gt;# See what's listening&lt;/span&gt;
sysview ports

&lt;span class="c"&gt;# Watch everything in real time&lt;/span&gt;
sysview watch &lt;span class="nt"&gt;--start&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;If you spend any time in the terminal — especially if you do performance work, backend dev, or just get annoyed running five commands to understand your own machine — give it a shot. It's one global install, zero config.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;📦 &lt;strong&gt;npm:&lt;/strong&gt; &lt;a href="https://www.npmjs.com/package/@12britz/sysview" rel="noopener noreferrer"&gt;npmjs.com/package/@12britz/sysview&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;⭐ &lt;strong&gt;GitHub:&lt;/strong&gt; &lt;a href="https://github.com/12britz/sysview" rel="noopener noreferrer"&gt;github.com/12britz/sysview&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Drop a star if it's useful — it's MIT licensed, fork it and make it your own.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;Feedback and PRs welcome.&lt;/em&gt;&lt;/p&gt;

</description>
      <category>cli</category>
      <category>sre</category>
      <category>terminal</category>
      <category>opensource</category>
    </item>
  </channel>
</rss>
