md-book-with-docraptor
A node.js app to convert markdown files to a single webpage as well as two PDFs (content and cover) using DocRaptor.
Install
Create a directory and navigate to it:
mkdir md-book-with-docraptor
cd md-book-with-docraptor
Download this repository to the new created directory:
git clone https://github.com/stebrech/md-book-with-docraptor .
Install all the dependencies using your favorite package manager:
npm install
or
yarn
Markdown Files
Add your markdown files within the src
folder. The name of the files are not used in the output but need to be named to represent the correct order. Therefore you could name the files chapter01.md
, chapter02.md
and so on.
Headings
The book title uses a heading 1 and the subtitle a paragraph tag. Each markdown file will be put in a section tag. For semantic reasons and because of the default styles you should begin each markdown file with a heading 2 and use it only once for each chapter.
Manual page break
The horizontal rule element (<hr>
; markdown syntax ***
) is “misused” to create a manual page or column break. It is set to not visible either for screen and print.
Metadata
We need some overall metadata which is placed in a json file called metadata.json
as well directly in the src
folder.
The following keys are excpected:
{
"title": "md-book-with-docraptor",
"subtitle": "A node.js app to convert markdown to PDF using Docraptor",
"imprint": [
{ "label": "Text", "value": "Stefan Brechbühl" },
{ "label": "Images", "value": "Screenshots" },
{
"label": "Process",
"value": "Markdown → HTML → PDF"
},
{
"label": "Print",
"value": "Name of the printing company"
},
{
"label": "Website",
"value": "<a href='https://stebre.ch'>stebre.ch</a>"
}
],
"cover_img": "assets/images/cover.png",
"imprint_img": "assets/images/cover-photo.png",
"excerpt": "The excerpt is a short description of the book. It is used on the back cover and as meta description."
}
DocRaptor Key
I recommend to put the value of the user_credentials
not directly into docraptor.js
. You should do the following:
- If you not already opened a DocRaptor account, let’s do that.
- Copy your API key.
- Add a new file called
.env
into your root folder. - Write
DOCRAPTOR_KEY=
and then paste your API key. - Save the file.
Use the scripts
There are two scripts in this repository:
md2html.js
creates a html of the content and the cover. Of both there will be an additional version which includes the assets (styles, images) inline.docraptor.js
sends two requests to Docraptor. One withcontent-inline.html
, the other withcover-inline.html
.
To run the scripts you need to write
npm html
/yarn html
ornpm pdf
/yarn pdf
in the terminal.
If you want to run both with one command, use:
npm start
or
yarn start
Adjust the styles
Within the general.css
file, there are some css variables you can modify or adjust the styles elswhere to fit your needs.
Full page images
The print styles make all images in the book to be placed on a separate page.