오픈소스마케팅

어사이드(Aside)를 아시나요? 클로드 코드·코덱스에 CLI로 연결해 쓰는 AI 브라우저

어사이드(Aside)를 아시나요? 클로드 코드·코덱스에 CLI로 연결해 쓰는 AI 브라우저

어사이드(Aside)라는 도구를 아시나요? 한국인 창업자 세 명이 만든 AI 브라우저입니다. 브라우저 안에서 AI에게 웹 작업을 맡기는 도구인데, CLI도 함께 제공합니다. CLI는 터미널에 명령어 한 줄을 입력해 프로그램을 실행하는 방식입니다. 그래서 클로드 코드(Claude Code)나 코덱스(Codex)처럼 터미널에서 쓰는 AI 코딩 도구에 어사이드를 연결해 쓸 수 있습니다.

AI 코딩 도구와 일하다 보면 화면을 직접 봐야 하는 일과 그렇지 않은 일이 섞여 있습니다. 이 글에서는 어사이드가 어떤 도구인지 간단히 살펴보고, AI 코딩 도구에 CLI로 연결해 화면을 봐야 하는 일만 맡기는 방법을 정리해 보려고 합니다.

어사이드는 어떤 브라우저인가요?

어사이드(Aside) 공식 홈페이지 메인 화면

어사이드에서는 AI가 브라우저 안에서 검색하고, 클릭하고, 입력하며 여러 단계의 웹 작업을 직접 처리합니다. 이때 AI가 일하는 곳은 평소 내가 로그인해 둔 브라우저입니다. 처음 설치할 때 크롬의 방문 기록과 쿠키를 가져오기 때문에, 광고 관리자나 사내 관리 화면처럼 로그인해야 들어갈 수 있는 곳에서도 별도의 연동 없이 일을 시킬 수 있습니다.

그 밖에 알아 두면 좋은 특징은 다음과 같습니다.

  • AI 구독 연결: 이미 쓰고 있는 클로드(Pro/Max), ChatGPT(Plus/Pro), GitHub Copilot 구독을 로그인만으로 연결할 수 있습니다. 연결하지 않으면 어사이드에 포함된 모델을 쓰고, 이때는 어사이드의 크레딧이 차감됩니다.
  • 비밀번호 관리: 어사이드에 내장된 비밀번호 관리자가 로그인 화면에서 비밀번호를 자동으로 채워 줍니다. 이때 비밀번호 값은 AI에게 보이지 않습니다.

내 계정으로 로그인한 상태에서 AI가 화면을 보며 일한다는 점이 어사이드의 핵심이라고 할 수 있습니다. 다만 클로드 코드나 코덱스에도 브라우저를 다루는 기능이 이미 있습니다.

AI 코딩 도구에도 화면을 보는 기능이 있지 않나요?

네, 있습니다. 대표적인 것이 Playwright와 Claude in Chrome입니다.

  • Playwright MCP: 브라우저 자동화 도구인 Playwright를 AI 코딩 도구에 MCP로 연결한 것입니다. 클로드 코드와 코덱스 모두에서 쓸 수 있고, 연결하면 AI가 브라우저 창을 띄워 페이지를 확인하고 클릭합니다. 평소 로그인 상태를 쓰려면 크롬에 Playwright 확장 프로그램을 추가로 설치합니다.
  • Claude in Chrome: 크롬에 설치하는 확장 프로그램입니다. 클로드 코드와 연결하면 AI가 내가 쓰는 크롬에서 탭을 열고 페이지를 확인합니다.

둘 다 웹사이트가 실제로 어떻게 보이는지 확인하거나, 로그인해야 볼 수 있는 화면에서 무언가를 가져올 때 유용한 도구입니다.

