주요 문서
-
Web Audio Editor 개발 도구 소개
Firefox 32 버전에서는 웹 개발 도구로서 기존 편집기와 Canvas 디버거에 이어 Web Audio Editor를 추가합니다. Web Audio를 사용하는 HTML5게임이나 즐거운 신디사이저를 개발할 때, Web Audio Editor는 Web Audio의 AudioContext에 포함된 모든 오디오 노드의 시각화나 편집을 지원합니다. Audio Context 시각화 Web Audio API의 Modular Routing을 다룰 때 오디오 출력을 듣기 전에 모든 오디오 노드가 어떻게 접속되어 […]
-
파이어폭스 개발자 도구 캔버스 디버거를 소개합니다
캔버스 디버거(Canvas Debugger)는 우리가 샌프란시스코 게임개발자컨퍼런스(Game Developers Conference)에서 시연한 새로운 도구입니다. 캔버스 요소에서 표현되는 애니메이션 프레임을 디버깅하는 도구지요. 여러분이 시각효과, 애니메이션을 만들거나 게임 디버깅을 할 때 이 도구는 여러분의 애니메이션 루프(loop)를 이해하고 최적화하는 데 도움이 될 겁니다. 여러분이 웹GL(WebGL) 또는 2D 캔버스 콘텍스트를 디버깅할 수 있게 해줍니다. 여러분은 파이어폭스 개발자 도구(Firefox’ Developer Tools)에 포함된 자바스크립트 […]
-
준비 끝! “Firefox OS를 위한 앱 기초” 과정이 당신을 기다립니다
이 글은 Chris Heilmann의 It’s a wrap! “App Basics for FirefoxOS” is out and ready to get you started의 한국어 번역본입니다. 일주일쯤 전에 우리는 비디오 강좌 시리즈 한편을 완성했습니다. 이 강좌는 Firefox OS용 HTML5 앱을 만드는 방법에 관한 것입니다. 이제 당신은 이 강좌의 모든 비디오를 한번에 학습할 수 있습니다. Photo by Olliver Hallmann 이 시리즈는 […]
-
Firefox 개발자 도구에서 Sass와 Less 실시간 편집하기
Sass 와 Less 는 CSS로 컴파일되는 표현식(Expressive) 언어입니다. 여러분이 Sass나 Less를 가지고 CSS 파일을 만들고 계시다면, CSS를 별도로 만들지 않고 소스코드만 디버깅하고 싶을 때가 있었을 것입니다. 이제는 Firefox 개발자 도구에 있는 소스맵을 사용해 디버깅이 가능해졌습니다! Firefox 개발자 도구는 소스맵을 사용하여 원 소스코드에서의 줄 번호를 보여주고 스타일 에디터를 통해 여러분이 편집을 가능하게 만들어 줍니다. 아래 간단한 […]
-
CSS 소스맵 및 네트워크 성능 분석 등 – Firefox 개발 도구 Episode 29
Firefox 29 버전이 Aurora 출시 버전으로 전환 하였습니다. . 이번 버전에서는 웹 개발자용 도구에서 큰 변화를 가지고 있습니다. (본 버전은 12주 후에 베타 버전을 거쳐 출시될 예정이지만 웹 개발자들이 미리 알아두면 좋을 기능을 소개해 드립니다.) 개발자 도구 외양 변경 먼저 개발자 도구의 Dark 테마 및 Light 테마의 외부 디자인을 업데이트 했습니다. Light 테마는 전면적으로 개선하였고, […]
-
Split console, pretty-print minified JS 등 – Firefox 개발자 도구 Episode 28
이 글은 Jeff Griffiths, Victor Porof와 Robert Nyman의 Split console, pretty-print minified JS and more – Firefox Developer Tools Episode 28의 한국어 번역본입니다. 휴일 시즌에 맞추어, Firefox 개발자 도구 팀이 여러분이 휴일간 프로젝트를 즐길 수 있을만한 놀라운 것들을 준비했습니다! 목록이 꽤 길지만 소개를 시작해보도록 하겠습니다. 앱 매니저 앱 매니저 는 여전히 개발자도구팀에게 있어 가장 우선순위의 […]
-
Firefox 개발자 도구로 WebGL 쉐이더 실시간 편집하기
이 글은 Jeff Griffiths, Victor Porof와 Robert Nyman의 Live editing WebGL shaders with Firefox Developer Tools의 한국어 번역본입니다. 혹시 여러분이 Epic Games의 HTML5로 만든 ‘Epic Citadel’를 보신적이 있다면, 분명 게임의 퍼포먼스 측면에서나 표현의 디테일에 감탄했을 것입니다. 여러분이 화면에서 본 멋진 시각적 효과들을 만들어낸 코드들은 프로그램에 함께 링크된 asshaders로 작성되었습니다 – 실시간 시각적 효과의 높은 성능을 내기 위해 […]
-
Firefox 개발자 도구: 에피소드 27 – Edit as HTML와 Codemirror, 그리고 몇 가지 기능들
이 글은 Paul Roget의 Firefox Developer Tools: Episode 27 – Edit as HTML, Codemirror & more의 한국어 번역본입니다. Firefox 27이 Aurora 배포 채널에 포함되었습니다. 여기서 Firefox 개발자 도구의 새로운 기능을 소개하려고 합니다. JS 디버거: DOM 이벤트 Break 이제 수동으로 breakpoint를 지정할 필요없이 자동으로 여러 DOM 이벤트에 break를 걸 수 있습니다. 디버 창의 가장 오른쪽 상단(search […]
-
Firefox OS App Manager 소개
이 글은 Introducing the Firefox OS App Manager 를 번역한 글입니다. Firefox OS App Manager는 Firefox 26에서 새롭게 사용할 수 있는 도구입니다. 시뮬레이터나 연결된 디바이스 어디에서라도 Firefox OS 앱을 빌드하고 디버깅하는 과정을 상당히 많이 개선하였습니다. Firefox OS 시뮬레이터 부가 기능을 기반으로, 현존하는 Firefox 개발자 도구와 Firefox OS 시뮬레이터 사이에 발생했던 차이점을 느끼지 못하게 해주면서 개발자가 […]
-
Firefox 브라우저 콘솔 사용하기
이글은Jeff Griffiths 의 The Browser Console 의 번역 및 편집본입니다. 웹콘솔은 Firefox 4에 처음 추가된 새로운 개발자 도구였고 릴리즈마다 향상시켜 왔습니다. Firefox 24가 베타에 들어갈 때, 우리는 웹콘솔의 중요 기능을 설명하고 새로운 브라우저 콘솔에 대해 소개할 좋은 기회라고 생각했습니다. 브라우저 콘솔은 오래동안 지속되어 온 에러 콘솔을 대체했습니다. 이것을 열기 위해서 Ctrl+Shift+J 키(OS X: Command+Shift+J)를 동시에 입력해야 […]
