HTML5와 JavaScript 기반 Worklight 크로스-플랫폼 응용 프로그램

스마트폰 및 태블릿 컴퓨터의 인기와 함께 점점 더 많은 인터넷 그것 회사는 모바일 플랫폼에 초점을 맞추고. 시장에서 현재 주류 모바일 플랫폼은 애플 IOS, 구글의 안 드 로이드, 마이크로소프트의 Windows Phone, 블랙베리와 노키아의 심 비안. 이러한 모바일 플랫폼은 다양 한 개발 환경 및 프로그래밍 언어 있다. 동시에 Android2.3와 Android3.0, 각각 스마트폰 및 태블릿을 지 원하는 등 플랫폼의 여러 버전이 있습니다. 이러한 다양성 때문에 모바일 응용 프로그램의 개발 비용, 긴 주기 어려운 유지 보수 등 몇 가지 문제가 있다.

Worklight는 모바일 응용 프로그램 개발 및 인프라 통합을 위한 IBM 인수 엔터 프 라이즈-클래스 솔루션. 그것은 여러 모바일 플랫폼을 위한 HTML5와 자바 스크립트 기반 크로스 플랫폼 응용 프로그램 로컬 응용 프로그램 개발을 지원 합니다.

이 문서는 주로 worklight 및이 기능을 사용 하 여 다른 모바일 단말기에 대 한 크로스-플랫폼 응용 프로그램을 개발 하는 방법의 runtimeskin 특성을 소개 합니다.

개발 환경 설치 및 구성

Worklight 통합 관리, 배포, 그리고 행의 모니터링 개발에서 소프트웨어 개발 수명 주기의 모든 측면을 커버 하는 모바일 응용 프로그램 개발 환경을 제공 합니다. 그것은 주로 4 개의 부품, Worklight 스튜디오, Worklight 서버, 장치 런타임, 및 이루어져 worklight 콘솔:

Worklight 스튜디오 이클립스, 어디 사용자 수 쉽게 만들고, 개발, 배포 및 테스트 지역 또는 다른 플랫폼에서 혼합 응용 프로그램에 따라 통합된 개발 환경입니다. Worklight는 잘 개발 된 모바일 응용 프로그램을 배포 하기 위한 기반으로 톰캣 서버입니다. 그것은 또한 사용자 로그인 인증, 배경 데이터 상호 작용, 메시지 푸시 및 기타 엔터프라이즈 응용 프로그램 작업에 대 한 어댑터 (어댑터) 구성 요소를 제공합니다. 장치 런타임 Worklight sdk 주로 다양 한 모바일 플랫폼에 로컬 리소스를 호출할 수 있는 인터페이스를 제공 하는 구성 요소 이며 개발자는 자바 Api, 운영 체제 로컬 라이브러리, 및 제 3-파티 라이브러리를 사용 하 여 이러한 인터페이스를 호출할 수 있습니다. 로컬 응용 프로그램의 장점 이용 하 여를 확인 합니다. Worklight 콘솔 사용자를 모니터링 및 관리 응용 프로그램 및 어댑터 구성 요소 브라우저를 통해 현재 Worklight 서버에 배포할 수 있습니다. Worklight 콘솔 메시지 푸시 관리 및 보고서 분석에 대 한 책임 이기도합니다.

Worklight 개발 환경에 대 한 다운로드 및 설치 단계는 IBM DeveloperWorks worklight 학습 자원에서에서 얻을 수 있습니다.

무슨 시간 피부 (런타임 피부) 실행

실행-시간 피부는 worklight는 응용 프로그램을 모바일 플랫폼 환경 (worklight 환경) 작성 된 여러 스킨을 추가할 수 있습니다, 각 피부는 플랫폼 환경의 하위 집합 및 모든 스킨 설치 파일에서 응용 프로그램의 일부로 패키지. 응용 프로그램이 실행 되 면 동적으로 특정 모바일 장치에 따라 사용 하 여 피부를 결정 한다. 다른 휴대 전화 크기, 다른 모바일 플랫폼 버전 실행 시 스킨의 많은 응용이 있다, 그래서 HTML5를 지원 합니다.

여기 Worklight 런타임 피부 기능을 적용 하는 방법을 설명 하는 뉴스 검색 응용 프로그램의 예가입니다.

Worklight 엔지니어링 및 응용 프로그램 만들기

우리 worklight 프로젝트를 만듭니다. 파일 선택-> 새로운 그림 1에서 보듯이 worklight 이클립스, 프로젝트->.


그림 1입니다.
엔지니어링 Worklight 만들기




모바일 뉴스 프로젝트 이름을 입력 합니다. 우리 worklight 응용 프로그램을 만들고 선택 파일-새로운 다음 그림 2와 같이 worklight 응용 프로그램->.


그림 2입니다. Worklight 만들기 응용 프로그램





팝업 창에서 새 프로젝트의 첫 번째 단계를 선택 하 고 그림 3과 같이 NewsApp, 응용 프로그램의 이름을 입력 하십시오.


그림 3입니다. 공학
에서 응용 프로그램 만들기




프로젝트와 응용 프로그램을 만든 후 Worklight 자동으로 생성 하는 다음 디렉터리 구조 그림 4와 같이.


그림 4입니다. 응용 프로그램 디렉터리 구조





 

우리는 애플 리 케이 션 디렉토리에는 그냥 응용 프로그램 NewsApp, 각 응용 프로그램은 (IOS, 안 드 로이드, 블랙베리, 등.) 같은 다른 모바일 플랫폼 환경에 의해 공유 하는 일반적인 런타임 환경을 포함을 참조 하십시오. 일반적인 폴더 아래 3 폴더 CSS 이미지, JS, CSS 파일 프로그램 관련, 사진, 및 JavaScript 파일 저장이 있다. Newsapp.html은 프로그램은 자동으로 생성 하는 기본 HTML 파일입니다.