이 글은 Dave Camp가 쓴 Mozilla Introduces the First Browser Built For Developers: Firefox Developer Edition의 한국어 번역본입니다.

웹이 이만큼 성공하기까지 개발자는 가장 중요한 역할을 해왔습니다. 그들이 만든 컨텐츠와 어플리케이션은 사람들이 컴퓨터나 모바일을 사용하여 웹에 매일 접속하게끔 만들었습니다.

파이어폭스 10주년을 기념하기 위하여 우리는 개발자들을 위하여 특별히 제작된 첫 브라우저인 파이어폭스 개발자 에디션을 발표하게 되어 정말 기쁘게 생각합니다.

10년 전, 우리는 얼리어답터들과 개발자들을 위하여 파이어폭스를 개발했습니다. 그들에게 더 많은 선택권과 더 폭넓게 조작해볼 수 있는 기능을 제공하기 위해서였습니다. 파이어폭스는 웹API와 확장 프로그램을 통합하여 사람들이 웹 밖에 있는 것들을 얻을 수 있도록 노력하였습니다. 이제 우리는 개발자들에게 보다 안전한 대피소같은 브라우저의 총 집합소를 제공하고자 합니다. 개발자들에게 가장 필요하고 적합한 기능들을 전면에, 한 가운데에 가져오고자 한 것이죠. 개발자를 위한 브라우저를 제공한다는 것은 개발자들이 매일마다 하는 일에 최적화된 맞춤형 브라우저 사용자 경험을 드린다는 것을 의미하는 것입니다.

파이어폭스는 독립적인 커뮤니티로 기존의 이익단체의 영향을 받지 않는 오픈소스입니다. 그렇기 때문에 파이어폭스는 플랫폼과 기기에 관계없이 웹에서 가능한 우리가 가진 도구들을 가지고 다른 브라우저들이 제공할 수 없는 기능들을 제공할 수 있습니다. 개발자에게 가장 어려운 점 중 하나가 있습니다. 바로 서로 다른 환경에 적합한 어플리케이션을 만들어 각각의 앱스토어에 등록하기 위하여 크게 쪼개져버린 개발 환경입니다. 이러한 이유로 개발자들은 종종 다른 플랫폼과 브라우저에 사이에 이리저리 분산되어버리곤 하죠. 결국 생산성이 저하되고 좌절을 경험하기도 합니다.

파이어폭스 개발자 에디션은 개발 워크플로우를 이어주는 중심점을 만들어 이 문제를 해결하였습니다. 지금 공개한 버젼은 안정화 단계의 개발자용 브라우저입니다. 기존에 인증된 강력한 도구들을 제공하면서 동시에 하루종일 웹서핑을 하기에도 충분히 강력합니다. 웹 환경에서 개발에 필요한 모든 것을 구축하기 위한 과정을 단순하게 만들어줄 수 있는 새로운 기능들을 추가하였습니다. 모바일이나 데스크탑 등의 많은 다른 플랫폼에 관계없이 어디서나 가능하게 말이죠.

여러분이 숙련된 개발자라면 이미 브라우저에 익숙한 도구들을 설치해두셨을거라 생각합니다. 그 도구들 덕분에 브라우저를 열자마자 원하는 컨텐츠나 어플리케이션을 개발하는데 집중할 수 있겠죠. 모바일 어플리케이션 디버깅을 하기 위해서는 추가적인 플러그인이나 프로그램을 설치할 필요도 없습니다. 혹시 웹 개발을 시작한지 얼마 되지 않으셨다면 통합된 워크플로우나 모든 필요한 것들이 이미 설치된 환경은 복잡한 어플리케이션을 만들기 더욱 쉽게 해줄 수 있습니다.

그래서 무슨 기능이 있을까요?

여러분이 알아야 할 첫번째 기능은 브라우저를 통해 어두운 버전의 디자인입니다. 개발자 도구 테마를 브라우저 전체에 적용하였습니다. 잘 정돈되어 있으며 여러분이 보는 화면에서 컨텐츠를 잘 보여주기 위하여 공간을 절약하는 측면에 집중하였습니다. 창의적인 어플리케이션 개발 환경에 시각적으로 어두운 것이 더 잘 맞기도 합니다.

Valence와 웹IDE 두 가지 강력한 기능을 통합하였습니다. 이 두가지 기능을 통해 워크플로우를 향상시켜줄 수 있으며 다른 브라우저 환경과 어플리케이션을 파이어폭스 개발자 에디션 내에서 직접 디버깅할 수도 있습니다.

Valence (파이어폭스 도구 어댑터라고 불렸던)를 가지고 여러분께서는 여러 브라우저와 기기 환경에 어플리케이션을 개발하고 디버깅할 수 있습니다. 파이어폭스 개발자 도구를 다른 주요 브라우저 엔진들에 연결을 시키는 것입니다. 파이어폭스 OS와 안드로이드용 파이어폭스 브라우저 디버깅을 위해 만들었던 멋진 도구들을 안드로이드용 크롬, iOS용 사파리 등 다른 주요 모바일 브라우저까지 적용가능하게 만들었습니다.

웹IDE를 통해서 웹앱을 브라우저 내 혹은 파이어폭스 OS 기기 내에서 직접 개발하고 디플로이하고 디버깅까지할 수 있습니다. 어떤 템플릿을 가지고 새로운 파이어폭스 OS 어플리케이션(그냥 웹앱입니다)을 만들 수도 있고 기존 어플리케이션 코드를 열어볼 수도 있습니다. 당연히 파일 편집도 가능하구요. 단 한번의 클릭으로 시뮬레이터에서 앱을 실행할 수 있습니다. 한번 더 클릭하면 개발자 도구로 디버깅도 가능합니다.

파이어폭스 개발자 에디션은 웹 개발자들에게 친숙한 다른 도구들도 함께 제공하고 있습니다:

• 반응형 디자인 모드 – 브라우저 창의 크기를 변환하지 않고서도 여러분의 웹사이트나 웹앱이 각기 다른 화면 사이즈에서 어떻게 보이는지 확인할 수 있습니다.
• 페이지 검사기– 모든 웹페이지의 HTML과 CSS를 분석하고 페이지의 구조나 배치를 쉽게 수정해볼 수 있습니다.
• 웹 콘솔 – 웹페이지에 연결된 모든 로그 정보를 볼 수 있으며 이를 통해 자바스크립트를 사용하여 콘솔창을 통해 상호작용이 가능합니다.
• 자바스크립트 디버거 – 자바스크립트 코드를 한 단계 더 깊게 분석하여 버그를 찾는데 도움이 될 수 있도록 상태 변경이 가능합니다.
• 네트워크 모니터 – 현재 브라우저에서 요청하는 모든 네트워크를 확인할 수 있고 각 요청이 얼마나 걸리는지, 어떤 요청이 오고가는지 세부 사항을 볼 수 있습니다.
• 스타일 에디터 – 웹페이지에 관계된 모든 CSS 스타일을 확인하고 수정해볼 수 있으며 새로운 스타일도 적용해보거나 다른 페이지에 참조된 CSS 스타일시트를 적용해볼 수도 있습니다.
• 웹 오디오 에디터 – 실시간으로 웹 오디오 API를 검사하여 실시간으로 테스트하여 모든 오디오가 여러분이 원하는 방식으로 연결된 것을 확인해볼 수 있습니다.

모든 기능을 한번 시도해보세요! 그리고 여러분의 생각을 알려주세요. 여러분의 피드백을 간절히 기다리고 있습니다.

더 많은 정보:

• 파이어폭스 개발자 에디션 다운로드
• 배포 기록