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

artistry-code-style

v0.0.8

Published

A VS Code hack project to facilitate the artistry style guide.

Downloads

3

Readme

Artistry Code Style

This repository contains the necessary files required to use the Artistry code style. Most code styles (especially Prettier) are designed around the belief that while code formatting is something that should be consistent, it isn't something that programmers should spending time thinking about. This seems to be the generally accepted belief within the programming community.

In one man's humble opinion, this idea is reminiscent of the pre-Apple renaissance era of computing when "UX" wasn't an established term, software aesthetic was considered a superfluous nice-to-have, and the prevailing belief that "it doesn't matter what it looks like, only that it works".

The Artistry code is was designed around the contrarian idea that code formatting and code beauty is something that programmers should spend time thinking about. The aesthetic quality of the code in some ways is as important as the algorithms themselves. Writing code in an environment where code aesthetic is intentional, respected, and sought-after breeds a culture of craftsmanship. When code aesthetic isn't a focal point of the team, it tends to breed a culture of carelessness. And while these teams can deliver code assets that function, they tend to be lacking in thoughtfulness.

Installation

NPM

The default export contains all of our ESLint rules.

It requires:

npm install artistry-code-style --save-dev

After installing, you'll need to include a .eslintrc.js file in the root directory of your project that contains the following code:

module.exports = {
	"extends": require.resolve("artistry-code-style"),
	"env": {
		"browser": true,
		"node": true,
		"es6": true
	}
}

Contents

This package contains:

  • A JavaScript and CSS file that words in tandem with the VSCode Custom CSS extension. This extension hacks VS Code to allow you to shoehorn in your own code into the internal Monaco code editor.
  • The Open Sans Code font, which is a derivation of the `Open Sans'.
  • ESLint rules

Formatting Guide

Developing ESLint rules to enforce the entire gamut of formatting rules will be a long process. To see an example of how conforming code should be formatted, see FormattingByExample.ts.

Development

This repository is under active development, as we're always adding new ESLint rules. Here are some helpful resources to get started building custom ESLint rules:

https://www.kenneth-truyers.net/2016/05/27/writing-custom-eslint-rules/

https://flexport.engineering/writing-custom-lint-rules-for-your-picky-developers-67732afa1803

https://insideops.wordpress.com/2015/12/08/creating-custom-rules-for-eslint/