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

@juvoni/gatsby-theme-networked-thought

v0.4.4

Published

<h1 align="center"> gatsby-theme-networked-thought </h1>

Downloads

99

Readme

lint code style: prettier npm Twitter URL

This theme is inspired by the work of Andy and is based on on the work done by gatsby-theme-brain, gatsby-theme-andy and react-stacked-pages-hook.

It also works very well with Obsidian as an authoring tool, which I am personally using.

✨ Features

🔗 Double square bracket linking (Case insensitive, Hierarchy support. ex: [[Stocks/AAPL]])

📰 Frontmatter allows defining title and aliases

🌗 Light\Dark theme

✨ Gatsby v3 and gatsby-plugin-image

🚀 Getting Started

  • Start a new Gatsby website (manually or using a starter like the default starter)
  • Add the theme as dependency: yarn add gatsby-theme-networked-thought
  • Edit gatsby-config.js and add gatsby-theme-networked-thought as a plugin (see options documentation below). Also make sure siteMetadata has the following:
  siteMetadata: {
    title: `My Networked Thoughtsd`,
    description: `These are my thoughts...`,
    author: "John dow",
    twitter: `jdow`,
  },
  • Create a content/thoughts folder at the and add about.md.
  • Run your gatsby site and point the browser to the rootPath (which is / by default so http://localhost:800/ should do it)

🎓 Usage

| Option | Default Value | Description | | -------------------- | --------------------------------- | ------------------------------------------------------------------------------------------------------- | | thoughtsDirectory | "content/thoughts/" | Directory containing your networked thoughts notes. | | exclude | [] | List of strings or regular expressions. Notes files whose names match these will be ignored. | | excludeAsPrivate | [] | List of strings or regular expressions. Notes files whose names match these will be considered private. | | privateMarkdown | "This note is a [[private note]]" | The markdown text to show on private notes when instead of their content. | | showPrivateLocally | true | Boolean. Determines whether to show private notes when not running in production. | | showHiddenLocally | true | Boolean. Determines whether to show hidden notes when not running in production. | | rootPath | "/" | Set the root url for the brain on your site (e.g. in this case https://example.com/) | | rootThought | "about" | Name of the 'index' note. So in this case about.md would generate the root page. | | generateSlug | (filename) => slugify(filename) | Function used to turn the filename of a note into its resulting slug (path) |

Feature Details

Double square-bracket linking

The core feature of taking networked thoughts notes - any piece of text wrapped in double square-brackets (ex: [[some thought]]) will turn into a link to a page on that topic. If the page already exists it will link to that, if not it will create a new empty page. When generating that page, a reference is created back to the linking page.

This means that you can create new topics without any content backing them and start linking to them from different pages on your networked thought graph. These "empty thoughts" will still be backlinked to wherever you linked to them from. This makes it easy to start linking together future-notes without having to write them at that moment.

Links are:

  • Case Insensitive - so for example [[Apple]] and [apple] lead to the same page.
  • Support folder hierarchies - So for example, [[Company/Apple]] would link to <root content folder>/company/apple.md

Frontmatter Support

Frontmatter properties allow you to customize the page generation from the given markdown. For example Evergreen Notes.md could contain:

---
title: "Evergreen Notes"
aliases: ["evergreen", ""]
---

Frontmatter supported properties:

  • title - By default the page's title is its slug unless given a value.
  • aliases - Allows adding aliases to a given page. In the example above, because there's an alias you could use [[evergreen]] to link to the page Evergreen Notes.md represents.
  • private - Boolean. Whether the note is private or not.
  • hidden - Boolean. Whether the note is hidden or not.
  • showReferences - Boolean. Whether we want to show references to this note.

Run example

gatsby new my-theme https://github.com/gatsbyjs/gatsby-starter-theme-workspace
cd my-theme
yarn workspace example develop