Publishing a new post can be too much if you do it old school
hexo p && hexo d on the desktop/laptop. What’s worse is you can only publish it on a computer with Hexo installed. What if you want to write it anywhere and anytime and even on an iPad? With Travis CI (or any other CI service), each time you push a change to the GitHub repo, a build will kick off on Travis and it run anything you prepared including deploying the updated pages. It took me two nights to figure out (mostly) how to archive it 😅, so in this post I will try to write down each step and the tricks within to make everyone’s life easier.
This post is inspired by kchen’s
Continuous Integration is the practice of merging in small code changes frequently. It can be taken advantages in Hexo because like these small code changes, posts are published and deployed one at a time.
As a CI platform, Travis CI automatically build and tests these changes, and it provides immediate feedback on the success of the change. Most importantly, it is free when you use it on your open source projects like Hexo!
- For more details of the basics you can always go to its docs.
- On May 2nd, 2018 Travis CI announced that open source projects will be joining private projects on travis-ci.com. But by the time of this post it is still on its beta testing so I will continue using travis-ci.org instead. For more details of this change please check on this artical.
- GitHub is also beta testing its own CI/CD service, check it out here!
This diagram shows the process behind the automation:
sequenceDiagram participant Local Local->>Local: Create post Local->>blog#45;source: Push blog#45;source->>Travis CI: Web hook Travis CI-->>blog#45;source: Get source code blog#45;source->>Travis CI: Return source code Travis CI->>Travis CI: Hexo build Travis CI->>master: Deploy #9829;
- Push new post created locally (iPad or laptop) to ‘blog-source’ branch
- Setup a web hook for this branch on Travis
- Travis detects the push and clones your branch
- Travis builds Hexo
- Travis deploy the results onto ‘master’ branch
You can login Travis CI with GitHub account directly
If you cannot see your repo, click “Sync account”.
Go to GitHub>Settings >> Developer settings >> Personal access tokens >> Generate new token, provide accesses for repo. Then replace
<REPO_TOKEN> with the token in below:
$ gem isntall travis
This will add below into the .travis.yml file:
Your local files to be pushed should look like below
Now you can push them to blog-source branch on GitHub.
$ git init
All set! From now on, you can focus on writing the posts and let Travis CI does the rest! Next time if you wish to write a post, simply 1) go to GitHub repo and create a new file on the website; or 2) pull and push from any computer installed with git.
Further you can replace
- hexo d with
- gulp if you have adopted it Optimize Hexo With Gulp. Remember to push
blog-source branch, too.