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
Loading