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'.