여기서 MCP나 확장 프로그램으로 연결한다는 것은, AI가 대화할 때마다 꺼내 쓸 수 있는 도구 목록에 브라우저가 늘 올라가 있다는 뜻입니다. 그래서 아쉬운 점이 하나 생깁니다. API로 금방 볼 수 있는 데이터도 브라우저부터 열어서 확인하려고 한다는 것입니다. 저는 광고 성과처럼 API로 바로 가져올 수 있는 데이터를 요청할 때마다 이 문제를 겪었는데, API로 확인해 달라고 말해도 좀처럼 고쳐지지 않았습니다. 브라우저 도구가 연결되어 있으면 AI가 그 도구를 먼저 꺼내 드는 것 같습니다.

API로 바로 조회할 수 있는 광고 성과 요청에도 AI가 브라우저를 열고 로그인부터 시도하는 모습

필요할 때마다 연결을 켰다 껐다 할 수도 있지만, 매번 하기에는 번거롭습니다. 그렇다면 어사이드를 CLI로 연결하면 무엇이 다를까요?

어사이드 CLI: 필요할 때만 부르는 브라우저

CLI는 명령어를 실행할 때만 쓰입니다. 어사이드 CLI를 설치하면 아래처럼 따옴표 안에 할 일을 적어 어사이드에게 웹 작업을 맡길 수 있습니다.

aside "랜딩 페이지가 모바일에서 잘 보이는지 확인해 줘"

이 명령어를 실행하면 어사이드의 AI가 브라우저를 열어 작업을 시작합니다. 클로드 코드나 코덱스는 화면이 필요한 순간에 이 명령어를 실행하고, 페이지를 열고 확인하는 일은 어사이드에 맡기는 식입니다. 광고 성과 조회는 API로, 랜딩 페이지 확인은 어사이드로 나누는 것이죠.

이렇게 연결하면 좋은 점은 다음과 같습니다.

  • 필요할 때만 호출: 브라우저가 도구 목록에 늘 올라가 있지 않으니, API로 볼 일과 화면으로 볼 일을 나누기가 조금 쉬워질 것이라고 생각합니다.
  • 내 브라우저에서 확인: AI 코딩 도구가 쓰는 탭은 어사이드 사이드바의 [Agent Tabs]에 따로 모여 보입니다. AI가 무엇을 하는지 지켜보다가, 탭을 눌러 직접 이어서 할 수도 있습니다.
  • 로그인 상태 유지: 앞에서 살펴본 로그인 상태와 비밀번호 관리자를 터미널에서 부를 때도 그대로 씁니다.

터미널에서 aside 명령어로 랜딩 페이지 확인을 맡기면 어사이드 Agent Tabs에서 작업이 진행되는 모습

다만 한계도 있습니다. 어사이드를 스킬로 설치하면 AI가 스스로 판단해서 어사이드를 부를 수도 있습니다. 그래서 연결할 때 어떤 순서로 쓸지 정해 두는 편이 안전해 보입니다. 그럼 어사이드를 AI 코딩 도구에 연결하려면 무엇이 필요할까요?

어사이드 CLI 연결하는 법

어사이드 첫 실행 시 나타나는 Welcome to Aside 화면

연결에는 다섯 단계가 필요합니다. 1~3단계는 어사이드를 준비하는 단계이고, 4~5단계가 AI 코딩 도구와 연결하는 단계입니다.

1단계: 어사이드 설치하고 로그인 상태 가져오기

어사이드를 내려받아 설치합니다. 맥은 macOS 15 이상이 필요하고, 윈도우도 지원합니다. 처음 실행하면 계정을 만든 뒤 크롬의 데이터를 가져오는 단계가 나오는데, 이 단계는 건너뛰지 않는 것이 좋습니다. 쿠키를 가져와야 로그인된 상태로 일을 시킬 수 있거든요.

어사이드 다운로드

2단계: AI 모델 연결하기

