블로그 이미지
윤영식
Full Stacker, Application Architecter, KnowHow Dispenser and Bike Rider

Publication

Category

Recent Post

2013. 8. 14. 09:16 CI/Jenkins, Travis

로컬 프로그램을 GitHub에 push하고 테스트 프로그램을 작성하였다면 이제 자동화 통합 빌드 툴인 Travis와 연동하고, 빌드의 결과를 GitHub에 표시하는 방법에 대해서 알아본다 



1. 사전 준비사항

  - 소스의 root에 .travis.yml 파일을 생성하고 환경값을 작성한다 

  - Node.js에 대하여 환경값을 작성해 본다 

// .travis.yml 내역 

language: node_js

node_js:

  - "0.11"

  - "0.10"

  - "0.8"

  - GitHub에 설정된 모습 : GitHub .travis.yml 참조

    

  - Travis의 default test 명령은 "npm test" 이므로 package.json파일안에 test 명령 script를 작성한다

    (package.json은 "npm init" 명령으로 만든다)

// package.json 내역 

{

  "name": "mobiconStatistics",

  "version": "0.0.1",

  "description": "include statistics function such as the moving average",

  "main": "./lib/mobiconStatistics.js",

  "dependencies": {

    "underscore": "~1.5.1"

  },

  "devDependencies": { 

    "mocha": "latest",

    "should": "~1.2.2"

  },

  "scripts": {

    "test": "mocha test/*.js"

  },

  "repository": {

    "type": "git",

    "url": "https://github.com/ysyun/mobiconStatistics.git"

  },

  "keywords": [

    "mobicon",

    "statistics",

    "movingAverage"

  ],

  "author": "yun youngsik",

  "license": "MIT",

  "bugs": {

    "url": "https://github.com/ysyun/mobiconStatistics/issues"

  }

}



2. GitHub 저장소 환경 설정

  - 저장소에 .travis.yml 파일이 존재한다면 이제 해당 저장소를 접근하기 위한 환경을 설정한다 

  - GitHub의 저장소의 우측 밑에 보면 설정 아이콘을 클릭한다 

    

  - 다음 화면 좌측 메뉴에서 "Service Hooks"을 선택한다 

    

  - Service Hooks 화면밑으로 내려오면 "Travis"가 존재하고 선택한다

    

  - Travis를 선택하면 우측으로 입력과 선택 폼이 나오는데 "Active"를 체크하고 "Update Settings"를 클릭한다 

    

  - GitHub에서의 설정작업은 이제 끝났다. Travis 설정 참조 문구 내역

Travis CI is a distributed build platform for the open source community.

By enabling this hook, Travis CI will listen to push and pull request events to trigger new builds, member and public events to keep track of repository visibility and issue comment events to allow users to talk to @travisbot.

Install Notes

We recommend using the Travis profile page at http://travis-ci.org/profile to manage your hooks.

  1. Create an account at http://travis-ci.org (you can sign in with GitHub)
  2. Enter your credentials
    • The token which you can find on the Travis profile page
    • optional: Enter the username who the Travis token belongs to (defaults to the repository owner)
    • optional: Enter the host of your Travis installation (defaults tohttp://notify.travis-ci.org), the protocol-prefix is optional and defaults to "http://".
  3. Make sure the "Active" checkbox is ticked, and click "Update Settings".
  4. Click on the "Travis" service name and then click the "Test Hook" link.
  5. You should receive an email from Travis once the build has completed

For more details about Travis, go to http://about.travis-ci.org/docs/



3. Travis CI 환경 설정 

  - https://travis-ci.org/ 로 와서 자신의 GitHub 계정으로 로그인을 한다 

  - https://travis-ci.org/profile 로 들어오면 자신의 계정에 Create, Fork한 저장소 목록을 볼 수 있다 

    

 - 저장소 목록의 우측을 보면 "ON/OFF" 스위치가 있다. Travis CI를 원하는 저장소를 "ON" 시킨다 

    

 - https://travis-ci.org/ 로 다시 들어가면 자신의 계정에 대해 설정해 놓은 저장소의 빌드 결과가 출력된다

    

  - Travis CI 설정작업이 끝났다. 이제 GitHub 저장소로 변경내역을 Push할 때 마다 .travis.yml에 설정한 Node.js 버전별로 자동으로 빌드가 이루어진다

  - Travis CI에서 빌드 진행 내역을 확인하는 방법 : "Build Matrix" -> Job 선택

    "npm test" 가 수행되어 테스트 코드가 정상수행된 것을 볼 수 있다 

    




4. GitHub 저장소에 Travis 빌드 아이콘 설정

  - GitHub 저장소에 자신의 변경내역을 push하고 Travis의 빌드 결과(성공/실패)를 아이콘으로 표현해 보자 

  - https://travis-ci.org/ 에서 저장소를 선택하면 우측 결과 화면 위쪽에 톱니바퀴 설정 아이콘이 나온다. "Status Images"를 선택한다

    

  - "Status Images"를 선택하고 Markdown의 내역을 복사한다 

   

  - Markdown 복사 내역은 GitHub 저장소의 README.md 파일에 넣기 위함이다. GitHub 저장소로 이동하여 README.md파일을 Edit 하고 commit 한다 

    

  - 최종 화면이 다음과 같이 나오면 성공! 다음부터 저장소에 push한 애플리케이션의 Test코드가 실패하면 빨간 아이콘이 나올 것이다  

    

 

 

<참조>

  - Travis Build Configuration & CI Environment

  - Travis Node.js Configuration

  - Mobicon Statistics in Travis : 이동평균을 구하는 모듈을 만들어 보았다. 테스트는 Mocha + should.js 기반

'CI > Jenkins, Travis' 카테고리의 다른 글

[Jenkins] 설치후 Security 설정하기  (0) 2013.01.07
[Jenkins] Jenkins와 Gradle 그리고 JavaScript  (0) 2012.12.26
posted by 윤영식