npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jsonresume-theme-stackoverflowed

v1.1.5

Published

A JSON Resume Theme inspired by the Stack Overflow Developer Story resume format.

Downloads

102

Readme

NPM Package Version GitHub Repository Changelog GitHub Workflow Status (main) Test Coverage

jsonresume-theme-stackoverflowed

A JSON Resume Theme inspired by the Stack Overflow Developer Story resume format.

Motivation

Sadly the Stack Overflow team decided to discontinue the Jobs and Developer Story platform on March 31, 2022. Having had much career success particularly thanks to their product this came as disappointing news - there is something about this resume format that seems to translate well with recruiters, so with a little artistic license this project aims to create a faithful replica that is compatible with the Resume CLI tool.

Sample

Screenshot: Resume Sample

Getting Started

Start a new project and install the following dependencies.

npm install resume-cli jsonresume-theme-stackoverflowed

Optionally generate some sample data if not starting with an existing resume.

npx resume init

Add some workflow scripts to the package.json

{
    "scripts": {
        "validate": "resume validate --resume ./resume.json",
        "serve": "resume serve --resume ./resume.json --theme stackoverflowed",
        "export": "resume export --resume ./resume.json --theme stackoverflowed",
        "pdf": "$npm_execpath run export -- --format pdf \"./$(date +'%Y-%m-%d').pdf\"",
        "html": "$npm_execpath run export -- --format html \"./$(date +'%Y-%m-%d').html\""
    }
}

Happy job hunting...

npm run <script>

⚠️  Windows users: the resume-cli tool and puppeteer combo is difficult to get running in WSL and not reliable when generating PDFs - A linux virtual machine is recommended in this case.

Environment Configuration

StackExchange

This theme can make requests to fetch a short summary of contributor activity that will be displayed underneath a StackOverflow profile entry when a valid url is specified. By default this behaviour is switched off due to the API throttling, limiting anonymous requests to 300 per day. However this should be okay for occasional use and can be explicitly enabled by setting the key to anon.

STACK_EXCHANGE_API_KEY=anon
STACK_EXCHANGE_ACCESS_TOKEN=

Resume Configuration

The JSON Resume schema allows space for arbitrary meta data. This theme will consume a custom configuration from JSON defined under the following namespace, all further parameters listed on this page will assume that they are configured at this level. For the avoidance of doubt a sample configuration is available, which matches the default values if otherwise unspecified.

{
    "meta": {
        "theme-stackoverflowed": {
            /* configuration */
        }
    }
}

Localisation

{
    "locale": string
}

localestring

A language (e.g. en) or regional variant (e.g. en-GB) that will localise dates and text content.

  • defaults to en-US

Formatting

{
    "format": {
        "date": string,
        "location": string | string[]
    }
}

format.datestring

A date-fns format for rendering dates.

format.locationstring | string[]

A template or list of templates (fallbacks) that will be passed the values of basics.location from the resume - interpolated keys use the syntax {{var}}. In addition to the schema properties, the following keys are also available.

| Key | Description | | --------------------- | ----------------------------------------------------- | | countryNameAlias | A colloquial name resolved from the countryCode. | | countryNameOfficial | A full country title resolved from the countryCode. |

If it is preferable to split an address across multiple lines, this can be achieved by inserting a newline character in the template - note that this needs to be doubly escaped to be valid JSON.

{
    "format": {
        "location": "{{address}}, {{postalCode}} \\n {{city}}, {{region}}"
    }
}

Introduction

{
    "intro": {
        "avatar": {
            "align": string,
            "hidden": boolean
        }
    }
}

intro.avatar.alignstring"left" | "right"

By default the avatar will align to the right of the address and contact details - however can be configured to align to the left of the name and title.

intro.avatar.hiddenboolean

All resume data will be displayed by default, where content exists - if a profile image is not available, then this theme will lookup a Gravatar for the email listed under the basics profile data. However if it is preferable to hide a profile image then the hidden option can be set to true.

Sections

{
    "section": {
        [string]: {
            "order": number
            "break": boolean
            "hidden": boolean
        }
    }
}

Sections map directly to resume schema fields and the currently supported names are: skills | work | volunteer | projects | education | awards | publications | languages | interests | profiles | references. Sections are only rendered if there is sufficient data for each in a given resume.

section.<name>.ordernumber

Sections are by default laid out with the same priority as stated above - each section relevant to a resume will be assigned a number (starting from 1). This may be overridden on a per-section basis to customise the order.

section.<name>.breakboolean

Sometimes a page break may split a section in an awkward place - this is difficult to compensate for programmatically given the unknown nature of the configuration and / or data being rendered. As such, this escape hatch allows a section to force a page break (above) by setting it to true.

section.<name>.hiddenboolean

If it is preferable to maintain data in a resume but not have it rendered, a section can be disabled by setting this to true.