어사이드의 설정 > Models > Providers 메뉴에서 [Connect]를 누르고, Subscription 항목에서 쓰고 있는 구독을 고릅니다. 뜨는 창에서 로그인하면 연결이 끝납니다. 연결하지 않고 어사이드에 포함된 모델을 쓰면 무료 플랜 기준(2026년 10월 기준) 월 500 크레딧 안에서 쓸 수 있는데, 크레딧이 생각보다 빨리 줄어든다는 사용 후기가 있으니 참고하시기 바랍니다.

3단계: CLI 설치하기

어사이드의 설정 > Developers 메뉴에서 [Install Aside CLI] 버튼을 누릅니다. 업데이트와 재설치도 이 메뉴에서 할 수 있습니다. 터미널에서 명령어로 설치하는 방법은 아래 공식 안내에 있습니다.

어사이드 공식 도움말: CLI, MCP, REPL 사용하기

4단계: AI 코딩 도구에 어사이드 스킬 설치하기

AI 코딩 도구가 어사이드를 언제, 어떻게 부르는지 알게 하려면 어사이드 스킬을 설치합니다. 스킬은 AI 코딩 도구에게 특정 도구의 사용법을 알려 주는 설명서 같은 것입니다. 터미널에서 아래 명령어를 실행하면, 이 컴퓨터에 설치된 AI 코딩 도구(클로드 코드, 코덱스, 커서, 오픈코드)를 찾아 모두에 스킬을 설치합니다.

aside skills install

한 도구에만 설치하고 싶다면 설정 > Developers 메뉴의 [Add skill to…] 버튼을 누르고 원하는 도구를 고르면 됩니다. 터미널에서는 aside skills install --target claude-code처럼 도구를 지정할 수도 있고, 지정할 수 있는 값은 codex, claude-code, cursor, opencode입니다. 어사이드를 MCP로 연결하는 방법도 있지만, 그러면 어사이드도 도구 목록에 늘 올라가 있는 브라우저가 되므로 앞에서 말한 아쉬움이 그대로 남을 수 있습니다.

5단계: “API 먼저, 화면은 어사이드” 순서 정해 두기

마지막으로 AI에게 브라우저를 언제 쓸지 정해 줍니다. 대화 중에 한 말은 그 대화가 끝나면 사라지지만, 규칙 파일에 적은 내용은 새 대화를 시작할 때마다 AI가 먼저 읽습니다. 클로드 코드는 작업 폴더의 CLAUDE.md 파일에, 코덱스는 AGENTS.md 파일에 아래와 같은 규칙을 적어 둡니다.

  • API로 확인할 수 있는 데이터는 API로 먼저 확인한다.
  • 화면을 직접 봐야 할 때만 어사이드로 확인한다.
  • 결제, 발송, 삭제처럼 되돌릴 수 없는 일은 승인을 받고 진행한다.

세 번째 규칙은 어사이드가 내 계정으로 로그인한 상태에서 일하기 때문에 넣어 두는 것이 좋습니다.

CLAUDE.md에 API 먼저, 화면은 어사이드 순서로 브라우저 사용 규칙을 적어 둔 예시

마치며

어사이드는 아직 다듬어지는 중인 도구입니다. 그래도 CLI로 연결해 두면, 이미 쓰고 있는 AI 코딩 도구는 그대로 두고 랜딩 페이지 확인처럼 화면이 필요한 일만 따로 맡길 수 있습니다. 어떤 일에 화면이 필요하고 어떤 일은 API로 충분한지, 그 순서만 먼저 정해 둔다면요.

AI 코딩 도구로 웹 작업을 하시는 분들께 이 글이 조금이나마 도움이 되기를 바랍니다.

작성자

이연정

어사이드(Aside)를 아시나요? 클로드 코드·코덱스에 CLI로 연결해 쓰는 AI 브라우저
이전 글

AX 컨설팅 케이스 스터디 - 매주 월요일 엑셀에 숫자 옮기는 일, 꼭 사람이 해야 할까?

상담 요청하기

문의 남기기

오픈소스마케팅의 컨설팅이 필요하시다면 문의를 남겨주세요.

[email protected]