mozilla
검색 결과

    Firefox OS 시뮬레이터

    Firefox OS 시뮬레이터는 아직 개발 초기 단계입니다. 저희가 원하는만큼의 안정성과 완성도 없습니다.

    버그를 발견하셨다면 GitHub에 보고 해주세요. 만약에 물어보실게 있으시다면 개발자 도구 메일링 리스트 irc.mozilla.org의 #devtools에서 질문해 주세요.

    도움 받기 항목의 Verbose logging을 활성화 하는 방법과 최신 빌드를 받는 법을 읽어 주세요.

    Firefox OS 시뮬레이터 부가 기능을 이용해 데스크톱 환경에서 Firefox OS 응용 프로그램을 테스트하고 디버깅 할 수 있습니다. 시뮬레이터에서는 실제 장치 사용하는 것보다도 Code-Test-Debug 주기가 빨라집니다. 또한 당연히 시뮬레이터를 사용하기 위해 실제 디바이스가 필요 없습니다.

    근본적으로, 시뮬레이터 부가 기능 구성하는 것은 다음과 같습니다 :

    • 시뮬레이터:여기에는 Firefox OS 데스크톱 클라이언트 포함되어 있습니다. 이것은 데스크탑 환경에서 실행되는 Firefox OS 고수준 계층 버전입니다. 시뮬레이터에는 표준 Firefox OS 데스크톱 빌드에는 없는 추가적인 에뮬레이션 기능도 포함되어 있습니다.
    • 대시보드: 시뮬레이터 시작과 종료 및 응용 프로그램의 설치,제거디버깅을 가능하게하는 Firefox 브라우저에서 제공하는 도구입니다. 또한 Dashboard 실제 디바이스에 푸시하거나 앱 매니페스트에 대한 일반적인 문제를 확인 수 있습니다.

    아래 스크린 시뮬레이터를 사용한 디버깅 세션을 보여줍니다.

    Dashboard는 오른쪽 상단의 Firefox 탭 안에서 돌아가고 있습니다. 여기에 "Where am I?"라는 이름의 패키지 애플리케이션 추가했습니다. 상좌단의 앱은 시뮬레이터를 돌리고 있습니다. 또한 아래쪽의 패널에서 보시다시피 디버깅 도구와 연결하고 있습니다. 콘솔 창에 앱에 대한 메시지가 표시되는 것을보실 수 있습니다.

    이 가이드는 다음과 같은 주제를 다룹니다:

    실제 Web 응용 프로그램을 디버깅하는데  Simulator를 사용하는 방법을 보여주는 실질적인 자세한 설명은 Simulator Walkthrough 페이지를 참조하십시오.

    시뮬레이터 설치하기

    시뮬레이터 는 Firefox 부가 기능 에서 배포 하고 있습니다 . 설치 방법은 다음과 같습니다 :
     

    1. Firefox에서 addons.mozilla.org 에서 시뮬레이터 페이지 를 방문 하십시오.
    2. "Firefox 에 추가" 를 클릭 하십시오.
    3.  기능을 다운로드 한뒤 확인 메시지가 표시 되면 " 지금 설치 " 를 클릭 하십시오.


    부가 기능의 크기가 큰 관계로 설치 중에 Firefox가 몇 초 동안 정지되거나 "경고 : 응답하지 않는 스크립트" 라는 제목의 대화 상자가 표시 될 수 있습니다. 대화 상자가 표시 되면 설치가 완료 될 때까지 기다리기 위하여 " 처리 를 계속 " 을 클릭 하십시오. 이 문제는 Firefox 27부터 발생하지 않습니다.

    시뮬레이터 부가 기능 의 설치 가 완료되면 Firefox는 정기적으로 새로운 버전을 확인 하여 최신 상태 를 유지 합니다.

    시뮬레이터를 설치 하면 대시보드가 자동으로 열리지 만 "Firefox" 메뉴 (OS X 및 Linux에서는 "도구" 메뉴 ) 의 "웹 개발 도구" 에서 " Firefox OS 시뮬레이터 " 를 선택하여 언제든지 대시보드를 열 수 있습니다 :


    아래 보여지는 대시보드는 애플리케이션 시뮬레이터에 추가하고 실행하는 데 사용하는 도구입니다:

    앱을 추가하고, 제거하고, 새로고침하기

    앱 추가하기

    패키지 형 응용 프로그램을 시뮬레이터 에 추가 하려면 대시보드를 열고 " Add Directory " 를 클릭합니다. 그리고 앱의 매니페스트 파일을 선택 하십시오.

    호스트 형 응용 프로그램을 추가 하려면 " URL for page or manifest.webapp "라고 표시 되는 텍스트 상자에 URL 을 입력 하고 " Add URL " 을 클릭 하십시오. URL이 매니페스트를 가리키는 경우 해당 매니페스트가 사용 됩니다. 그렇지 않은 경우 는 Dashboard 가 해당 URL 위한 매니페스트를 생성 합니다 : 따라서, URL을 입력 하는 것만으로 모든 Web 사이트를 앱 으로 추가 할 수 있습니다 .

    앱 을 추가 하면 대시보드가 매니페스트 파일 에 대해 일련 의 테스트 를 수행하여 일반적인 문제를 확인 합니다. 어떤 테스트 를 실시할지 에 대한 자세한 내용 은 매니페스트 검증 섹션을 참조하십시오.

    매니페스트 유효성 검사 응용 프로그램 오류가 발견 되지 않으면 대시보드는 자동으로 시뮬레이터에서 응용 프로그램을 실행 합니다.

    앱 관리하기

    추가하면 매니저에서 설치된 응용 프로그램 목록에 표시됩니다 :

    항목은 앱에 대한 다음과 같은 정보를 보여줍니다:

    • 매니페스트 내에 써 있는 앱의 이름
    • 앱의 타입(패키지형, 호스팅형, 생성형)
    • 매니페스트 파일로의 링크
    • 매니페스트 검증의  결과

    또 다음과 같은 네개의 명령을 제공합니다.

    • "Refresh": 에 대한 변경을 한 시뮬레이터 응용 프로그램을 업데이트 다시 로드합니다. 또한 대시보드에서 매니페스트 검증을 다시 실행합니다. 앱에 어떤 수정을 가해도 바로 변경 사항이 적용되지 않습니다 : 변경 사항 적용하기 위해 응용 프로그램 업데이트가 필요합니다.
    • "Connect": 선택한 애플리케이션 개발 도구 연결합니다. 실행하지 않는 경우 대시보드가 시뮬레이터 응용 프로그램을 자동으로 시작합니다.
    • "Remove" ("X"): 애플리케이션을 시뮬레이터 대시보드에서 삭제합니다. 대시보드를 열고있는 동안에는 작업 실행취소 할 수 있습니다.
    • "Receipt": 유료 앱의 영수증 검증 테스트 수행합니다. 테스트하려는 영수증 종류 선택하면 테스트 영수증과 함께 응용 프로그램을 다시 설치합니다.

    시뮬레이터 창에서 애플리케이션 업데이트 : 애플리케이션 실행하는 경우 메뉴 에서 작업 또는 할당 된 바로 가기 키로 시뮬레이터 창에서 직접 응용 프로그램 업데이트 다시로드 할 수 있습니다.

    매니페스트 검증

    매니페스트를 제출하면 매니저는 매니페스트 여러개의 검증 테스트를 실행 합니다. 검증 테스트는 세 가지 범주 에 대해 문제를 보고합니다 :
     

    • manifest errors : 응용 프로그램을 설치 및 실행을 할 수가 없게되는 문제입니다.
    • manifest warnings : 응용 프로그램 의 정상적인 작동을 방해하는 문제입니다.
    • simulator - specific warnings : 응용 프로그램이 사용하는 기능중에 시뮬레이터가 제공하지 않는 기능이 있는 경우입니다.

    이것은 앱 의 항목에 발생한 문제의 간략적인 정보를 제공합니다 : 요약된 항목을 클릭 하면 세부 정보가 표시 됩니다.

    매니페스트 에러

    대시보드 는 다음과 같은 상황을 오류로 보고 합니다. 이 문제를 해결 하지 않으면 해당 응용 프로그램은 시뮬레이터에서 실행되지 않을 것입니다:

    • 매니페스트 필수 필드 " name " 이 없다.
    • 매니페스트가 올바른 JSON가 아니다.
    • 응용 프로그램은 호스트형 애플리케이션 이지만, 매니페스트의 type 필드를 패키지형에만 사용할수 있는 " privileged " 또는 " certified " 이다.
    • 일반적인 appCache 오류 (패키지 형 응용 프로그램은 appCache 를 사용할수 없습니다. 매니페스트 파일을 요청하면 HTTP 리디렉션 또는 HTTP 오류 상태를 반환할 것입니다.)

    다음은 매니페스트 필수 필드 "name"이 없는 매니페스트를 추가하려고 할 때의 예시입니다.

    매니페스트 경고

    대시보드는 다음과 같은 매니페스트 이슈들의 대한 경고를 보고할 것입니다:

    • 아이콘이 없음
    • 아이콘이 128픽셀보다 작음: Marketplace에 올려지는 모든 앱들은 최소 128픽셀의 1개의 아이콘을 가져야 합니다.
    •  type필드가 인식되지 않습니다.
    • 매니페스트가 알려지지 않은 permission(권한)을 요구한다.
    • 매니페스트가 거부될 permission(권한)을 요구한다.
    • 접근할수 있는지 규정할수 없는 permission(권한)을 요구한다.

    시뮬레이터 한정 경고들

    마지막으로, 매니저는 앱이 사용하는 Firefox OS 기능중 시뮬레이터에서 완벽하게 지원되지 않는 기능들에 관해서 경고를 할 것입니다:

    • type 필드가 인증됨(certified)일 경우, 인증된 앱들은 시뮬레이터에서 완벽하게 지원하지 않습니다.
    • 앱이 요구하는 API로의 permission(권한)중 시뮬레이터가 아직 지원하지 않는 API가 있을때

    시뮬레이터 돌리기

    시뮬레이터를 실행시키는 방법엔 다음과 같은 두가지 방법이 있습니다:

    • 만약에 앱을 추가하셨거나 앱 추가 옆에 있는  "Refresh"나 "Connect" 버튼을 다음에 클릭하셨으면, 대시보드는 자동으로 추가하신 앱이 띄워저 있는 시뮬레이터를 실행할 것입니다.
    • 만약에 대시보드의 좌측에 있는 "Stopped"를 클릭하신다면, 시뮬레이터는 홈 스크린으로 시작할 것이며, 여러분은 수동적으로 여러분의 앱을 실행시켜야 합니다.

    어떤 방법을 쓰던지와 상관 없이 시뮬레이터가 작동하기 시작되면, "Stopped"라고 써 있던 버튼이 초록색으로 된 "Running"라고 써 있는 버튼이 됩니다. 시뮬레이터를 정지하실려면 이 버튼을 한번 더 클릭해 주세요.
     

    시뮬레이터는 320x480 픽셀의 시뮬레이션된 화면과 하단에 툴바와 상단에 메뉴바를 가지는 분리된 새로운 창으로 나타납니다:

    터치 이벤트를 시뮬레이션 하기 위해서는 마우스 버튼 클릭을 유지하면서 드래그 해 주세요. 홈스크린에서 오른쪽으로부터 왼쪽으로 클릭하시고 드래그 하시는걸 통해서 여러분은 여러분이 추가한 앱들과 내장된 앱들을 보실수 있습니다:

    시뮬레이터 툴바

    하단 툴바에는 왼쪽에서부터 오른쪽으로 홈 버튼, 스크린 회전 버튼, 그리고 Geolocation 버튼이 있습니다.

    • 홈 버튼은 여러분을 홈 스크린으로 데리고 갑니다(혹은 길게 몇초간 누르시면 최근 태스크 리스트로 데리고 갑니다)
    • 스크린 회전 버튼은 시뮬레이터 화면의 방향을 가로나 세로로 변경합니다. 이 버튼은 orientationchange 이벤트를 일으킬 것입니다.
    • Geolocation 버튼은 여러분의 위치나 따로 지정한 위치를 물어보게 합니다: 이 위치는 Geolocation API을 이용해 여러분의 앱에서 설정할수 있습니다.

    시뮬레이터 메뉴바

    상단 메뉴바에서는 여러분은 개발을 더 효율적으로 만들수 있게 해주는 여러 명령들을 쓰실수 있습니다.

    • File -> Quit (Ctrl/Cmd - Q): 시뮬레이터를 종료합니다.
    • App -> Refresh (Ctrl/Cmd - R): 시뮬레이터를 새로고침합니다.

    "App Refresh"를 실행하는 키보드 단축키는 앱을 웹 페이지처럼 반복적으로 개발하는걸 가능하게 합니다:

    • 코드에 대한 변경을 만듬 (그리고 필요하다면 빌드 툴을 다시 동작함, e.g. volo / yeoman / grunt)
    • 키보드 단축키를 입력하셔서 시뮬레이터에서 실행중인 앱을 새로 고침한다.

    "앱을 새로 고침하고 데이터를 제거하기" 숨겨진 지름길: 가끔씩 시뮬레이터가 앱을 위해서 저장한 데이터를 초기화 시키는게 도움이 될 때도 있습니다, 그래서 시뮬레이터는 이와 관련된 숨겨진 단축키를 가지고 있습니다. Shift - Ctrl/Cmd - R를 이용하면 시뮬레이터는 다음과 같은 여러 데이터를 초기화한뒤 앱을 새로 고침할 것입니다:

    • 로컬 스토리지 / 세션 스토리지

    • 쿠키

    • 인덱스된 DB

    • 앱 캐시

    개발자 도구들과 연결하기

    여러분의 앱의 디버깅에 도움을 주기 위해 여러가지 개발자 도구들을 시뮬레이터 연결하실수 있습니다. 지금부로는 오직 JavaScript Debugger, Web Console, Style Editor, Profiler 그리고 Network Monitor만 연결할수 있지만, 저희는 더 많은 developer tools을 연결할수 있도록 노력중입니다.

    이 중에 몇몇 툴은 파이어폭스의 베타, Aurora 혹은 Nightly builds 버전에서만 이용하실수 있습니다.

    개발자 도구들을 시뮬레이터와 연결하실려면, "Connect" 버튼을 클릭해 주세요:

    대시보드는 대시보드 하단에 개발자 도구 창을 열고 앱과 연결합니다:

    웹 콘솔

    앱은 console object(콘솔 객체)를 이용해 log를 남길수 있습니다. 웹 콘솔은 다음과 같은 앱이 작성한 메세지를 표시합니다: 네트워크 요구, CSS 그리고 J S 경고/오류, 보안 오류들. (Learn more about the Web Console.)

    디버거

    문제를 더 빨리 발견하고 해결하기 위해 디버거를 사용하면 여러분은 손쉽게 연결된 앱의 자바스크립트의 단계별 실행 , 분기점 관리, 식 보기 등을 할수가 있습니다. (Learn more about the Debugger.)

    스타일 편집기

    스타일 편집기를 연결하면 에서 참조하는 CSS 파일의 열람이나 편집이 가능합니다. 변경 한 부분은 업데이트 필요없이 실시간으로 반영됩니다. (Learn more about the Style Editor.)

    프로파일러

    에 연결된 프로파일러 도구를 사용하여 JavaScript 코드에서 시간이 너무 많이 소요하는 구간을 찾을수 있습니다. 프로파일러는 JavaScript 최근 호출 스택을 샘플하고 컴파일 상태를 주기적으로 샘플링합니다. (Learn more about the Profiler.)

    네트워크 모니터

    새로운 네트워크 모니터 덕분에, 앱이 시작한 모든 네트워크 요청 상태 헤더, 콘텐츠 타이밍 사용자 친화적인 인터페이스를 통해 분석 할 수 있습니다.(Learn more about the Network Monitor.)

    영수증

    만약에 여러분이 유료 앱을 개발중이시라면 여러분은 여러분의 앱의 유효한 (cryptographically signed) 영수증(valid receipt)을 가진 영수증 인증 코드 (receipt validation code, 코드는 유저가 이미 앱을 구매했거나 환불을 요구했음을 보여주고 유저에게 앱의 기능을 제한하거나 허락함을 알립니다)를 테스트 하셔야 합니다.

    시뮬레이터의 대시보드의 항목에있는 "Receipts"메뉴를 이용해 각 앱을 "Valid, "Invalid", "Refunded" 테스트 영수증함께 설치할수 있습니다. 테스트하려는 영수증 종류 선택하면 대시보드가 Marketplace 영수증 서비스에서 종류 테스트 영수증을 가져오고 시뮬레이터에서 테스트 영수증과 함께 응용 프로그램을 다시 설치합니다 :

    기기로의 전송

    만약에 여러분이 별도의 Firefox OS 기기들이 있으시다면, 여러분을 그 기기들을 시뮬레이터에 연결할수 있고, 추가하신 앱들을 대시보드에서 기기들로 바로 전송할수 있습니다.

    기기에 연결하기

    기기를 연결하시려면 connecting a Firefox OS device to the desktop에 있는 가이드를 따르십시오.시뮬레이터가 ADB를 미리 포함하고 있기 때문에 따로 설치를 하실 필요가 없다는걸 염두해 두세요.

    앱을 디바이스로 전송하기

    일단 데스크탑과 기기를 준비하시고 기기를 데스크탑에 USB로 연결하셨다면, 대시보드에서 디바이스가 연결되었음을 알리는 "Device connected"가 뜨는걸 보실수 있습니다. 그리고 "Push"라고 되어 있는 새로운 명령 버튼이 나타납니다:

     "Push"버튼을 클릭하시면 선택하신 앱은 자동적으로 Firefox OS 기기에 전송되었을 것입니다.

    수동적 방법:

    • 응용 프로그램을 장치 푸시한뒤 업데이트 된 콘텐츠 얻기 위해선 수동으로 응용 프로그램을 닫고 다시 시작해야합니다.

    • 매니페스트에 어떤 변경(예를 들어서 앱 이름, 화면 방향, 타입, 권한)을 한 경우에는 운영체제를 재부팅 해야지 효과를 적용할수 있습니다.

    Firefox OS 기기 연결 확인

    어느 기기에서 재부팅 할때나 첫번째 "Push"(전송) 요구는 디바이스에서 확인되어야 합니다:

    Linux에서 문제해결

    udev rules를 생성하신뒤에 기기에 연결이 안 된다면 이 bug를 참조하세요.

    시뮬레이터의 제약

    Firefox OS 시뮬레이터가 완벽한 시뮬레이션을 제공하지 않음을 염두해 두세요.

    하드웨어 제약

    스크린 사이즈를 제외하고도, Firefox OS 시뮬레이터는 Firefox OS 기기들의 CPU 속도나 메모리같은 하드웨어 제약을 시뮬레이트하지 않습니다.

    오디오/비디오 코덱

    다음과 같은 코덱들은 하드웨어 가속에 의존하므로 아직 지원되지 않습니다:

    • MP3
    • AAC
    • H.264 (MP4)
    • WebM

    이것은 위에 리스트 되어있는 코덱을 사용하는 앱이나 유튜브같은 웹사이트들은 작동하는것이 불가능하다는걸 의미합니다.

    지원되지 않는 API들

    데스크탑 하드웨어의 제약 때문에, 몇가지의 API들은 시뮬레이터에서 작동을 하지 않습니다. 저희는 geolocation과 같은 몇몇 API들을 위한 시뮬레이션을 넣었습니다. 하지만, 지금으로서는 다음 리스트에 있는 API들은 작동하지 않습니다. 다음과 같은 API를 사용하면 에러가 뜨거나 맞지 않은 결과를 가져다 줄 것입니다:

    도움 받기

    Firefox OS 시뮬레이터는 아직 개발 초기 단계입니다. 저희가 원하는만큼의 안정성과 완성도 없습니다.

    버그를 발견하셨다면 GitHub에 보고 해주세요. 만약에 물어보실게 있으시다면 개발자 도구 메일링 리스트 irc.mozilla.org의 #devtools에서 질문해 주세요.

    verbose logging을 활성화하는 방법

    설정하기 위해 about:config를 사용해 주세요. extensions.r2d2b2g@mozilla.org.sdk.console.logLevel를 정수값 0으로 설정해 주세요, 그리고 부가 기능을 비활성화하고 재활성화를 해주세요. 시뮬레이터 구동에 관련한 추가적 메세지들은 에러 콘솔에서 나타날 것입니다(혹은 최신 버전의 Firefox의 브라우저 콘솔에서)

    어떻게 시뮬레이터의 가장 최신 프리뷰 빌드를 받을수 있을까요?

    이 문서의 한 섹션이 설명하는 대로, 여러분은 최신 Firefox OS 빌드 추가기능을 addons.mozilla.org에서 받을수 있습니다.

    가끔 여러분은 아직 공식적으로 릴리즈 되지 않는 기능들을 사용할수도 있을텐데요. 그렇다면, 여러분들은 최신 프리뷰 빌드들을 다음과 같은 URL들에서 받으실수 있습니다.

    프리뷰 빌드들은 릴리즈된 빌드들보다 덜 안정적이고 테스트 되어야 함을 염두해 두세요.

    문서 태그 및 공헌자

    Contributors to this page: JHKinkorea
    최종 변경: JHKinkorea,