Ramon van Sprundel
https://ramones.dev
Rust enthusiastZolaenMon, 16 Sep 2024 00:00:00 +0000A data-oriented resumeMon, 16 Sep 2024 00:00:00 +0000Unknown
https://ramones.dev/posts/json-resume/
https://ramones.dev/posts/json-resume/<p>Last night it was time to set up a new resume for the <em>very exciting</em> job market. I always end up spending 20 minutes digging through folders for my outdated Word document. Being greeted by the already-deprecated resume (and an initial attempt at battling Word's flawless layout) I began to wonder if there's a tool for this.</p>
<p>I don't blame Word though, it's just the only application I know that's decent at making documents. I've tried a few online editors, but they have the same problem as any other "free" product. Either it's paywalled, watermarked or extremely limited. And don't get me started on making an account for some client-side application.</p>
<h1 id="the-goal"><a class="zola-anchor" href="#the-goal" aria-label="Anchor link for: the-goal">The goal</a></h1>
<p>All I want as a software dev is to edit a few properties. I don't want to manually edit layouts. That's why I propose to split the resume into two parts. We have a stored object (JSON, TOML, YAML...) that contains all the information we'd want to display, and we can pass it through some other tool to generate a nice-looking resume.</p>
<p>Something like that already exists, though. The <a rel="noopener" target="_blank" href="https://jsonresume.org/">JSON resume</a> project focuses on an open-source initiative to create a JSON-based standard for resumes. There's even a <a rel="noopener" target="_blank" href="https://github.com/joshuatz/linkedin-to-jsonresume">LinkedIn importer</a>, which is what I started out with.</p>
<p>Setting up my own resume only took around an hour. You can store your resume on <a rel="noopener" target="_blank" href="https://gist.github.com">Gist</a>, and tweak your resume whenever you please.</p>
<h1 id="how-s-this-any-different-to-an-online-editor"><a class="zola-anchor" href="#how-s-this-any-different-to-an-online-editor" aria-label="Anchor link for: how-s-this-any-different-to-an-online-editor">How's this any different to an online editor?</a></h1>
<p>The difference is that we now have a <a rel="noopener" target="_blank" href="https://jsonresume.org/schema">standard</a> that we can build on top of. We now have a structure that any jsonresume-compliant app can work with.</p>
<p>The goal of that app is dependent on what you want to do with it. For example, you could serve your resume as a single HTML file and some inline CSS, or you could build an entire portfolio on top of your resume. I've seen some embedded project online where someone stored the JSON on an arduino and displayed their resume on an LCD screen?</p>
<h1 id="alright-but-i-use-a-pdf"><a class="zola-anchor" href="#alright-but-i-use-a-pdf" aria-label="Anchor link for: alright-but-i-use-a-pdf">Alright, but I use a PDF</a></h1>
<p>I've read on LinkedIn before that "links to resumes are more often than not disregarded by recruiters", whatever that means.
Nonetheless, I know recruiters typically prefer PDFs. Luckily there are enough methods to convert HTML to PDF. <a rel="noopener" target="_blank" href="https://pptr.dev/">Puppeteer</a> is one of them.</p>
<p>Here's an example I cooked up in a few minutes:</p>
<pre data-lang="js" style="background-color:#2b303b;color:#c0c5ce;" class="language-js "><code class="language-js" data-lang="js"><span style="color:#b48ead;">import </span><span style="color:#bf616a;">puppeteer </span><span style="color:#b48ead;">from </span><span>"</span><span style="color:#a3be8c;">puppeteer</span><span>";
</span><span>
</span><span style="color:#b48ead;">const </span><span style="color:#bf616a;">browser </span><span>= </span><span style="color:#b48ead;">await </span><span style="color:#bf616a;">puppeteer</span><span>.</span><span style="color:#8fa1b3;">launch</span><span>();
</span><span style="color:#b48ead;">const </span><span style="color:#bf616a;">page </span><span>= </span><span style="color:#b48ead;">await </span><span style="color:#bf616a;">browser</span><span>.</span><span style="color:#8fa1b3;">newPage</span><span>();
</span><span>
</span><span style="color:#b48ead;">const </span><span style="color:#bf616a;">url </span><span>= "</span><span style="color:#a3be8c;">https://registry.jsonresume.org/[your-github-username]</span><span>"; </span><span style="color:#65737e;">// make sure you have a resume.json gist
</span><span style="color:#b48ead;">await </span><span style="color:#bf616a;">page</span><span>.</span><span style="color:#8fa1b3;">goto</span><span>(</span><span style="color:#bf616a;">url</span><span>, { waitUntil: "</span><span style="color:#a3be8c;">networkidle0</span><span>" });
</span><span style="color:#b48ead;">await </span><span style="color:#bf616a;">page</span><span>.</span><span style="color:#8fa1b3;">pdf</span><span>({ path: "</span><span style="color:#a3be8c;">resume.pdf</span><span>", format: "</span><span style="color:#a3be8c;">a4</span><span>", printBackground: </span><span style="color:#d08770;">true </span><span>});
</span><span style="color:#b48ead;">await </span><span style="color:#bf616a;">browser</span><span>.</span><span style="color:#96b5b4;">close</span><span>();
</span></code></pre>
<h1 id="shameless-self-insert"><a class="zola-anchor" href="#shameless-self-insert" aria-label="Anchor link for: shameless-self-insert">Shameless self-insert</a></h1>
<p>I haven't found any CLI tool that's a simple "download-and-run" deal, so I ended up implementing my own called <a rel="noopener" target="_blank" href="https://github.com/van-sprundel/ferrisume">ferrisume</a>(ferris + resume). If you have a bug (or maybe some critique) make sure you submit an issue.</p>
My first postMon, 09 Sep 2024 00:00:00 +0000Unknown
https://ramones.dev/posts/first/
https://ramones.dev/posts/first/<p>Nothing much to see here. You should check out my <a href="/projects">projects</a>!</p>
<br/>
<div class="note-container">
<div class="note-header">
<div class="note-icon">
<p>Thanks for reading!</p>
</div>
</div>
<div class="note-content">
<p>Have a cat as a gift.</p>
</div>
</div>
<p><img src="/imgs/cat.png" alt="Cat" /></p>