AI로 구글 확장 프로그램(extension) 만들기 - 뉴스 스크랩을 도와주는 '캠페인즈 웹 스크래퍼'

제가 활동하고 있는 캠페인즈에서는 '뉴스'탭에서 서로 뉴스를 공유하고, 읽고, 의견을 나눌 수 있습니다. 평소 인터넷 뉴스 덧글의 흉포함에 지친 분들이 안전하게 자신의 의견을 나눌 수 있는 곳이며, 뿐만 아니라 각자 다른 사람에게 공유하고 싶은 뉴스를 가져오기 때문에 좋은 뉴스가 정말 많이 올라옵니다. 저 역시 가끔 캠페인즈에 들어와 뉴스를 보고, 직접 뉴스도 공유하는데요.

그렇게 뉴스를 캠페인즈에 업로드하던 어느 날, 이런 생각이 들었습니다. '이전에 소개했던 Notion web clipper처럼, 캠페인즈 뉴스도 사람들이 쉽게 공유하면 더 많은 뉴스가 캠페인즈에 올라올 수 있지 않을까?' 이미 좋은 공간인데, 사람들이 너도나도 아무 뉴스나 보다가 딸깍 쉽게 공유하면 더 좋겠다는 생각이 들어, 개발자가 아님에도 직접 한 번 '캠페인즈 웹 스크래퍼'를 만들게 되었습니다. 활용하실 경우, 꼭 글을 끝까지 읽고 사용해주세요!

1. 무엇을 자동화할 수 있을지 먼저 고민하기

지금까지 캠페인즈 뉴스를 추가하려면,
1) 공유하고 싶은 뉴스를 발견 -> 2) 캠페인즈 내에 들어와서 -> 3) 뉴스 탭에 들어온 다음 -> '추가'버튼을 누르고 뜨는 팝업에서 -> 4) 이슈,토픽,URL,코멘트(선택)를 입력한 다음 -> 5) '뉴스 공유하기'버튼을 눌러야 했습니다. 이렇게 단계를 나누고 천천히 분석해보니, 제가 자동화 할 수 있다고 처음 판단한 영역은 다음과 같았습니다.

-2)와 3)에 해당하는 과정 - '추가'버튼을 누르면 나오는 화면이 나오게 하기
-4)번 과정 중, 먼저 할 수 있는 자동으로 지금 보고 있는 뉴스 기사 링크를 URL칸에 들어가게 하기

2. 일단 AI에게 물어보기

이 개요를 토대로, ChatGPT4o로 코드를 짜기로 결심했습니다. ChatGPT에는 앱스토어와 같은 'GPTs(GPT 탐색)'이 가능했고, 그 중 크롬 확장 프로그램 제작을 도와주는 'Chrome Extension Full-Auto Coder' 라는 GPTs를 찾아서 제가 필요한 걸 찾아 정리해 넣었습니다.

그리고 따라서 하다 보니 크롬 확장 프로그램에 필요한 로고 파일이 있다는 것도 발견하고, 이것도 ChatGPT로 만들어서 파일로 준비해 두었습니다.

중간 과정은 생략했지만, 약 1시간에 걸쳐 크롬 확장 프로그램을 만들었고, 제 크롬과 웨일에서 사용 가능하게 업로드할 수 있었습니다. 하지만 많은 사람들과 이 기능을 쉽게 공유하려면, Chrome 웹 스토어에 등록해야 합니다. 이 역시 질문하고, 개인 정보 처리 방침 등은 전부 ChatGPT에게 물어보며, 개발자 등록과 크롬 확장 프로그램을 웹스토어 등록하는 것까지 마칠 수 있었습니다. 근데 이 과정을 많이 헤매서.. 여기에서만 2시간이 추가로 소요됐네요 ㅎㅎ..

3. 아쉬운 점을 개선하면 완료!

사용해보니, 뉴스 공유를 완료하고 나서도 캠페인즈 뉴스 탭이 사라지지 않는 게 좀 불편하더라구요. 그래서 뉴스 공유하기를 누르고 나면 창이 자동으로 꺼지도록 하는 기능까지 GPTs에게 물어보고, 답을 받아 고쳤습니다..! 사용 장면을 간단히 보여드리며 사용 방법을 알려드릴게요. 천천히 따라하시면 어렵지 않을 거에요.

1. chrome웹 스토어(크롬 / 웨일 / Edge 사용 가능)에 들어가서 '캠페인즈 웹 스크래퍼'를 검색하시거나, 이 링크를 눌러 페이지로 직접 들어가기
2. 오른쪽 상단의 'Chrome에 추가하기'버튼 누르기
3. 우측 상단 퍼즐 모양을 누른 다음, 확장 프로그램 옆에 핀셋 눌러 인터넷 창에 고정시키기
4. 기본적으로 캠페인즈에 로그인이 되어 있을 때 사용이 가능하며, 이제 뉴스 페이지에서 해당 버튼을 누르시면, 팝업으로 캠페인즈 뉴스 추가 창이 뜨고, 동시에 자동으로 현재 보고 있는 뉴스 사이트의 링크가 URL칸에 입력됩니다.
5. 나머지 내용을 채우고 '공유하기'를 누르시면, 자동으로 팝업이 닫힙니다.

더 많은 뉴스가 캠페인즈에 공유되어, 서로 더 좋은 정보를 공유할 수 있게 되어 더 좋은 사회가 만들어지길 바랍니다..! 많은 분들의 활용 부탁드립니다!

저 역시 이 확장프로그램을 개발하며 자신감도 얻고, 보람차기도 했던 좋은 경험을 할 수 있어 좋았습니다 ㅎㅎ 여러분들도 해보고 싶은 일이 있으면 언제든지 도전하세요!

*필독 : '캠페인즈 웹 스크래퍼'는 캠페인즈의 공식 기능이 아닙니다. 따라서 얘기치 못한 버그가 발생할 수 있으며, 캠페인즈 웹 구조가 바뀔 시 작동하지 않을 수 있음을 알려드립니다(그렇다고 해킹이나 바이러스 같은 게 있지는 않습니다..그런 건 등록이 안됩니다).

p.s. 모바일에서 활용하시려면 '키위 브라우저'라는 걸 찾아 설치하셔야 한다고 합니다..!