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

generator-nova

v0.0.2

Published

Generate and serve your project in a blink of an eye

Downloads

2

Readme

This project is based on the Bangular generator

Nova is a simple, yet efficient generator, used to scaffold web projects.

Nova is still under heavy development.
Tests may be broken.

Features:

  • Sub-generators for route, api, directive, service, and plenty others...
  • Express server with nested routing architecture.
  • Nodemon with LiveReload or BrowserSync for the development process.
  • Automatic bower dependencies injection on package install.
  • Test suite — Unit tests with Karma & Mocha, e2e tests with Protractor.
  • JSHint & JSCS integration.
  • Sass support.
  • Fast build, like, real fast.

Optional:

Install

npm install -g nova-generator
yo nova

Table of contents

Manage project

gulp

Default task, run the server. Build sass files, inject all scripts and styles to the project, watch them and open your default browser.

gulp build

Wipe old generated dist directory while keeping the .git to preserve your remotes configuration. Concat all the scripts and vendors in one minified .js file, same thing for your styles. Rev all resources for caching purposes; copy the server part.

gulp preview

Run the gulp build process and serve the dist directory.

gulp test [--client || --server]

Launch client and server tests, using Karma and Mocha, both by default.

gulp control

Validate the app through JSHint and JSCS.

gulp bump [--major || --minor || --patch]

Bump versions of package.json and bower.json files using Semantic Versioning and commit them. Default to patch.

gulp e2e

Launch your server and then run protractor tests. See protractor howtos.

Generators

App

This is the main generator of Nova, that will scaffold entierely your project based on your needs.

yo nova || yo nova <appName>

Backend type: MongoDB / Restock / Json Modules : angular-cookies || angular-resource || angular-sanitize || angular-animate Socket.IO : Do you want to integrate sockets in your app?

Directive

yo nova:directive <name>

The name parameter is required. Directives will be generated at client/directives/. You can specify if your directive needs an html template or not.

Filter

yo nova:filter <name>

The name parameter is required. Filters will be generated at client/filters/.

Font

yo nova:font <name>

The name parameter is required. Fonts will generate a new folder in client/assets/fonts/ and a .scss file importing all of these fonts in your app. It will be imported in your app.scss file either on top of the file or after the // imports mark if specified.

Route

yo nova:route <name>

Url: Client url to access the route.

The name parameter is required. This will create in client/views/:

name
├ name.js
├ name.controller.js
├ name.spec.js
├ name.e2e.js
└ name.html

Service

yo nova:service <name>
yo nova:factory <name>

The name parameter is required. The service / factory and its spec file will be generated at client/services/.

Style

yo nova:style <name>

Inject: If true, an @import will be added to the main app.scss file to add the style to your app. You can specify the location of your new imports by adding a // imports in the file.

The name parameter is required. This will create a new .scss file in he client/styles/ folder.

Animation

yo nova:anim <name>

Creates an angular animation file in client/animations/. You can choose which event(s) you want to capture, including enter, leave, move, addClass, removeClass.

You need to have ngAnimate as dependency.

Api

yo nova:api <name>

Url: Route that will be exposed on your server to access this ressource. Socket: If you want to emit socket event on model changes (only with mongo & sockets). Resource: If you want to scaffold a basic $resource for this route (only with ngResource).

The name parameter is required. A name folder will be created at server/api/.

HOWTOs

Protractor

First, you will have to run the gulp e2e:update command to update the chromedriver and the selenium jar. Since the path to the jar is hardcoded in the protractor.conf.js file and the version is susceptible to change, you will potentially have to update the version number. For people which have multiple Chrome installed, you can specify the path to the binary in the configuration. You can now run gulp e2e, remember to stop your server since it will automatically create a new one.

Sockets

To use the sockets, you have to confirm the option on project generation. Yet, it's only when you've selected the mongo backend that you can be prompted by this config.

This will initialize all the server part and create a Socket factory in the client. On each new api you create, you can choose to load the sockets for this model. It will then emit socket events on update and remove of documents of this model.

The sockets can be quickly usable in your controllers, here is an example with a simple item.

Passport

On project generation, you can integrate passport authentification in your app. It will create default views for the signup and login. You can easily protect your routes for a connected user by adding the isAuthenticated middleware on it.

Architecture

client
├ animations/
├ assets
│  ├ images/
│  └ fonts/
├ bower_components/
├ directives/
├ filters/
├ services/
├ styles/
├ views/
├ app.js
├ index.html
└ .jshintrc
server
├ api/
├ config/
├ routes.js
├ server.js
└ .jshintrc
tasks
├ config/
└ *.js
bower.json
gulpfile.js
karma.conf.js
package.json
protractor.conf.js
.editorconfig
.gitignore
.jscsrc
.jshintrc
.travis.yml
.yo-rc.json

License

BSD