Merge pull request #74 from naeluh/naeluh-doc

Add Dependency Guide to docs

README.md

@@ -57,6 +57,7 @@ Follow the step-by-step introduction in the [**Getting Started**](content/guide/
   - [Default Style Guide](content/resources/styleguide.md)
   - [Install Mac](content/resources/install-mac.md)
   - [Install PC](content/resources/install-pc.md)
+  - [Install LINUX](content/resources/install-linux.md)
   - [Quire CLI Instructions](content/resources/quire-cli.md)
   - [Using GitHub](content/resources/github.md)
   - [Sample publication.yml file](content/resources/sample-publication.yml)

content/guide/dependency-guide.md

@@ -0,0 +1,110 @@
+---
+title: Quire Dependency Guide
+type: page
+---
+
+Each Quire project relies on two projects the `quire-cli` a command line interface (cli) to run commands to preview and build a static website, a PDF or an EPUB and the `quire-starter-theme` a front end development toolkit that allows users to shape the output of the website, PDF and EPUB. This page explains what makes these two projects work and what major dependencies currently make quire what it is.
+
+<a alt="HUGO" title="HUGO" href="https://gohugo.io/"><img src="../images/hugo-logo.png" alt="HUGO" title="HUGO" width="100"/></a>
+
+> Hugo is a static HTML and CSS website generator written in Go. It is optimized for speed, ease of use, and configurability. Hugo takes a directory with content and templates and renders them into a full HTML website. Hugo relies on Markdown files with front matter for metadata, and you can run Hugo from any directory. This works well for shared hosts and other systems where you don’t have a privileged account.
+
+Quire makes use of Hugo via the npm package <a href="https://www.npmjs.com/package/hugo-bin"/>`hugo-bin`</a>
+
+Quire uses Hugo’s cli, templating system and http server. to create a way to preview your site while editing the front end code, build a static html site and aids Prince XML to create a PDF of your publication you are building.
+
+<a  alt="Prince XML" title="Prince XML" href="https://www.princexml.com/"><img src="../images/prince-xml-logo.png" alt="Prince XML" title="Prince XML" width="100"/></a>
+
+> Prince can also be used by authors and publishers to typeset and print documents written in HTML, XHTML, or one of the many XML-based document formats. Prince is capable of formatting academic papers, journals, magazines, and books.
+
+Quire uses the output of Hugo static-site generator to build a PDF as referenced above.
+
+<a href="https://webpack.js.org/" alt="webpack" title="webpack" ><img src="../images/webpack-logo.png" alt="webpack" title="webpack" width="150"/></a>
+
+> At its core, webpack is a static module bundler for modern JavaScript applications. When webpack processes your application, it internally builds a dependency graph which maps every module your project needs and generates one or more bundles.
+
+Quire makes use of Webpack via the npm package <a href="https://www.npmjs.com/package/webpack"/>`webpack`</a>
+
+Currently Quire starter theme uses the latest version of Webpack 4 to bundle front end assets and support the development workflow.
+
+To modify the Webpack configuration for your project edit this file
+
+`<your-project-directory>/themes/quire-starter-theme/webpack.config.js`
+
+### [pe-epub](https://github.com/peoples-e/pe-epub) and [pe-epub-fs](https://github.com/peoples-e/pe-epub-fs)
+
+>"pee pub" makes epubs better. Our goal is to make it as easy as possible to output a valid epub. It's used in production over at The People's E-Book. pe-epub-fs extends pe-epub so you can import local assets from your filesystem rather than from the web.
+
+Quire uses these projects to generate the EPUB file. This file can be access on any device or software that reads the .epub file format. These projects generate a mostly style stripped version of the publication. These projects have been receiving limited maintenance. Quire is currently seeking a replacement to output the EPUB file.
+
+## Quire Dependency Tables
+
+### CLI Dependencies
+
+| Dependency | NPM Description | 
+| --- | --- |
+| [axios](https://www.npmjs.com/package/axios) | Promise based HTTP client for the browser and node.js |  
+| [chalk](https://www.npmjs.com/package/chalk) | Terminal string styling done right |  
+| [cheerio](https://www.npmjs.com/package/cheerio) | Fast, flexible & lean implementation of core jQuery designed specifically for the server. |  
+| [command-exists](https://www.npmjs.com/package/command-exists) | node module to check if a command-line command exists |  
+| [commander](https://www.npmjs.com/package/commander) | The complete solution for node.js command-line interfaces, inspired by Ruby's commander. |  
+| [execa](https://www.npmjs.com/package/execa) | A better `child_process` |  
+| [glob](https://www.npmjs.com/package/glob) | Match files using the patterns the shell uses, like stars and stuff. |  
+| [hugo-bin](https://www.npmjs.com/package/hugo-bin) | Binary wrapper for Hugo |  
+| [js-yaml](https://www.npmjs.com/package/js-yaml) | YAML 1.2 parser / writer for JavaScript | 
+| [lodash](https://www.npmjs.com/package/lodash) | The Lodash library exported as Node.js modules. | 
+| [pe-epub]() | Makes epubs better. |  
+| [pe-epub-fs]() | Extends pe-epub so you can import local assets from your filesystem rather than from the web |
+| [rimraf](https://www.npmjs.com/package/rimraf) | The UNIX command rm -rf for node. |  
+| [striptags](https://www.npmjs.com/package/striptags) | An implementation of PHP's strip_tags in Node.js. |
+| [webpack](https://www.npmjs.com/package/webpack) | webpack is a module bundler |  
+| [yaml-front-matter](https://www.npmjs.com/package/yaml-front-matter) | Parses yaml or json at the front of a string. Places the parsed content, plus the rest of the string content, into an object literal. |  
+
+### CLI Dev Dependencies
+
+| Dependency | NPM Description | 
+| --- | --- | 
+| [elint]([https://www.npmjs.com/package/eslint]) | ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code. |  
+| [eslint-config-standard](https://www.npmjs.com/package/eslint-config-standard)  | Shareable configs are designed to work with the extends feature of .eslintrc files. You can learn more about Shareable Configs on the official ESLint website. |  
+| [eslint-plugin-promise](https://www.npmjs.com/package/eslint-plugin-promise)  | Enforce best practices for JavaScript promises. |  
+| [eslint-plugin-standard](https://www.npmjs.com/package/eslint-plugin-standard)  | ESlint Rules for the Standard Linter |  
+| [jsdoc](https://www.npmjs.com/package/jsdoc)  | An API documentation generator for JavaScript. |  
+| [jsdoc-template-argon](https://www.npmjs.com/package/jsdoc-template-argon)  | Template System for jsdoc | 
+| [mocha](https://www.npmjs.com/package/mocha)  | Simple, flexible, fun JavaScript test framework for Node.js & The Browser |  
+| [tmp](https://www.npmjs.com/package/tmp)  | A simple temporary file and directory creator for node.js. | 
+
+### Starter Theme Dependencies
+
+| Dependency | NPM Description | 
+| --- | --- | 
+| [bulma]([https://www.npmjs.com/package/bulma]) | Bulma is a CSS framework. There is no JavaScript included. |  
+| [hammerjs](https://www.npmjs.com/package/hammerjs)  | Hammer is a open-source library that can recognize gestures made by touch, mouse and pointerEvents |
+| [jquery](https://www.npmjs.com/package/jquery)  | jQuery is a fast, small, and feature-rich JavaScript library. |  
+| [leaflet](https://www.npmjs.com/package/leaflet)  | Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps.  |  
+| [lodash](https://www.npmjs.com/package/lodash)  |  lodash is a fast, small, and feature-rich JavaScript library. |  
+| [lunr](https://www.npmjs.com/package/lunr)  | A bit like Solr, but much smaller and not as bright. | 
+| [smoothstate](https://www.npmjs.com/package/smoothstate)  | smoothState.js is a jQuery plugin that progressively enhances page loads to give us control over page transitions. |  
+| [template-polyfill](https://www.npmjs.com/package/template-polyfill)  | A polyfill for the HTML5 `<template>` tag. |  
+| [velocity-animate](https://www.npmjs.com/package/velocity-animate)  | Velocity is an animation engine with the same API as jQuery's $.animate(). |  
+
+
+### Starter Theme Dev Dependencies
+
+| Dependency | NPM Description | 
+| --- | --- | 
+| [babel-loader](https://www.npmjs.com/package/babel-loader) | This package allows transpiling JavaScript files using Babel and webpack. |  
+| [clean-webpack-plugin](https://www.npmjs.com/package/clean-webpack-plugin) | A webpack plugin to remove/clean your build folder(s) before building. |  
+| [css-loader](https://www.npmjs.com/package/css-loader)   | The css-loader interprets @import and url() like import/require() and will resolve them. |  
+| [eslint](https://www.npmjs.com/package/eslint) | ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code. |  
+| [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) | Extract text from a bundle, or bundles, into a separate file. |
+| [file-loader](https://www.npmjs.com/package/file-loader) | Instructs webpack to emit the required object as file and to return its public URL |  
+| [glob](https://www.npmjs.com/package/glob) | Match files using the patterns the shell uses, like stars and stuff. |  
+| [node-sass](https://www.npmjs.com/package/node-sass) | Node-sass is a library that provides binding for Node.js to LibSass, the C version of the popular stylesheet preprocessor, Sass. | 
+| [purify-css](https://www.npmjs.com/package/purify-css) | A function that takes content (HTML/JS/PHP/etc) and CSS, and returns only the used CSS. | 
+| [purifycss-webpack](https://www.npmjs.com/package/purifycss-webpack) | This plugin uses PurifyCSS to remove unused selectors from your CSS. You should use it with the extract-text-webpack-plugin. |  
+| [sass-loader](https://www.npmjs.com/package/sass-loader) | Loads a Sass/SCSS file and compiles it to CSS. |
+| [style-loader](https://www.npmjs.com/package/style-loader) | Adds CSS to the DOM by injecting a `<style>` tag |  
+| [uglifyjs-webpack-plugin](https://www.npmjs.com/package/uglifyjs-webpack-plugin) | This plugin uses UglifyJS v3 (`uglify-es`) to minify your JavaScript |
+| [webpack](https://www.npmjs.com/package/webpack) | webpack is a module bundler |  
+| [url-loader](https://www.npmjs.com/package/url-loader) | Loads files as `base64` encoded URL |  
+

content/resources/install-linux.md

@@ -0,0 +1,176 @@
+---
+title: Quire Installation
+subtitle: LINUX
+type: page
+---
+<!--
+The full Quire system is not currently available to PC users. However, PC users can still start and work on Quire projects, preview the online edition, and output final files for it. They will not, however, be able to:
+- Output PDF or EPUB editions
+- Make changes to Style (.scss) or Javascript (.js) files inside the themes folder
+The following steps will install the necessary software for running a Quire project on a PC, and show you how to start a new project as well.
+-->
+
+### LINUX Users:
+
+1. Install the Windows Subsystem for Linux:
+
+    Open PowerShell as Administrator and run:
+
+    ```
+    Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux
+    ```
+
+    Restart your computer when prompted.
+
+    Open the Microsoft Store and choose your favorite Linux distribution.
+
+    Quire recommend [Ubuntu](https://www.ubuntu.com/)
+
+    From the distro's page, select "Get"
+
+    Once the download has completed, select "Launch".
+
+
+2. Download and install **Prince**:
+
+   From the terminal that just loaded
+
+   ```
+   cd ~
+   ```
+
+   Run these commands to download and install PrinceXML 
+
+   ```sh
+   wget https://www.princexml.com/download/prince_12-1_ubuntu18.04_amd64.deb
+
+   sudo gdebi prince_10r2-1_debian8.0_amd64.deb
+   ```
+
+   If you chose a different distribution of Linux there are more instructions here -> https://www.princexml.com/doc-install/#linux
+
+3. Install **node js and npm through nvm**
+
+   Detailed information here -> https://github.com/creationix/nvm#install-script
+
+   To install or update nvm, you can use the [install script][2] using cURL:
+
+    ```sh
+    curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash
+    ```
+
+    or Wget:
+
+    ```sh
+    wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash
+    ```
+
+    <sub>The script clones the nvm repository to `~/.nvm` and adds the source line to your profile (`~/.bash_profile`, `~/.zshrc`,      `~/.profile`, or `~/.bashrc`).</sub>
+
+    ```sh
+    export NVM_DIR="$HOME/.nvm"
+    [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
+    ```
+
+    **Note:** You can add `--no-use` to the end of the above script (...`nvm.sh --no-use`) to postpone using `nvm` until you manually [`use`](#usage) it.
+
+    You can customize the install source, directory, profile, and version using the `NVM_SOURCE`, `NVM_DIR`, `PROFILE`, and `NODE_VERSION` variables.
+    Eg: `curl ... | NVM_DIR="path/to/nvm"`. Ensure that the `NVM_DIR` does not contain a trailing slash.
+
+    <sub>*NB. The installer can use `git`, `curl`, or `wget` to download `nvm`, whatever is available.*</sub>
+
+    **Note:** On Linux, after running the install script, if you get `nvm: command not found` or see no feedback from your terminal after you type:
+
+    ```sh
+    command -v nvm
+    ```
+    simply close your current terminal, open a new terminal, and try verifying again.
+
+
+    If the above doesn't fix the problem, open your `.bash_profile` and add the following line of code:
+
+    `source ~/.bashrc`
+
+    - For more information about this issue and possible workarounds, please [refer here](https://github.com/creationix/nvm/issues/576)
+
+    ### Verify installation
+
+    To verify that nvm has been installed, do:
+
+    ```sh
+    command -v nvm
+    ```
+
+    which should output 'nvm' if the installation was successful. Please note that `which nvm` will not work, since `nvm` is a sourced shell function, not an executable binary.
+
+    To download, compile, and install the latest release of node, do this:
+
+    ```sh
+    nvm install node
+    ```
+
+    And then in any new shell just use the installed version:
+
+    ```sh
+    nvm use node
+    ```
+
+4. Install **Quire-CLI**
+
+    ```
+    git clone https://github.com/gettypubs/quire-cli
+    ```
+    
+    ```
+    cd quire-cli
+    ```
+    
+    ```
+    git checkout pc-dev
+    ```
+    
+    Install Dependencies
+    
+    ```
+    npm install -g
+    ```
+    
+    Verify
+    
+    ```
+    quire -V
+    ```
+    
+    If version number is returned quire-cli was installed correctly, you can now leave the directory.
+
+    ```
+    cd ~
+    ```
+
+5. Start a new **Quire** project
+
+    Create a new project
+
+    ```
+    quire new your-project-name
+    ```
+    Enter the new directory
+
+    ```
+    cd your-project-name
+    ```
+
+    Install starter theme dependencies
+
+    ```
+    quire install
+    ```
+    
+    then to start editing run
+    
+    ```
+    quire preview
+    ```
+
+    Once running, open a browser and visit [http://localhost:1313](http://localhost:1313) to see the publication.
+