Github and CircleCI integration
We are going to make the following things:
- Store code on Github.com
- Compile and test this code with CircleCI (cloud tool for continuous integration)
- Commit and push back the binaries from CircleCI to Gihub.com
Everything is automatic, cloud and free (our source code is public).
It's great when I have some HTML5 games and I need a free Web server to serve them. Example my games: http://nguoianphu.github.io/
Github.com
Example, my Github account is nguoianphu.
I created a repository named "nguoianphu.github.com" and I will have a free Web at http://nguoianphu.github.io/. Note: your username nguoianphu MUST match the repository name "nguoianphu.github.com"
The repository is:
https://github.com/nguoianphu/nguoianphu.github.com
CircleCI
Go to https://circleci.com/ and login with your Github account.
Add our github project (repository) into CircleCI:
https://circleci.com/add-projects
Choose a GitHub account > Choose a repo > Build project
Example my project after integrating with CircleCI:
https://circleci.com/gh/nguoianphu/nguoianphu.github.com
Enable the SSH check keys for check out code from Github to CircleCI and commit binaries from CircleCI back to Github:
https://circleci.com/gh/nguoianphu/nguoianphu.github.com/edit#checkout
Turn on the button Set up USER KEY for providing CircleCI the write permission. Then it can commit and push back the binaries to Github.
Review my case for your usage
My HTML5 is pokepong.
I create a folder name "pokepong" in my root repository
https://github.com/nguoianphu/nguoianphu.github.com/tree/master/pokepong
After compile the code (Javascript), the game binaries will put at:
https://github.com/nguoianphu/nguoianphu.github.com/tree/master/pokepong/dist
You can play it online on this link:
http://nguoianphu.github.io/pokepong/dist/
Whenever I edit my code and push it to Github, my code will be compile/build by CircleCI. Afterward, CircleCI will commnit and push my binaries back to Github. Finally, I can enjoy my game at http://nguoianphu.github.io/pokepong/dist/.
In brief:
- Just edit code (can edit via Github web GUI if you don't have local machine and Git).
- CircleCI build and test your code.
- Github serve your HTML as a Web server.
But to make the above things work, you MUST add this circle.yml into your root repository
https://github.com/nguoianphu/nguoianphu.github.com/blob/master/circle.yml
Edit it for your usage.
dependencies: override: # Install the dependencies tools - cd pokepong && npm install -g bower test: post: # Build my pokepong code - cd pokepong && npm install - cd pokepong && grunt build #- mkdir -p $CIRCLE_ARTIFACTS/pokepong/ #- cp -fr pokepong/dist/* $CIRCLE_ARTIFACTS/pokepong/ deployment: production: branch: master commands: - git config --global user.email nguoiaphu@gmail.com - git config --global user.name nguoiaphu - git status - git add --all - git commit -m "Update (`date '+%F %T %Z'`) [ci skip]" || true # The text [ci skip] helps us to # avoid re-building the project again # by CircleCI commnit/push # The || true for ignore commit/push error - git push origin master || true