Sentio, ergo sum

   웹(클라우드) IDE은 웹 환경, 즉 브라우저를 통해 인터페이스를 제공하는 통합 개발 환경입니다. 

로컬 PC에 IDE를 다운로드 받아 실행하지 않고 웹 브라우저를 통해 접속하여 해당 서비스에서 제공하는 환경을 통해 개발할 수 있습니다.

   지원하는 언어, 미들웨어, 데이터베이스 등의 종류와 기능은 각 서비스 별로 상이하지만 파일 브라우징, 버전 관리 연동, 편집기, 콘솔, 터미널 등의 기본적인 기능은 대동소이합니다.

   이 글에서는 상용 서비스와 오픈 소스로 공개된 웹 IDE에 대해 비교해보도록 하겠습니다. 이전에 웹 IDE를 분석했던 자료를 PT로 정리해뒀었는데, 묻어두긴 아까워 PT자료를 토대로 글로 옮겼습니다. 슬라이드 그대로 짜깁기한 부분도 있으니 너그러이 양해를 :D

※ PT 자료는 http://www.slideshare.net/ssusercef361/ide-60399120 에서 보시거나 다운로드 받으실 수 있습니다.

I. 주요 상용 웹 IDE

   이 중 NITROUS는 회원 가입 시 전화번호 인증이 필요한데 한국 번호(+82)로는 인증 문자가 발송되지 않는 건지 인증을 하지 못해서 테스트해보지 못했습니다 ;;

  상용 웹 IDE의 공통 기능

대부분의 서비스가 아래와 같은 기능을 제공합니다.

1. 프로젝트(파일) 관리/브라우징

   - 워크스페이스 제공

   - 언어/프레임워크별 프로젝트 템플릿 제공

   - 파일 업로드/다운로드

   - 프로젝트 내보내기/가져오기 (파일 또는 링크 형태의 공유)

2. 편집기(문법 검사, 코드 하이라이팅, 자동 완성 등)

3. 자동 저장 및 리비전(SCM과는 별도로 파일 자체의 리비전 관리)

4. 개발, 빌드 및 실행을 위한 VM이나 Container 제공

5. 협업 기능

   - 프로젝트 공유/프로젝트 멤버(팀) 관리

   - IDE 내 메신저 채널 제공

   - 동시 협업 코딩(구글 문서와 같은 동시 편집 기능)

6. 웹 기반 SSH 터미널 제공(대부분 sudo 명령어 지원)

7. 형상관리 시스템 연동(Git.Mercurial/SVN 또는 외부 서비스 e.g. Github)

8. UI 사용자화(Custumizing)

   - 창/탭 형태의 UX 제공

   - 창/탭 분할

   - 테마 사용자화

   개발/빌드/실행 환경에 있어서는 VM이나 Container 기반의 워크스페이스(또는 프로젝트)를 제공하며, 서비스에 따라서 실행 및 빌드 시에만 VM(Container)를 생성하는 경우도 있습니다. 또한 자체적으로 웹 애플리케이션 테스트를 할 수 있는 경우 Public URL을 제공하여 해당 URL을 통해 실행된 웹 애플리케이션을 확인할 수 있습니다.

   대부분의 경우 웹 IDE에서는 테스트 환경까지는 제공하지만 배포환경은 제공하지 않습니다. 즉 웹 IDE를 통해서 안정된 서비스를 운영하기는 아직까지 어려워보입니다.

웹 IDE에 따라서는 Cloud 서비스(IaaS/PaaS)와 연동하여 개발된 결과를 해당 서비스에 배포할 수 있도록 하는 기능도 제공합니다.

  Codenvy - https://codenvy.com/

Codenvy의 주요 특징

   - Docker 기반 컨테이너 제공

   - 프로젝트 실행 시에만 컨테이너(Runner) 동작

      - Runner가 동작중일 때 웹 SSH Terminal을 통해 접속가능

   - 웹 UI를 통한 데이터베이스 연동

   - 언어 지원 : C/C++, Javascript, Java, PHP, Python, Ruby

   - 템플릿 프로젝트 제공

   - 언어별 빌드툴에 대한 빌더 인터페이스 제공

   - 형상관리 제공(Git, Subversion)

   Codenvy를 통해 개발 시 소스코드 등의 프로젝트 파일은 서버의 파일 시스템으로만 관리되고, 테스트 시에는 Runner라는 실행환경을 제공합니다. Runner는 Docker를 통해 생성된 Container이며, 빌드 결과를 Runner에 업로드하여 Runner 환경 내에서 실행됩니다.

    Runner는 언어/프레임워크/웹서버/WAS 등에 따라 다양하게 제공되고 있으며 2015년 11월 기준으로 제공되는 Runner는 아래와 같습니다.

   또한 기본적으로 제공되는 Runner이외에도 현재의 Runner를 통해 Custom Runner를 구성하여 생성할 수 있습니다.

