LearnForward Author - HTML5 textbook publishing tool
LearnForwardAuthor is a build tool for generating HTML5 textbooks.
Jade makes HTML writing easy, allowing for short and readable markup. A good tutorial can be found here.
Stylus gives you more flexibility when writing CSS, allowing you to nest, declare variables, forget braces, loop and more. Tutorial link
Both have huge power usage potential while also being easy to learn. Go read up on them.
Firstly, make sure you have node.js and npm installed. There are guides on the net on how to do it, but usually it boils down to
brew install npm on OS X with Homebrew or
sudo apt-get install npm on Ubuntu-based Linux distros.
After that, run:
$ npm install -g lfa
If you get permission issues you most likely have a dodgy node installation. You can probably circumvent it temporarily with
sudo -H npm install -g lfa.
LFA is a command line tool. For the basic help, run:
Let's create a new project:
$ lfa new my-first-book$ cd my-first-book
Your project structure should look something like this:
$ tree├── .lfa│ └── package.json├── assets│ └── ...├── js│ ├── ...│ └── index.js├── styles│ ├── ...│ ├── colors.styl│ └── main.styl├── plugins│ └── ...├── mixins│ ├── ...│ └── index.jade└── text└── ...
.lfa/package.json is the main configuration file. This is where you set up project settings like the title or language of the book
The Jade files in
text/ make up for the book's chapters. The table of contents is generated automatically based on the folder hierarchy.
As mentioned, for CSS, we use Stylus. You should include whatever styles you have in
css/main.styl or in
@import-ed stylus or CSS files. Any other assets can be placed in
Let's start editing our new project. Before we do that, we start the watcher:
$ lfa watch
By now, a browser tab should have popped up for you. You can now start editing files with your favorite text editor and, as soon as you save, the watcher will reload the page for you.
The end result:
See Bootstrap to understand what
col-sm- mean in the code above.
The tags starting with
+ are called 'mixins'. Mixins are like functions in Jade (they return HTML snippets). We made a few mixins for you, such as
Create your own mixins to make your life easier.
Just clone this repo, then use Pull Requests. There aren't too many tests right now, but if you implement a new feature, please also write some tests for it.
In order to continuously improve our product, this tool is collecting anonymous usage data.
If you want to remove anonymous statistics from the textbooks this tool generates, remove the lines that start with