I'm a stalwart Terminal fan for my Engineering tasks. I don't understand why so many colleagues prefer a Terminal emulator like SecureCRT when we have native SSH built right into the OS. Something a lot of SecureCRT guys hold over my head is the nested folders with saved SSH sessions.
It dawned on me this morning that I could duplicate that functionality in something I'm already using: Brett Terpstra's Cheaters.
I won't get into an in-depth review of Cheaters, here. Simply put, it's a small app that launches a web view of a locally-hosted set of websites. Brett's suggestion is to use it as a place to keep cheatsheets (hence the name), like a virtual cubicle wall.
I used a little grep
and sed
on our existing hosts file, and came up with a Markdown list of links to the hostnames of our devices, using the following syntax:
[hostname.domain.com](ssh://hostname.domain.com)
I spent a couple minutes sorting the list into a reasonable hierarchy, then I used this nice little tutorial to create expanding lists using CSS and jQuery. I ran my Markdown list through Brett's own Marked 2, and copied the HTML to a new cheatsheet.
I took the CSS and javascript from the tutorial linked above, and dropped them into the appropriate folders inside of my Cheaters folder. In my new cheatsheet, I linked the specific CSS and javacscript:
<head data-preserve-html-node="true">
<link data-preserve-html-node="true" rel="stylesheet" href="css/expandolist.css">
<script data-preserve-html-node="true" type="text/javascript" src="js/expandolist.js"></script>
</head>
I didn't need to worry about jQuery, since Cheaters already uses it. I added the appropriate ID's to the div
that holds the list, and to the first ul
element. That's really all there was to it. Now I have a nice, organized, expandable list that lives in my menubar, which I can use to launch SSH sessions right in Terminal without having to remember specific hostnames. Not bad for 45 minutes of effort.
<div
class="
image-block-outer-wrapper
layout-caption-below
design-layout-inline
"
data-test="image-block-inline-outer-wrapper"
>
<figure
class="
sqs-block-image-figure
intrinsic
"
style="max-width:704.0px;"
>
<div
style="padding-bottom:80.3977279663086%;"
class="
image-block-wrapper
has-aspect-ratio
"
data-animation-role="image"
data-animation-override
>
<noscript><img src="https://cdn.uploads.micro.blog/1894/2020/900a6877e2.jpg" alt="My Cheaters SSH list" /></noscript><img class="thumb-image" data-src="https://cdn.uploads.micro.blog/1894/2020/900a6877e2.jpg" data-image="https://cdn.uploads.micro.blog/1894/2020/900a6877e2.jpg" data-image-dimensions="704x566" data-image-focal-point="0.5,0.5" alt="My Cheaters SSH list" data-load="false" data-image-id="5421916ce4b05046224d772d" data-type="image" />
</div>
<figcaption class="image-caption-wrapper">
<div class="image-caption"><p>My Cheaters SSH list</p></div>
</figcaption>
</figure>
</div>