Codenvy 아키텍쳐

주요 화면 캡처

(전체 화면 스크린샷이라 잘 보이지 않습니다 ;; 자세한 화면은 슬라이드쉐어에 공유한 PT 자료를 참고해주세요)

기본 편집 화면

새 프로젝트 생성 - 언어별 템플릿 프로젝트 제공

러너 및 러너 속성 

러너 실행 시 콘솔을 통한 로그 확인

러너 접속을 위한 터미널

데이터베이스 연결 - 

데이터베이스(PostgreSQL, MySQL, Oracle, MS SQL, NuoDB) 가 설치된 URL을 직접 입력하거나

Google Cloud SQL, Amazon의 데이터베이스에 연결

  SourceLair

SourceLair의 주요 특징

   - 형상관리 시스템에 밀접하게 연동

      - 프로젝트 생성 시 형상관리 시스템을 먼저 선택하도록 되어있음

   - UI 상에서 Package Management 제공

      - npm, pip, bower 등

   - 개발용 데이터베이스 인스턴스 제공

   - Heroku 개발 특화

      - Heroku 앱 템플릿 제공(Heroku 용 Node, Django)

   - Linux 터미널 제공

   - 웹 서비스의 Public URL 제공

   - Sublime Text의 Command Palette와 유사한 기능 제공

   - HTML 라이브 프리뷰

   편집 기능에 있어서 강력한 기능을 많이 제공합니다. HTML 의 라이브 프리뷰도 그렇고, 자동 완성, 코드 폴딩 등의 기능을 제공합니다. 웹에서 웬만한 IDE의 편집기에 버금가는 기능을 갖췄다니 대단하네요.

   특이한 부분은 웹 UI 내에서 npm, pip와 같은 패키지 관리를 할 수 있단 부분인데요. 물론 다른 웹 IDE 들도 터미널을 통해 할 수 있지만 UI를 통해서 할 수 있는 건 SourceLair 밖에 없어 보입니다.

편집 화면 캡처

편집 화면 - 상단 메뉴 대신 왼쪽에 바 형태로 아이콘을 제공합니다. 편집기에서는 탭으로 파일을 구분하여 작업할 수 있습니다.

  Koding - http://www.koding.io

Koding 의 주요 특징

   - VM 기반 워크스페이스 제공 : VM에 대한 Public IP 제공

   - 편집기 위주의 화면 구성

   - 빌드, 테스트 등은 터미널을 통해 명령어/스크립트로 수행

   - 그림판(Drawing Board) 편집기 제공

   - 메신저(개인 Direct Message / 채널)

      - 채널의 경우 공개되어 있으며, 다른 사용자들과 의견 공유 가능

   - VM 관리

      - VM Spec, Disk Usage, Domain, VM Share, Snapshot 등 IaaS 주요 VM 관리 기능 제공

      - 외부 서비스의 VM 사용 가능 - 해당 VM에서 셋업 스크립트 실행을 통해 초기화

Koding의 경우 다른 서비스들과 달리 Koding을 위한 개발환경이 세팅된 VM을 통째로 제공해 줍니다. VM안의 파일 시스템을 사용하고 언어, 프레임워크, 데이터베이스 등을 설치하여 사용할 수 있습니다. 가장 자유도가 높은 웹 IDE 입니다.

또한 사용하는 IaaS가 있다면 그곳의 VM에 셋업 스크립트를 실행해서 Koding 에서 사용할 수 있도록 설정할 수 있습니다.

주요화면 스크린샷

편집 화면 - Drawing Board에 Hello World 써보기 (악필...)

VM 설정 화면

채널을 통한 커뮤니케이션

Direct Message

외부 VM을 추가하기

  codeanywhere - http://www..io

