파이어폭스,
설마 그냥 쓰고 있는 건 아니겠죠?
이번 포스트에서는 제가 유용하게 사용하고 있는 파이어폭스 애드온(확장기능)을 소개하겠습니다.
Firebug
1) HTML Tag 쉽게 보기
2) CSS 쉽게 보기
3) DOM 쉽게 보기
1) 파이어폭스 탭에서 FTP 클라이언트 실행하기
요녀석, 별다른 기능은 없지만 FTP 별도로 설치하기 귀찮을 때,
간편하게 사용할 수 있습니다.
나름대로 계정 저장도 가능하며, 로그인 시 들어갈 초기 디렉토리도 설정할 수 있습니다.
그리고 디렉토리 싱크라는 유용한 기능이 있어서 로컬과 리모트 디렉토리 중
한 군데만 서브 디렉토리로 이동해도 다른 한 쪽도 동일하게 이동합니다.
파일을 엉뚱한데 올리는 실수를 방지해주는 것 같네요.
HTTPFox
1) HTTP 프로토콜 데이터 캐치하기
익스플로러에 HTTP Watch 라는 플러그인과 비슷한 녀석입니다.
아까 첫번째로 소개한 애드온인 Firebug에도 이와 비슷한 Net 기능이 있습니다.
사실 HTTPFox를 이용해서 뭔가 해본 적은 없고,
예전에 HTTP Watch를 써봤는데, 비슷한게 파이어폭스에도 있길래 반갑게(?) 설치해 보았습니다.
HTTP로 무슨 정보가 가고 오는 지 확인해서 대체 뭘 하느냐, 하면..
IE Tab
1) 파이어폭스에서 익스플로러 렌더링 엔진 사용하여 웹사이트 보기
아쉽게도 파이어폭스로 100% 제 기능을 구현하는 웹사이트가 우리나라에는 별로 없는 것 같습니다.
ActiveX 도배는 그렇다쳐도, 웹디자인 부터 IE dependent 하게 만들어져서 레이아웃이 깨지는 경우도 많고, 자바스크립트도 제대로 실행 안되는 것도 많습니다.
그렇다고 그 사이트들을 버릴 수는 없기에, 이 애드온을 사용합니다.
IE Tab은 우측하단 아이콘을 이용하여 렌더링 엔진을 전환해 줍니다.
또, IE로만 접속해야만 하는 특정 사이트(은행, 인트라넷 등..)는 설정에 넣어두기만 하면, 자동으로 해당 사이트를 접속하면 익스플로러 렌더링 엔진으로 보여집니다.
(사실.. 이래도 안 되는 사이트가 몇몇 있기는 합니다. 드물게.. -_-;)
이상으로 제가 사용하는 애드온 네가지를 적어보았는데,
이건 뭐 전부 웹개발자용이네요 -_-;;;
덧.
혹시 이 글을 보는 분 중에서도 괜찮은 애드온을 사용하고 계시다면 추천해주세요!
설마 그냥 쓰고 있는 건 아니겠죠?
이번 포스트에서는 제가 유용하게 사용하고 있는 파이어폭스 애드온(확장기능)을 소개하겠습니다.
Firebug
1) HTML Tag 쉽게 보기
2) CSS 쉽게 보기
3) DOM 쉽게 보기
첫번째로 제가 제일 사랑하는 F12 파이어버그 입니다.
웹디자인과 웹개발의 필수품!
주의할 점은 Mozilla 계열과 IE의 DOM 구조가 조금(?) 다르다는 겁니다.
한가지더, 몇가지 기능을 Disable, Enable 할 수 있게 되어있습니다. 일반 서핑 때는 속도저하를 일으킬 수 있으니 콘솔, 스크립트 디버거, Net 기능은 Disable 해두는 게 좋을 것 같네요.
FireFTP웹디자인과 웹개발의 필수품!
- 찾아야 하는 부분의 HTML Tag를 하단의 HTML 소스에서 직접 찾아도 되지만,
Inspect(검사) 기능으로 마우스로 화면을 선택하면 해당 소스 부분으로 바로 이동합니다. - HTML태그와 함께 그 부분에 적용된 CSS도 함께 볼 수 있습니다.
CSS는 원래 Style의 소스코드 형태로 볼 수도 있고, 계산된 형태로 볼 수 있습니다. - 자바스크립트를 제대로 하기 위해서 꼭 알아야 하는 HTML문서의 DOM도 볼 수 있습니다.
- 위의 HTML, CSS, DOM 데이터를 확인하다가 바로 수정할 수 있습니다.
문서를 실제 고치는 것은 아니고 바로 화면에 적용되는 것으로 수정 결과를 미리 확인할 수 있습니다. - 그 외 스크립트 디버거와 네트워크 모니터링도 가능합니다.
(스크립트 디버거는 써본 적이 없네요 -_-;;)
주의할 점은 Mozilla 계열과 IE의 DOM 구조가 조금(?) 다르다는 겁니다.
한가지더, 몇가지 기능을 Disable, Enable 할 수 있게 되어있습니다. 일반 서핑 때는 속도저하를 일으킬 수 있으니 콘솔, 스크립트 디버거, Net 기능은 Disable 해두는 게 좋을 것 같네요.
단축키 F12와 함께 브라우저 하단에 Firebug 창이 뜬다.
1) 파이어폭스 탭에서 FTP 클라이언트 실행하기
요녀석, 별다른 기능은 없지만 FTP 별도로 설치하기 귀찮을 때,
간편하게 사용할 수 있습니다.
나름대로 계정 저장도 가능하며, 로그인 시 들어갈 초기 디렉토리도 설정할 수 있습니다.
그리고 디렉토리 싱크라는 유용한 기능이 있어서 로컬과 리모트 디렉토리 중
한 군데만 서브 디렉토리로 이동해도 다른 한 쪽도 동일하게 이동합니다.
파일을 엉뚱한데 올리는 실수를 방지해주는 것 같네요.
도구모음에 넣어둔 해마모양의 FireFTP 아이콘을 클릭하면 바로 FTP 탭이 뜨도록 했다.
HTTPFox
1) HTTP 프로토콜 데이터 캐치하기
익스플로러에 HTTP Watch 라는 플러그인과 비슷한 녀석입니다.
아까 첫번째로 소개한 애드온인 Firebug에도 이와 비슷한 Net 기능이 있습니다.
사실 HTTPFox를 이용해서 뭔가 해본 적은 없고,
예전에 HTTP Watch를 써봤는데, 비슷한게 파이어폭스에도 있길래 반갑게(?) 설치해 보았습니다.
HTTP로 무슨 정보가 가고 오는 지 확인해서 대체 뭘 하느냐, 하면..
- 간단히 웹페이지의 트래픽 검사가 가능합니다. Recieved된 바이트 값을 더하면 나옵니다.
캐시된 값도 있으니 주의하세요. - 분리된 여러 웹사이트의 SSO(Single Sign On - 통합로그인) 시에 오고 가는 데이터를 확인할 때 좋습니다. 각각 다른 환경과 물리적으로 떨어진 사이트들의 SSO 구현 시에는 대부분 쿼리값과 쿠키를 이용하기 마련인데, 모니터링하기 좋습니다.
- 웹 해킹할 때 이용할 수 있습니다.
익스플로러 플러그인인 HTTP Watch와 비슷하다.
IE Tab
1) 파이어폭스에서 익스플로러 렌더링 엔진 사용하여 웹사이트 보기
아쉽게도 파이어폭스로 100% 제 기능을 구현하는 웹사이트가 우리나라에는 별로 없는 것 같습니다.
ActiveX 도배는 그렇다쳐도, 웹디자인 부터 IE dependent 하게 만들어져서 레이아웃이 깨지는 경우도 많고, 자바스크립트도 제대로 실행 안되는 것도 많습니다.
그렇다고 그 사이트들을 버릴 수는 없기에, 이 애드온을 사용합니다.
IE Tab은 우측하단 아이콘을 이용하여 렌더링 엔진을 전환해 줍니다.
또, IE로만 접속해야만 하는 특정 사이트(은행, 인트라넷 등..)는 설정에 넣어두기만 하면, 자동으로 해당 사이트를 접속하면 익스플로러 렌더링 엔진으로 보여집니다.
(사실.. 이래도 안 되는 사이트가 몇몇 있기는 합니다. 드물게.. -_-;)
별다른 화면은 없으므로, 캡쳐는 설정 화면으로 대신..
이상으로 제가 사용하는 애드온 네가지를 적어보았는데,
이건 뭐 전부 웹개발자용이네요 -_-;;;
덧.
혹시 이 글을 보는 분 중에서도 괜찮은 애드온을 사용하고 계시다면 추천해주세요!
'Computer' 카테고리의 다른 글
| 업무노트 (0) | 2009/04/07 |
|---|---|
| 개발자용 폰트 비교체험! (10) | 2009/03/09 |
| 구글 데스크톱 검색 (1) | 2008/10/08 |
| 파이어폭스의 꽃, 애드온 (0) | 2008/07/31 |
| 여러 버전의 익스플로러 사용하기 - Multiple IEs (0) | 2008/04/19 |
댓글을 달아 주세요