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

mr-hyde

v0.1.1

Published

a stateful, jekyll-friendly cms parser for javascript

Downloads

15

Readme

hyde

a stateful, jekyll-friendly cms parser for javascript

info

pipeline

  • The site: https://anulman.com/www.aidans.computer
  • Auto-builds + deploys with Travis: https://github.com/anulman/www.aidans.computer/blob/master/.travis.yml#L30-L40
  • Using ember-cli-hyde to funnel root dirs through the Hyde compiler, merging output into the public tree: https://github.com/anulman/ember-cli-hyde/blob/master/index.js#L23-L41
    • dir values are configurable via config/environment.js, and defaults to [content]
  • The compiler filters and processes relevant files, emitting .json metadata + .md bodies where appropriate: https://github.com/anulman/broccoli-hyde-compiler/blob/master/src/index.js#L25-L50
  • And Hyde's parser parses the markdown into content + metadata, and builds + tracks the context's collections (eg recursive parents, tags): https://github.com/anulman/hyde/blob/master/src/parser.js#L15-L38
    • test suite covers everything but serialization, pending consideration of an upstream contrib

ember users

  • e-cli-hyde exposes a default adapter (w companion models): https://github.com/anulman/ember-cli-hyde/tree/master/app/adapters
  • So you can findAll or findRecord accordingly: https://github.com/anulman/www.aidans.computer/blob/master/app/pods/content/item/route.js#L7
  • When you render a markdown-section with an item: https://github.com/anulman/www.aidans.computer/blob/master/app/pods/content/item/template.hbs#L5
  • The component fetches + loads the markdown separately from metadata: https://github.com/anulman/ember-cli-hyde/blob/master/addon/components/markdown-section.js#L22-L42
    • I'm hoping to extend this to support a skeletal UI, eg for loading states
  • e-cli-hyde will consume a root-level content dir by default: TODO LINK
    • This is configurable in e-cli-build.js ({ hyde: { directories: [] } }): TODO LINK
  • If prember is installed, e-cli-hyde will generate URLs for configured directories
    • This is configurable in e-cli-build.js ({ hyde: { prember: [] } }): TODO LINK
    • Config objects resemble { name: 'content', prefix: 'foo', itemPrefix: 'bar', collectionPrefix: 'baz' }: TODO LINK
    • If a config object is a string (vs object), it uses the default { name, collectionPrefix: true } config: TODO LINK
    • Set { hyde: { prember: false } } to disable prember builds: TODO LINK

sample code

  • Sample input dir: https://github.com/anulman/www.aidans.computer/tree/master/content
  • Results in output dir: https://github.com/anulman/www.aidans.computer/tree/gh-pages/hyde