codeanywhere 의 주요 특징

   - 컨테이너, FTP/SFTP/SSH, Git, 스토리지 서비스로부터 프로젝트를 생성/파일 관리

      - 자체 제공 컨테이너 : 언어 및 프레임워크별 이미지 제공

      - Github/Bitbucket 연동 또는 Git URL 직접 입력

      - 3rd 파티 스토리지 서비스 : 아마존 S3, Dropbox. Google Drive

   - 프로젝트 템플릿은 제공하지 않음

   - 컨테이너의 언어(프레임워크) 스택에 따라 웹 서버 실행

   - 스택에 필요한 패키지 설치 후 커스텀 스택으로 저장 할 수 있음

   - 다른 사용자에게 프로젝트 공유 기능 지원

   - 프로젝트/컨테이너 등의 설정은 JSON 형식의 설정 파일을 직접 수정

   Codeanywhere은 프로젝트 생성 시 '연결'한다는 개념으로 접근합니다. 컨테이너에 연결, GitHub에 연결, SSH 서버에 연결.. 등 파일 시스템을 사용할 수 있는 시스템을 기반으로 하여 개발을 할 수 있도록 해두었습니다. 다만 컨테이너 이 외에는 통합 개발 환경을 제공하기 보다는 웹을 통한 파일 관리의 느낌이 더 드는..?

   컨테이너의 경우에는 '스택'이라는 개념으로 언어나 프레임워크 등을 관리할 수 있도록 되어있고, 개발자가 원하는 패키지를 설치한 후 커스텀 스택으로 저장하여 사용할 수 있습니다.

주요 화면 캡처

프로젝트 생성 (Connection Wizard)

컨테이너 연결 - OS 선택(Ubuntu / CentOS)

편집 화면 - 기본적인 IDE와 비슷한 구성(터미널 제공)

  Cloud9 - https://c9.io

Cloud9 의 주요 특징

   - 컨테이너 기반 개발 환경 제공

   - REPL(Javascript) 제공

   - WAS의 로그 콘솔 제공

   - 로컬 IDE와 유사한 수준의 디버깅 기능 제공

   - 컨테이너 리소스 모니터링 및 프로세스 관리 가능

   - HTML 페이지, 마크다운, 이미지 파일 등의 프리뷰 지원

Cloud9은 개인적으로 이름이 마음에 드는 서비스입니다. 이름이 갖는 의미 만큼의 개발 환경을 제공해 줄 수 있을지는 더 지켜봐야겠지만요..? (오래오래...?)

SourceLair의 경우에는 웹 UI 상에서 패키지 관리를 제공했다면, Cloud9은 컨테이너의 메모리, 디스크와 같은 리소스와 컨테이너에서 실행 중인 프로세스를 관리할 수 있는 기능을 제공합니다.

또 특이하게 REPL(Read Eval Print Loop, 인터프리터 언어의 대화형 쉘)을 제공하는데, 웹 브라우저의 개발자 도구를 활용해도 되긴 하지만 바로 사용할 수 있다는 점에서 편리하긴 하네요. 또한 높은 수준의 디버깅 기능을 제공합니다.

주요 화면 캡처

로그인 후 프로젝트 메인 화면, 사용률 및 README 파일 확인 가능

편집 화면 - 설정 파일 편집(JSON 형식), 오른쪽에는 디버거

프리뷰(Preview) 를 통한 확인

Rails의 출력 로그 확인(터미널과 별도로 제공)

  구름IDE - https://www.goorm.io

구름IDE의 주요 특징

   - 국내에서 개발된 웹 IDE

   - 컨테이너(Amazon EC2 Container) 기반 워크스페이스 제공

      - *.goorm.io / *.compute.amazonaws.com Public URL 제공

   - Java 교육용 컨텐츠(예제 및 템플릿) 제공

   - 로컬 IDE와 유사한 수준의 디버깅 기능 제공

   - Git/Subversion 연동 (다소 불안정)

   - 문서 뷰어 제공(Slideshare.net, PDF 파일)

   - 작업 내역(리비전) 기록 및 해당 리비전에 대한 작업 내역 재생 가능

   구름 IDE 는 국내에서 개발된 웹 IDE입니다. 해외의 주요 웹 IDE에 비해서는 아직 안정성이나 기능적인 면에서 조금 부족한 모습이 보입니다. Git이나 Subversion과 같은 버전 관리 시스템과의 연동은 불안정한 부분이 있구요.(연결이 되기도 했다가 안되었다가..)

   전반적인 기능으로 봤을 때는 실제 개발을 위한 IDE라기 보다는 교육용에 가까운 모습입니다. 프로젝트 생성 시 자바의 문법이나 특정 API와 관련된 샘플 템플릿을 제공한다거나, IDE 편집 화면 내에서 Slideshare.net의 링크나 컨테이너에 업로드한 PDF 파일을 볼 수 있는 뷰어를 제공합니다.

   구름 IDE 역시 Cloud 9과 비슷하게 로컬 IDE와 유사한 수준의 디버깅 기능을 제공합니다.

