크롬익스텐션3 2.2 크롬 익스텐션 만들어 보기 Part I - 웹 페이지 삽입 스크립트 이전 포스팅에서 브라우저 익스텐션(크롬 기준)의 기본적인 구성 파일들을 살펴보고 간단한 익스텐션도 만들어 보았다. 그리고 코딩한 익스텐션을 웹 브라우저에 설치하는 방법도 살펴보았다. 2024.01.30 - [웹 프로그래밍 고급 주제들] - 2.1 크롬 익스텐션 만들어 보기 Part I - Hello, extension! 2.1 크롬 익스텐션 만들어 보기 Part I - Hello, extension! 글을 쓰고 있는 나는 개발자이기 때문에 일단 만드는 것에 관심이 많다. 먼저 간단한 익스텐션들을 몇 개 만들어 보고 익스텐션의 구조를 살펴보면 코드와 개념이 서로 더 잘 연결될 것 같다. 익 youngbyte.tistory.com 브라우저 익스텐션은 크게 4가지 요소들로 구성된다. - 익스텐션 UI: 익스텐.. 2024. 2. 2. 2.1 크롬 익스텐션 만들어 보기 Part I - 기본 구조 글을 쓰고 있는 나는 개발자이기 때문에 일단 만드는 것에 관심이 많다. 먼저 간단한 익스텐션들을 몇 개 만들어 보고 익스텐션의 구조를 살펴보면 코드와 개념이 서로 더 잘 연결될 것 같다. 익스텐션은 크게 아래와 같이 네 부분들로 구성된다. ⓐ 익스텐션 UI 익스텐션 UI는 익스텐션의 메뉴와 같다. 익스텐션의 기능을 선택하고 현재 상태를 보여줄 수도 있다. 익스텐션의 자체 메뉴를 구성하는 UI를 popup 스크립트라고 부르기도 한다. ⓑ 웹 페이지 삽입 스크립트 익스텐션은 기본적으로 웹 페이지 위에서 동작하는 애드온(add-on)이다. 따라서 특정 웹 페이지에 기능을 추가하기 위한 스크립트가 존재한다. 페이지에 삽입되는 이 스크립트를 보통 content 스크립트라고 부르기도 한다. ⓒ 백그라운드(backg.. 2024. 1. 30. 1. 프롤로그 - 크롬 익스텐션 개발, 할 만 한가? 지난 해(2023) 크롬 익스텐션을 개발할 기회가 있었다. 웹 서비스 개발자인 내게 조금은 생소한 프로젝트였지만 많은 것들을 배우고 생각해 볼 계기가 되었다. 다시 일이 바빠지면 포스팅을 자주 할 수 없을지도 모르겠다.하지만 아래와 같은 순서로 그 간의 경험을 정리해 볼 계획이다. 1. 프롤로그 - 브라우저 익스텐션은 무엇인가?(크롬 익스텐션 개발, 할 만 한가?) 2. 크롬 익스텐션 만들어 보기 - Part I 3. 브라우저 익스텐션의 구조와 동작 4. 크롬 익스텐션 만들어 보기 - Part II 5. PWA(Progressive Web App) 6. 앞으로의 브라우징 환경 이번 포스팅에서는 브라우저 익스텐션에 대해 전체적으로 한 번 정리해보고자 한다. 미국 상황이지만 크롬(Chrome) 웹 브라우저의.. 2024. 1. 22. 이전 1 다음
