how to serve my own gitbook using github pages - github

I've created my own gitbook. looks good locally.
but how shall I integrate it into my github pages? Similar issues here difficulty-in-getting-gitbook-site-to-show-up-in-github-page
I tried that approach as well, but I have problem setting the grunt up, and I also I would like to do that myself before using an integrated tool.
I tried to copy the generated _book folder to my github page folder, but that didn't workout as there are some encoding issues

Similar question here
I had this question because I don't understand github pages, the underlying steps involve
build the _book folder, this is the static content that will be served
create gh-pages branch copy the _book folder content into gh-pages
github will then serve the content
the command gitbook publish will finish all 3 steps. but I am not familiar with grunt as well , as npm install . is a pre-step.

Related

I forked the repo for a Github Pages that I liked, but my fork will not load

I am a total programming noob and assume I'm missing something basic.
I forked this repo: https://github.com/colinmorris/tour-of-heroes
Here is the author's page for that repo: https://colinmorris.github.io/tour-of-heroes/
My fork: https://github.com/SmallFryHero/tour-of-heroes
My page based on that fork: https://smallfryhero.github.io/tour-of-heroes/
My page does not load.
I deployed the Github Pages using the gh-pages branch and from the /root folder.
I imported the code into a different web editor, CodeSandBox, and I can get it to run there along with my changes.
What do I need to fix to get it to run on my Github Pages? I added a readme to get the page to build. It seems to be deployed, but doesn't get past the "loading..." step.
Thanks for any help! Sorry for the total noob question.
The issue is that GitHub Pages, by default, use a static site generator called Jekyll under the hood. It basically converts a set of Markdown files into HTML (and provides templating, themes, plugins, and more).
In the case of your repo, which consists exclusively of static assets, Jekyll doesn't do much, but it does exclude the node_modules directory (see logs), which leads to the scripts in there being unavailable to the deployed page.
To fix this, you can indicate that you wish to skip any Jekyll processing and just upload the files as they are; to do so, add an empty file .nojekyll to the root directory in the gh-pages branch, as described in the documentation.
The repo from which you forked was last deployed multiple years ago, and I suspect the Jekyll default configuration back then didn't exclude node_modules yet.

How to use node_modules on Github Pages, without uploading to repo

I'm hosting a site on Github pages, and using Jekyll to generate it.
I added Angular and Lodash to my project using npm, but didn't want to upload 200 odd files to GitHub so I added node_modules to my .gitignore file and just made sure they were added as dependencies within package.json. The problem then becomes that GitHub pages/Jekyll doesn't auto-install the packages when it (Jekyll) generates.
So my question is, how can I use NPM on GitHub pages without actually uploading my node_modules folder into my GitHub repository?
You have two options:
build your site locally
Just generate your static files locally and then upload the final website to Github pages (Github can host non Jekyll websites)
use CI
Implement a script that after uploading your files to the master branch (in Travies for example), it builds your site and push the changes to the gp-pages branch.
According to the GitHub, you can add a _config.yml file to tell Jekyll to "include" the "node_modules" and "vendors" directories.
See:
https://help.github.com/en/articles/configuring-jekyll

Why put the _site-directory of a Jekyll site in .gitignore?