구름 IDE 아키텍처

주요 화면 캡처

로그인 후에 가상 머신(컨테이너)의 상태를 확인할 수 있습니다.

- 컨테이너를 실행 시켜야 편집 모드를 사용할 수 있습니다.

새 프로젝트 생성 - Java 프로젝트, 예제 프로젝트의 모습이 보입니다.

편집 화면 구성 - 브라우징, 편집기, 채팅, 쉘 등의 기능을 제공

문서 뷰어 - Slideshare.net의 링크를 입력하거나, PDF 파일을 열어서 내용을 볼 수 있음

문서 뷰어 - PDF 파일을 연 모습

II. 오픈소스 웹 IDE

  주요 오픈소스 웹 IDE

- Eclipse Che

- Eclipse Orion

- Eclipse Dirigible

- Eclipse Flux

- Codebox

- Codiad

위 목록에서 보다시피 Eclipse가 붙은 프로젝트가 네 가지가 있습니다. 이름대로 이클립스 재단에서 클라우드 환경에 맞는 IDE 개발을 위해 진행중인 ECD(Eclipse Cloud Development)에  포함된 네 개의 프로젝트입니다. 

http://www.eclipse.org/ecd 에 접속해 보시면 위 네 개의 프로젝트에 대한 소개와 링크를 제공합니다.

  Eclipse Che - http://www.eclipse/che

Eclipse Che 프로젝트는 상용 서비스인 Codenvy에서 이클립스 재단에 기여한 프로젝트입니다.

Codenvy의 UI를 포함하여 대부분의 기능을 제공하고 있습니다.

그러므로 Eclipse Che에 대한 설명은 생략하겠습니다. (...?)

  Eclipse Orion - https://orionhub.org/

오리온의 주요 특징은 아래와 같습니다. 

   - CloudFoundry와 연동 제공

   - 기본적인 수준의 편집 기능 제공

   - 외부 Git 서비스 연동

   - Shell 제공 (지정된 명령어만 사용 가능, 일반적인 터미널과 다름)

   - Public URL 제공

   - manifest.yml 편집 및 유효성 검사 기능 제공

manifest.yml 파일은 CloudFoundry에서 사용하는 애플리케이션의 설정 파일이며, 애플리케이션의 자원(메모리, 디스크), 서비스, 애플리케이션 속성 등을 관리하는 파일입니다.

Eclipse Orion 에서는 manifest.yml 파일을 직접 이용하여 애플리케이션에 대한 설정을 할 수 있도록 되어있으며, 편집기 자체에서 매니페스트 파일의 유효성을 검사합니다. 즉 CloudFoundry에 최적화된 모습을 보입니다. 컬러 테마 역시 CF와 같아 보이는군요. Pivotal 쪽과 관계가 있지 않을까 추측해 봅니다.

주요 화면 캡처

(작아서 잘 안보이지만..) manifest.yml 파일 편집

Git Repository 연동

Git Repository 연동 후 - 커밋 내역이나 파일을 탐색할 수 있습니다.

쉘 - help 명령어를 쳐서 나오는 명령어만 사용가능합니다.

라우팅 설정

라우팅 목록

Cloud Foundry 연동 - API/Manage URL을 입력하여 연동할 수 있습니다.

플러그인 목록 - CF이 외에도 이미지 뷰어 자바스크립트 툴 등의 다양한 플러그인을 제공합니다.

  Eclipse Dirigible - http://www.dirigible.io

Eclipse Dirigible의 주요 특징은 아래와 같습니다.

   - SAP에서 이클립스 재단에 기여

   - Perspective를 통한 화면 구성

      - Database, Debug, Generic, Registry, Repository, Workspace, Help

   - Sandbox를 통한 호스팅 제공

   - 데이터베이스 스키마 편집 모드(Perspective) 제공

   - Plugin Lazy Load

   - UI 구성이 일반적인 IDE와 차이가 있어서 러닝 커브가 있음

IDE로써의 다양한 기능을 제공합니다. 특히 데이터베이스 스키마 편집을 위한 Database 퍼스펙티브와 사용자들이 개발한 프로젝트를 등록하여 공유할 수 있는 Registry를 제공합니다. 이 두 가지 관점에서는 다른 IDE보다 우수하네요.

