주요 문서
-
웹 컴포넌트의 능력
배경 DHTML 커서 추적 애니메이션과 “주간 사이트” 배지가 처음으로 웹을 우아하게 만든 이후로, 재사용 가능한 코드는 웹 개발자들을 유혹해왔습니다. 그때부터 제3자 UI를 웹사이트로 통합하는 것은 골치아픈 일이되었습니다. 다른 사람들의 똑똑한 코드를 사용하다보면 JavaScript 또는 !important를 포함하는 공포스러운 CSS 보일러플레이트와 충돌하게됩니다. React 세계나 다른 최신 프레임워크에서는 나은편이지만, 위젯을 재사용하기 위해 전체 프레임워크를 알아야한다는 오버헤드는 조금 과한 […]
-
UI 레이아웃을 위한 CSS 그리드
CSS 그리드는 긴 텍스트 구절을 포함하는 컨텐츠 기반 웹사이트를 위한 훌륭한 레이아웃 도구이며, 다양한 전통적인 UI 레이아웃에도 굉장한 가치가 있습니다. CSS 그리드를 사용해 사용자 인터렉션이나 변경되는 조건에 반응하고 적응하며, 스크롤이 항상 제대로 동작하도록 어플리케이션의 레이아웃을 향상시키는 방법을 보여드리겠습니다. CSS 그리드는 웹사이트 레이아웃을 구축합니다. CSS 그리드는 웹디자이너가 수년동안 사용해왔던 끝없는 float 꼼수 대신 작은 비트의 지원 […]
-
Firefox Debugger로 console.log를 뛰어 넘기
console.log 는 디버거는 아닙니다. JavaScript 앱이 무엇을 하고 있는지 표시하는 훌륭한 방법이지만 너무 적은 정보만 표시하는 한계가 있습니다. 코드가 복잡하면, 적합한 디버거가 필요하게 됩니다. 그것이 Firefox 개발자도구 놀이터(playground)(디버깅에 대한 모든 것)에 새로운 세션을 포함한 이유입니다. 간단한 JavaScript 할일 앱을 검사하고 고치기 위해 Firefox 디버거를 사용하는 4개의 강의를 마련했습니다. 디버거 놀이터 강의들은 완전히 무료이고 할일앱 코드는 […]
-
debugger.html 를 소개합니다
debugger.html 은 Mozilla 가 만든 새로운 JavaScript 디버거입니다. debugger.html 은 React 와 Redux 로 만든 웹 어플리케이션입니다. 이 프로젝트는 올해 초 Firefox Developer Tools 의 디버거를 교체하기 위해 시작됐습니다. 우리가 원한 것은 다양한 타겟(multiple targets)을 디버깅할 수 있고, 또 독립(standalone) 모드로도 동작할 수 있는 디버거였습니다. 현재, debugger.html 은 Firefox 타겟에 접속해서 디버깅할 수 있습니다. 뿐만아니라 […]
-
node-firefox를 소개합니다
NOTE: 우리는 이 프로젝트를 지난 일요일 FOSDEM에서 발표했습니다. 하지만 모든 사람이 브뤼셀(Brussels)에 있었던 것은 아니기 때문에 node-firefox가 무엇이고 어떻게 Firefox OS 앱 개발의 모든 것!을 도울 수 있는지 설명하기 위해 이 글을 작성합니다. 모질라는 항상 개발자들의 삶을 편하게 할 수 있는 방법을 찾고 있습니다. 앱 개발을 희망하는 사람들이 Open Web Apps 개발 시작 절차가 다소 […]
-
모질라가 만든 개발자를 위한 첫 브라우저: 파이어폭스 개발자 에디션
이 글은 Dave Camp가 쓴 Mozilla Introduces the First Browser Built For Developers: Firefox Developer Edition의 한국어 번역본입니다. 웹이 이만큼 성공하기까지 개발자는 가장 중요한 역할을 해왔습니다. 그들이 만든 컨텐츠와 어플리케이션은 사람들이 컴퓨터나 모바일을 사용하여 웹에 매일 접속하게끔 만들었습니다. 파이어폭스 10주년을 기념하기 위하여 우리는 개발자들을 위하여 특별히 제작된 첫 브라우저인 파이어폭스 개발자 에디션을 발표하게 되어 정말 […]
-
하이브리드 앱 개발자들이 기다려온 SDK
이 글은 Adam Bradley와 Robert Nyman [Editor]이 쓴 The Missing SDK For Hybrid App Development의 한국어 번역본입니다. 하이브리드 vs. 네이티브: 이 논쟁은 이미 오래됐고, 앞으로도 계속될 것입니다. 각각의 앱 개발 방식은 나름의 장단점이 있습니다. 그래서 두 방식의 차이를 평면적으로 비교하는 것은 사과와 오렌지를 비교하는 것처럼 의미 없는 일입니다. 많은 하이브리드 앱 개발자들이 자신이 네이티브 앱 […]
-
웹IDE, 저장소 검사기, jQuery 이벤트, iframe 스위처 + 기타 – Firefox 개발자 도구 에피소드 34
이 글은 Heather Arthur와 Robert Nyman [Editor]이 쓴 WebIDE, Storage inspector, jQuery events, iframe switcher + more – Firefox Developer Tools Episode 34의 한국어 번역본입니다. Firefox 개발자 도구의 새로운 기능들이 이제 막 Aurora 채널에 반영됐습니다. 지금 당장 새로운 기능들을 써보고 싶다면 Aurora 버전을 써보세요. 이 새로운 기능들은 11월에 릴리즈되는 Firefox 34 버전에 포함될 것입니다. Firefox […]
-
툴박스, 인스펙터 & 스크래치패드의 개선점 – 파이어폭스 개발도구 에피소드 32
이 글은 Brian Grinstead와 Robert Nyman [Editor]이 쓴 Toolbox, Inspector & Scratchpad improvements – Firefox Developer Tools Episode 32의 한국어 번역본입니다. 파이어폭스 32가 방금 오로라 릴리즈 채널에 올려졌습니다. 이와 관련하여 이번 릴리즈에서 가장 중요한 내용인 개발도구의 변경 내역에 대해 살펴봅시다. 먼저, 이번 릴리즈를 위해 DevTools 패치에 참여한 41명의 기여자 분들께 감사 드립니다! 여기에 파이어폭스 32에서 […]
-
WebIDE 기능 탑재 개시
Mozilla Hacks 블로그의 개발자 도구에 관한 기사를 읽고 계신 분은 아시겠지만, 개발자 도구는 앱과 웹 사이트의 행동을 조사하기 위한 도구만은 아닙니다. 개발 도구는 더육 진화하고 웹 브라우저에 다양한 소스 편집 기능이 추가되었습니다. 많은 도구나 템플릿이 여기 웹 사이트에 공개돼 앱을 작성하기 위해 무엇을 해야 할지 잘 모른다는 여론을 많습니다. Firefox에 내장하게될 WebIDE은 이런 문제를 해결합니다. […]