The documentation of Jekyll tells me, that the _site-directory of a Jekyll site contains the compiled version of the site I have created after running
Jekyll build
Several articles recommend, that I include the _site-directory in my .gitignore-file because "it just contains the compiled version of my site". (that's what some articles recommend. So, I am not sure if I don't understand some concept of Jekyll or some concept of Git.
If the _site-directory contains the compiled version of a site, shouldn't that be the thing that is on the server the provides the final website? I do understand why you put source code on github and what to do with it, but in the case of github pages, Github is not a versioning system but a file hosting system and the file hosting system should host compiled versions of my work to provide it via MyUsername.github.io to users, right?
My question is: shouldn't it be only the _site-directory of my Jekyll website that I deploy to Github because that should be the compiled source code that github provides to users? So, shouldn't I put anything else in the .gitignore-file EXCEPT the _site-directory?
If I got this all wrong: what is the point in compiling my website via
Jekyll build
if I don't use the compiled source code for anything?
Two solutions :
You don't use Jekyll plugins (or only those supported by github pages)
You build your site only if you need to test it locally (jekyll build or jekyll serve). The generated code (in _site) will not be versioned as github pages will generate pages from the sources.
Put _site to .gitignore
Push you sources to github pages
You use Jekyll plugins
In this case, you need to build locally because Github pages cannot do the job with plugins.
Jekyll build locally
Put _site to .gitignore
commit your sources in one branch
commit your _site in another branch
See this post for more explanations.
I think the point where you are confused is that most of the tutorials talk about at least two different repositories.
the source code of your site, this is where you call Jekyll build
the compiled result, this is the one where you put the contents of the _site directory
Then it makes sense to ignore _site in case 1. out of the same reason you normally ignore compilation results: they are not meant to be tracked because they might change between every compilation without changing the source, so you would have to commit after every build although nothing (visible) has changed.
For repository 2. you of course have to update it with the contents of _site from repository 1 after your build.
Having said that you can of course combine 1. and 2. into a single repository by using master for the contents of _site and another branch e.g. source for the project with the Jekyll build files, here ignoring _site and then updating the master branch with the contents of it after changes.
the _site folder is cleared and all files inside are re-generated upon each "jekyll build". tracking a file that is to be removed seems to serve no useful purposes.
if you are thinking to git push your jekyll site to your github repo as a project page (gh-pages), the _site folder again serves no purposes as the jekyll installation at github will generate the _site for you automatically upon your files upload (git push).
the _site folder is useful only for local preview of your jekyll site (typically to be found at localhost:4000 by default).
I believe you might be looking at things the wrong way, It makes sense to ignore _site since every time you jekyll build your _site gets blasted, everything in there gets erased and written again.
So in my own opinion what you would like to push to github is the working directory since it's there where you work and all your changes are being versioned... with the plus of github doing the compiling and automatically building the site.
That being said, I usually keep _site out of my gitignore since I deploy to another hosting service and my deployment framework grabs the github repository and deploys from a particular branch I need the _site to be there.

How to save both my _site and jekyll build on github

Right now i have the following setup:
My jeyll build is in ~/jekyll-sites
My .git folder is in ~/jekyll-sites/_site
I'm now able to sync the jekyll generated ~/jekyll-sites/_site with my repo at: https://github.com/nielsrasmus/nielsrasmus.github.io
and it works perfect.
But i would also like to to save the whole jekyll build on github.
The question is:
Is it possible to make another repo called: nielsrasmus.github.io-source and sync the whole jekyll build here?
If so, what would be the best way to do it?
I've looked at so many answers that does not quite match what I want. So I'm pretty confused right now :-/
As long as you're not using any Jekyll plugins, you can actually push your Jekyll source to Github, and their servers will automatically generate the _site folder and serve it for you. You won't see this _site directory show up in your repository, but the generated files will be accessible from http://nielsrasmus.github.io
A great reference for how to do this is Tom Preston-Warner's personal blog, which is (naturally) hosted on Github Pages. Note that he placed the _site directory in his .gitgnore file, and Jekyll says "it's probably a good idea" for you to do the same, but you might be able to skip this part.
Both you and Tom are using the User Pages option, so your site gets generated as long as your content is in the Master branch (if you were using Project pages, it would use the gh-pages branch instead).
I think I solved the issue.
I installed the mac version of github and fiddled around, read a lot of man pages and finally I could make it happen :-)
What helped me was to click on the + sign in the bottom of the screen, as shown on the screenshot. Here I could point my repos at a local dir.
nielsrasmus/jekyll-sites: points to the root of the jekyll build.
nielsrasmus/nielsrasmus.github.io: points to the generated site at ~/jekyll-sites/_site

Jekyll plugin not working

I have developed a simple Jekyll plugin, to generate the categories pages. IT works fine on my local system but does not work on github site.
Here is the source of the plugin:
https://github.com/madhur/madhur.github.com/blob/master/_plugins/site_process.rb
It should generate a page such as this:
http://www.madhur.co.in/categories/Security.html
However its not generated. Any ideas?
GitHub doesn't allow Jekyll plugins, turns out we don't want you running arbitrary code on our servers :)
I think this answer from Andión is better.
You can just upload the contents of the _site folder. That way you will simply push the static site. A simple way of doing that would be moving your .git/ folder to the _site folder, committing and pushing those changes. After that you will generate your site as usual and then push the changes to github from the _site folder. – Andión