다만 Plugin Lazy Load 때문에 체감 속도는 더 느리게 느껴집니다. (매번 로딩...) 또한 전반적으로 UI 반응성이 떨어져서 사용성이 떨어지는 느낌입니다. 

주요 화면 캡처

메인 화면 - 기능별로 구분되어 있습니다만 써보기 전엔 이게 뭔지 잘 모를..

IDE 퍼스펙티브 - 로컬 IDE와 유사하게 잘 구성되어 있습니다. 구문 강조 등의 기본적인 편집기 기능을 제공합니다.

데이터베이스 퍼스펙티브 - MySQL 워크벤치처럼 스키마/테이블을 편집할 수 있습니다.

Registry - 사용자들이 등록한 프로젝트를 볼 수 있습니다. 공유된 걸 가져와서 테스트 해보려고 했으나 런타임 익셉션이..

List와 Generic - 정확하게 어떤 기능인지는 모르겠지만 프로퍼티 관리 기능으로 보입니다.

도움말

  Codebox - http://www.codebox.io

Codebox는 분석 전에 스크린샷이나 소개 글로 봤을 땐 개인적으로 괜찮아 보였는데... 테스트 서버에 회원가입 제한이 되어있더군요. (분석할 때는 작년 말이었는데, 지금도 보니 회원가입은 비활성화 되어있네요)

간략하게 특징을 살펴보면

   - Node.js 기반의 Apache 라이선스로 개발

   - Java, Python, Ruby, Go 등의 언어 지원

