본문 바로가기

전체 글5

웹 브라우저에서의 'window' 객체 - 크롬확장프로그램에서의 주의 사항 웹 브라우저에서 `window` 객체는 JavaScript의 궁극적인 객체로, 다양한 기능들을 제공합니다. `window` 객체는 브라우저의 탭이나 창을 대표하며, 웹 페이지의 전역 범위(Global Scope)를 나타냅니다. 이로 인해, 모든 전역 JavaScript 객체, 함수, 변수들은 자동적으로 `window` 객체의 구성원이 됩니다. `window` 객체에는 웹 페이지의 컨텐츠와 관련된 수많은 속성 및 메서드가 포함되어 있습니다. 예컨대, `document` 객체에 접근할 수 있어 웹 페이지의 DOM 요소를 조작하는 것이 가능합니다. 또한, 타이머를 설정하거나 새로운 브라우저 창을 열거나, 현재 창의 위치나 크기 등을 조절하는 작업들 역시 가능합니다. 크롬 확장프로그램에서의 주의 사항 [백그라운.. 2023. 6. 24.
크롬 익스텐션의 작동 구조와 통신 과정 크롬 익스텐션은 웹 브라우저를 더욱 강력하고 편리하게 만드는 훌륭한 도구입니다. 이번 글에서는 크롬 익스텐션의 핵심 요소들이 어떤 방식으로 서로 작동하고 통신하는지 살펴보겠습니다. 1. 크롬 익스텐션의 핵심 요소들 크롬 익스텐션의 주요 요소는 아래와 같습니다: - 익스텐션 아이콘 - 팝업 - 컨텍스트 메뉴 - 백그라운드 스크립트 - 컨텐트 스크립트 **익스텐션 아이콘과 팝업** 익스텐션 아이콘은 사용자에게 익스텐션의 존재를 알리는 핵심 요소입니다. 아이콘을 클릭하면 나타나는 팝업에서는 익스텐션의 주요 기능을 실행할 수 있습니다. 이러한 인터페이스를 정의하기 위해 manifest.json 파일에서 "browser_action" 필드를 사용합니다. 이 필드에서 익스텐션 아이콘의 이미지 파일 경로와 팝업으로 .. 2023. 6. 24.
HTML 기초 - 초간단 버전 HTML 페이지의 기본 구조 HTML을 처음 접하는 분들을 위해 웹 페이지의 기본 구조를 쉽게 설명해보려고 합니다. 아래 정도만 알아도 웹개발 하시는 분들은 HTML을 몰라서 생기는 문제는 거의 없을 실 거예요. 웹 페이지는 다음과 같이 이루어져 있습니다. 이것은 헤더입니다. Home About Contact 섹션 제목 이것은 섹션의 본문입니다. 이것은 푸터입니다. 여기에서 각 요소들의 역할은 다음과 같습니다: : 문서 유형을 나타냅니다. 여기에서는 HTML5를 사용하고 있음을 나타냅니다. : HTML 문서의 루트(root) 요소입니다. : 메타 정보의 컨테이너로 사용되며, , 3. ``: 이 태그는 웹 페이지에 대한 메타데이터를 제공합니다. 이 정보는 브라우저(페이지 표시 방법), 검색 엔진(키워드),.. 2023. 6. 24.
웹훅(Webhook) 웹훅의 개념 웹훅(Webhook)이란 한 시스템에서 다른 시스템으로 실시간 정보를 전송하는 방법이다. 웹훅을 통해 하나의 서비스가 특정 이벤트(예: 새로운 사용자 등록, 데이터베이스에 행 추가 등)가 발생했을 때 다른 서비스에 즉시 알릴 수 있다. 웹훅은 '역방향 API' 또는 'HTTP(S) 콜백'으로도 알려져 있다. 웹훅은 일반적으로 HTTP POST 요청 형태로 데이터를 보낸다. 이 요청은 일반적으로 JSON 또는 XML 형식으로 이벤트 데이터를 포함하고 있다. 웹훅을 사용하면 한 서비스가 다른 서비스의 API를 주기적으로 폴링(polling, 즉 주기적으로 데이터를 요청하는 것) 할 필요가 없어진다. 대신 웹훅은 필요한 데이터를 실시간으로 제공하여 더 효율적이고 반응성이 좋은 시스템을 만들 수 있.. 2023. 6. 22.