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

majesti

v1.0.3

Published

A beautiful web development framework.

Downloads

17

Readme

Majesti logo Majesti

A beautiful web development framework.
Majesti was created to provide a starter template for web developers that uses the most legible preprocessors available - Streamlined with the help of Gulp and Browsersync.

Majesti uses Gulp, BrowserSync, Stylus, Pug, CSS-Nano, Autoprefixer, Coffeescript and Uglify to speed up your workflow and get things done.

Basic Usage

Installation is simple.

  • Either clone this git repo or download it to the directory you want to place your site. Then rename the folder to the name of your project.
  • In Terminal or git bash, type npm install majesti or bower install majesti in the directory you wish to install Majesti.
  • Depending on which package manager you used to install, you may have to move Majesti out of the 'node_modules' or 'bower_components' folder.

You will have these files:

Majesti
  |  bower.json
  |  gulpfile.js
  |  index.html
  |  README.md
  |  /pages
  |  /static
  |  /templates
  1. If you do not have Node.js installed yet, install it from here.

  2. Install Gulp globally by opening Terminal or git bash and typing npm install --global gulp-cli. This will allow you to use Gulp to setup and maintain your project as well as any future projects. You only have to run this once following your Node.js installation.
    Note: Git for Windows comes packaged with the git bash shell for working on a Windows machine.

  3. While still inside your project directory, type npm install to install the necessary node modules.

  4. When all of the node modules are finished installing, you can start the proxy server and file watcher by typing "gulp" and hitting Enter.

Allow the gulp command to keep running while you develop your site.
Anytime you wish to restart development, use Terminal or git bash to change to your project directory and type gulp and hit Enter.

Majesti will do all of the preprocessing and compression for you. Allowing you to focus on the important stuff.


Features

  • Majesti will convert your stylus files to css and add the browser prefixes where necessary.
  • Converts all template pug files to html files and places them in the root directory.
  • Optimizes all svg files placed or saved in the static/svg folder.
  • Converts each svg file placed or saved in the static/svg folder to a png file and places it in the static/img folder.
  • Converts each coffee file placed or saved in the static/coffee folder to a js file and places it in the static/js folder.
  • Optimizes all js files placed or saved in the static/js folder.

How Majesti works

  • Scanning
    • Majesti will watch all pug files for changes and convert them into html pages, placing them inside the root directories' pages folder
    • All styl files inside the static directory will be watched for changes and converted to css inside the static/css directory.
  • Index page (Home page)
    • Majesti scans the templates/pages directory for either a home or index file/folder. This file is used to display the index or 'home page'.
    • The home/index page's index file is automatically copied to the root directory as 'index.html'.
    • It's strongly advised to use one or the other in your pages 'index' or 'home'.
      Note: If 'home' is used, the link to your home page will be something like 'domain.com/pages/home' rather than 'domain.com/pages/index'.