마지막 커밋이 글을 쓰는 현재(`16. 3. 31) 11개월 전인 것으로 보아 개발이 중지된 것으로 보입니다. (왠지 슬픔 ㅠㅠ)

편집 화면 캡처

사실 이 캡처의 모습이 서브라임과 유사해서 좋았었는데, 조금 아쉽네요.

  결론

   웹 IDE를 통해서 개발 시 소스코드나 리소스 등의 파일은 서버에 위치해 있고, 필요 시 로컬로부터 업로드하여 사용합니다. 물론 컴파일(빌드), 테스트, 배포 등의 작업 역시 서버 내에서 이루어집니다.

   화면으로 제공되는 것 이외에는 모든 작업이 서버에서 이루어지지만, 서버나 VM/Container에서 사용할 수 있는 기능이 모두 UI로 제공되지는 않습니다. 그걸 다 제공한다면 UI는 너무 복잡해 지겠지요.

이런 제한점을 해소할 수 있는 것은 웹 기반 SSH 터미널을 통해 필요한 것을 설치하거나 사용할 수 있습니다. 물론 SSH를 제공하지 않으면 UI로 제공하는 기능이 기능이자 제약이 되기도 합니다.

   속도 면에서는 서비스가 지원하는 성능 또는 과금 모델에 따라 속도 차이가 날 수 있으며, 인터페이스 및 편집기 기능을 제공하는 웹 브라우저에서는 일반적인 로컬 IDE보다는  속도가 느립니다.

네이티브 앱과 하이브리드 앱(또는 웹 앱)에서의 속도차이와 같은 개념으로 볼 수 있겠네요. 현재는 웹 IDE를 기반으로 실제 운영을 위한 서비스를 개발하라고 하면 당연히 무리가 있겠지만 속도, 기술, 기능 등의 면은 시간이 흐를 수록 발전되고 더 나은 사용자 경험을 제공할 수 있다고 봅니다.

   또한 웹 IDE는 클라우드 개발환경이 IaaS에서 PaaS로 점차 넘어가는 환경에서 이에 걸맞은 개발환경이 될 수 있다고 생각하기 때문에 PaaS와 웹 IDE는 유사한 수준으로 함께 발전할 것이라고 생각됩니다.

   개발 환경을 완전히 웹 IDE를 통해 구축할 수 있다면, 그야말로 언제든, 어디서든 개발할 수 있는 환경이 마련되겠네요 :)

※ http://www.slideshare.net/ssusercef361/ide-60399120 업로드 자료

OpenPaaS 프로젝트에서 형상관리는 GitHub로, CI툴은 Travis-CI를 사용하기로 결정되어 개발환경 구성을 위한 설정을 진행 중입니다. 기존에 회사에서 쓰던 CI툴은 Jenkins였는데, 사용법이나 워크플로우, 화면 구성 등이 다르다보니 새로이 파악해야하는 부분들이 있어 정리하게 되었습니다.

 Travis-CI

Travis-CI는 루비로 작성된 오픈 소스 기반의 CI로, 분산 CI 호스팅 서비스를 제공합니다.무료로 사용할 수 있는 travis-ci.org와 프로 버전인 travis-ci.com으로 서비스하고 있습니다.

GitHub 아이디를 통해 가입하고, 해당 아이디의 프로젝트를 연결하여 테스트, 빌드 및 배포를 수행할 수 있습니다.

GitHub 아이디를 통해 가입한 후에 접근 권한이 있는 저장소를 읽어와서 연결하게 되고, 프로젝트(저장소)별로 빌드 수행 여부를 설정할 수 있습니다.

Travis-CI를 통해 빌드하기 위해서는 저장소의 루트에 .YAML 포맷으로 작성한 travis.yml 파일이 있어야 하며 .travis.xml 파일을 통해 설정을 관리합니다.

저장소를 연결하여 빌드를 활성화하면 해당 저장소의 Web Hook에 자동으로 Travis-CI 웹 훅이 등록됩니다. 로컬에서 작업한 후 원격 저장소인 GitHub로 커밋하면 웹 훅을 호출하여 자동으로 Travis-CI를 통해 빌드를 진행합니다.

현재 지원하는 언어로는

• C
• C++
• Cloujure
• C#
• D
• Dart
• Erlang
• F#
• Go
• Groovy
• Haskell
• Java
• Javascript (Node.js)
• Julia
• Objective-C
• Perl
• PHP
• Python
• R
• Ruby
• Rust
• Scala
• Visual Basic

이렇게 23개 언어를 지원하고 있습니다. 각 언어의 특성에 맞는 빌드 설정을 설정 파일인 .travis.yml 파일 내에 작성하여 프로젝트를 빌드하거나 배포할 수 있습니다. 예를 들어 자바의 경우에는 Maven, Gradle, Ant를 지원하고 프로젝트에 맞게 선택하여 적용할 수 있으며, Oracle JDK 7, Open JDK 6과 같이 JDK의 버전을 선택할 수 있고, 커스텀 스크립트를 통해 JDK8이 필요한 경우 JDK 6이 필요한 경우를 나누어 작업을 진행할 수도 있습니다.

Travis-CI를 사용하기 위한 간단한 순서입니다.

1. 회원 가입

Travis CI를 사용하기 위해서는 GitHub 계정을 통해 가입하게 됩니다. Travis CI 홈페이지에서 가입할 수 있으며

GitHub의 과금 정책과 유사하게 http://www.travis-ci.org 에서는 공개된 저장소(Public repository)만 사용할 수 있고, 비공개 저장소(Private repository)를 사용하기 위해서는 프로버전인 http://www.travis-ci.com에서 유료로 사용할 수 있습니다.

프로 버전에서는 플랜에 따라 병렬로 진행할 수 있는 작업(Job)의 수가 달라지며 플랜은 아래와 같습니다.

(Open Source 라고 표시되어 있는 부분이 travis-ci.org 입니다)

https://travis-ci.com/plans

GitHub 계정을 통해 가입하게 되면 저장소에 대한 접근 권한을 허용할 수 있는 페이지가 나타납니다. 여기서 원하는 저장소에 대해 접근 권한을 설정한 후 가입을 완료하게 되고, 추후에 GitHub의 계정 설정 페이지에서 수정할 수 있습니다.

2. GitHub 웹 훅 확성화

로컬에서 작업 후 GitHub로 푸시하게 되면 웹 훅을 통해서 Travis CI에서 자동으로 해당 커밋에 대한 빌드를 수행할 수 있도록 GitHub에서 저장소에 웹 훅을 추가해주어야 합니다. 저장소 설정에서 웹 훅을 추가하기 위해서는 해당 저장소의 설정을 수정할 수 있는 관리자 권한이 있어야 합니다.

웹 훅 설정은 GitHub에서 저장소로 이동한 후 저장소 세팅 페이지에서 "Webhooks & Services" 메뉴를 선택하여 설정할 수 있으며 혹시 Travis CI 서비스가 자동으로 추가되지 않았다면 추가해주면 됩니다.

(저는 웹 훅 활성화가 자동으로 설정이 되어있어서 따로 손 댈 부분은 없었네요.)

3. 저장소에 .travis.yml 파일 추가

Travis CI에서 프로젝트를 빌드하기 위해서는 저장소의 루트에 .travis.yml 파일을 추가해주어야 합니다. 

만약 .travis.yml 파일이 없거나 유효하지 않은 경우에는 Travis CI는 해당 프로젝트를 Ruby언어로 작성되었다고 간주하고 기본값으로 빌드를 수행하게 됩니다. Travis CI의 문서 페이지를 통해 언어별로 상세한 옵션을 확인할 수 있습니다.

제가 테스트를 위해 작성한 .travis.yml 파일은 아래와 같습니다.

언어는 Java로 되어있고, JDK는 oraclejdk7을 사용하며, 빌드가 성공적으로 완료된 후에(after_success) ls -la ./target 명령을 수행하고, 배포는 Openshift로 하도록 설정한 모습입니다.

참고로 Travis CI에서는 환경변수 설정을 지원합니다. 테스트로 사용하는 GitHub의 저장소는 Public인지라 .travis.yml 파일도 노출이 되는데 처음에는 아무 생각없이 오픈시프트의 password를 적으려고 하다가 공개된다는 걸 깨닫고는 Travis CI에서 지원하는 저장소 자체의 환경 변수를 이용해 패스워드를 설정했습니다. (오픈시프트로 배포하는 경우에 인증을 위해 Token을 사용할 수도 있지만 아직은 지원이 되지 않는다고 하네요)

위와 같이 .travis.yml 파일을 저장소 루트에 저장하고, 커밋하면 제가 테스트로 수행한 경우에는 Maven으로 빌드 관리를 하고 있으므로 Travis CI에서 루트에 있는 pom.xml 파일을 자동으로 탐지하여 Maven을 이용해 빌드를 수행하게 됩니다.

4. GitHub 저장소로 푸시하여 빌드 수행

.travis.yml 파일을 추가해준 후 처음으로 로컬에서 GitHub로 푸시하면 Travis CI의 빌드 큐에 작업이 추가되고, 언어에 따라 사용가능한 워커가 선택되어 빌드를 수행하게 됩니다.

Travis CI의 문서에서는 Travis CI에서의 프로젝트 첫 빌드 수행시에는 GitHub의 테스트 훅 버튼을 사용하지 말라고 되어있네요.

5. 빌드 설정 수정

프로젝트의 성격에 따라 빌드 설정을 수정해 줍니다. 예를 들어 테스트를 수행하기 전에 데이터베이스를 생성하거나 기본 설정과 다르게 빌드를 구성하여 수행할 수 있습니다.

빌드 설정 커스터마이징에 대한 내용은 Travis CI 문서의 customize your build나 how to install dependencies for your project 에서 확인하실 수 있습니다.

빌드 설정을 수정한 후에는 travis-lint 명령을 통해 올바른 YAML 포맷으로 작성되었는지 확인해 주시면 됩니다.

이 후에 필요한 추가적인 정보는 Travis CI의 문서 페이지에서 확인하실 수 있습니다.

프로젝트의 언어나 빌드 툴에 따라 문서 페이지에서 설정을 확인하여 적용하여 사용하시면 되겠네요.

(추가적으로 Travis CI를 사용하면서 테스트한 Deploy에 관한 설정이나 Travis CI의 Build Lifecyle 등에 대한 내용을 추가적으로 포스팅할 예정입니다.)

※ 참고 자료

• Wikipedia Travis-CI http://en.wikipedia.org/wiki/Travis_CI
• Travis-CI Getting Started http://docs.travis-ci.com/user/getting-started/
• Travis-CI Build Environment : http://docs.travis-ci.com/user/ci-environment

금방까지 작업하던 이클립스를 종료하고 다시 시작했더니,

로딩 중에 응답이 없어지면서 더 이상 진행이 되질 않는다.

로딩 중인 패키지는 org.eclipse.mylyn.task.ui

키워드를 org.eclipse.mylyn.task.ui 그대로 검색해보니 이클립스의 버그인 듯 하다

참고 : http://eclipse.1072660.n5.nabble.com/Workbench-fails-to-start-Plug-in-org-eclipse-mylyn-tasks-ui-was-unable-to-load-class-org-eclipse-mylt-td134522.html

고치는 방법은 실행 시 워크스페이스 입력 대화상자에서 다른 워크스페이스를 선택해서 한번 실행했다가

File 메뉴에서 Switch Workspace를 이용해 원래의 워크스페이스를 선택하면

이클립스가 재시작되면서 정상적으로 동작한다.

이클립스의 수많은 프로젝트 중에서 Babel 프로젝트란게 있습니다.

자국의 언어로 사용할 수 있게끔 하는 플러그인입니다. 

글을 쓰는 지금은 기준으로 약 40여개국의 언어에 대해 지원한다고 합니다.

Babel 프로젝트 링크 : http://www.eclipse.org/babel/

설치에 앞서 자신의 이클립스 버전을 확인해야 합니다. 이클립스 실행 시 나타나는 로딩창이나,

이클립스를 켠 후 [Help] >> [About Eclipse] 를 통해 사용하고 있는 이클립스의 버전을 확인할 수 있습니다.

각 버전별 업데이트 주소는 아래와 같습니다. 이 중 자신의 버전에 맞는 것을 복사합니다.

Babel Language Pack Update Site for Indigo
http://download.eclipse.org/technology/babel/update-site/R0.9.1/indigo
Babel Language Pack Update Site for Helios
http://download.eclipse.org/technology/babel/update-site/R0.9.1/helios
Babel Language Pack Update Site for Galileo
http://download.eclipse.org/technology/babel/update-site/R0.9.1/galileo

R0.10.0으로 업데이트 되었습니다. (12/07/21 부)

	Babel Language Pack Update Site for Juno http://download.eclipse.org/technology/babel/update-site/R0.10.0/juno Zipped p2 repository (117 MB)
	Babel Language Pack Update Site for Indigo http://download.eclipse.org/technology/babel/update-site/R0.10.0/indigo Zipped p2 repository (109 MB)
	Babel Language Pack Update Site for Helios http://download.eclipse.org/technology/babel/update-site/R0.10.0/helios Zipped p2 repository (131 MB)

※  Babel 프로젝트가 업데이트 되면서 이전 버전의 저장소 경로로는 접근이 안되네요.

현재 최신 버전으로 수정했으나 혹시 접근이 안된다면 아래의 Babel 프로젝트 다운로드 페이지에서

최근에 릴리즈된 버전의 다운로드 주소를 확인하시기 바랍니다.

http://www.eclipse.org/babel/downloads.php

이제 이클립스로 돌아가서 [Help] >> [Install New Software...] 을 선택하여 Install 대화상자를 띄웁니다.

[그림 1] Install 대화상자 열기

[그림 2] Install 대화상자

Install 대화상자에서 [Add...] 버튼을 눌러 새 저장소를 추가합니다.

Name에는 적당한 이름을 넣으시고, Location에 아까 복사한 주소를 붙여넣고 [OK]버튼을 눌러 완료합니다.

[그림 3] Add Repository 대화상자

[OK]를 누르고 나면 Pending... 이라는 글자가 보이면서 서버에서 저장소내의 목록을 읽어오게 됩니다.

조금 기다리면 Babel 프로젝트의 목록들이 보이는데 이 중에서

Babel Language Packs for eclipse 항목 왼쪽의 ▷ 버튼을 눌러 하위 항목이 나타나면

Babel Language Pack for eclipse in Korean 항목에 체크합니다.

[그림 4] 한국어 언어팩 선택

선택을 완료하였으면 [Next] 버튼을 눌러 다음 화면으로 넘어가면 설치할 목록을 보여줍니다.

여기서 다시 [Next] 버튼을 클릭하여 다음으로 넘어갑니다.

[그림 5] 설치 목록 확인 대화상자

라이센스에 동의하겠냐는 확인 대화상자가 나타납니다.

I accept the terms of the license agreement 를 선택한 후 [Finish]를 선택하여 설치를 시작합니다.

[그림 6] 라이센스 동의 대화상자

설치가 시작되었습니다. [Run in Background] 버튼을 클릭하시면

백그라운드에서 설치를 계속 하도록 할 수 있습니다. 그럼 계속해서 이클립스로 작업을 하실 수 있습니다.

[그림 7] 설치 중..

설치 하시다 보면 Security Warning 이라는 대화상자가 나타납니다.

서명이 되어있지 않은 소프트웨어를 설치하려고 하는데 계속 할거냐? 라고 묻는 내용입니다.

물론 문제는 없으므로 [OK]버튼을 눌러 설치를 계속 합니다.

[그림 8] Security Warning 대화상자

설치가 완료되면 이클립스를 재시작할 것인지를 물어봅니다.

[Restart Now]를 선택하시면 바로 재시작이 되고 [Not Now]를 선택하시면 재시작하지 않습니다.

[Apply Changes Now]를 선택하면 재시작하지 않고 변경내용을 적용합니다.

[Apply Changes Now]는 오류가 발생할 수도 있으므로 한글화를 확인하려면 [Restart Now]를 선택합니다.

[그림 9] 재시작 확인 대화상자

이클립스를 재시작하면 메뉴가 한글화 된 것을 확인할 수 있습니다.

[그림 10] 한글화된 이클립스