---
url: https://docs.ogmabox.com/ko/plugins/quickstart.md
description: 최소한의 백엔드 예제와 선택적 프런트엔드 패널로 첫 Ogma 플러그인을 몇 분 만에 만들고 설치합니다.
---

# 플러그인 빠른 시작 {#plugin-quickstart}

이 가이드는 빈 폴더에서 시작해 플러그인을 빠르게 실행하는 과정을 안내합니다.

## 1) 최소한의 백엔드 전용 플러그인 만들기 {#\_1-create-a-minimal-backend-only-plugin}

다음 파일을 담은 폴더를 만듭니다.

```text
my-plugin/
  manifest.json
  backend/
    script.js
```

`manifest.json`:

```json
{
  "id": "my-plugin",
  "name": "My Plugin",
  "version": "0.1.0",
  "plugins": [
    {
      "kind": "backend",
      "id": "my-plugin-backend",
      "entrypoint": "backend/script.js"
    }
  ]
}
```

`backend/script.js`:

```js
async function init(sdk) {
  sdk.console.log("Plugin started");

  sdk.events.onInterceptResponse(function(req, res) {
    if (!res) return;
    if (res.getCode() === 403) {
      sdk.console.warn("403 on " + req.getUrl());
    }
  });
}
```

**플러그인 > 설치**에서 폴더를 선택하고 플러그인을 활성화한 다음, 로그에 `Plugin started`가 표시되는지 확인합니다.

## 2) TypeScript를 사용하는 경우 {#\_2-if-you-are-using-typescript}

다음 구조를 사용합니다.

```text
my-plugin/
  manifest.json
  backend/
    src/index.ts
```

다음 명령으로 번들링합니다.

```bash
pnpm add -D @ogmabox/ogma-sdk esbuild typescript
pnpm exec esbuild backend/src/index.ts \
  --bundle \
  --platform=neutral \
  --format=iife \
  --external:@ogma/sdk --external:@ogmabox/ogma-sdk \
  --outfile=backend/script.js
```

그런 다음 위와 같이 폴더를 설치합니다.

## 3) 나중에 프런트엔드 추가하기 {#\_3-add-a-frontend-later}

패널이 필요할 때만 프런트엔드 항목과 UI 파일을 추가합니다.

```text
my-plugin/
  frontend/
    script.js
    style.css   # optional
```

그런 다음 `manifest.json`에 다음 항목을 추가합니다.

```json
{
  "kind": "frontend",
  "id": "my-plugin-frontend",
  "entrypoint": "frontend/script.js",
  "backend": { "id": "my-plugin-backend" }
}
```

프런트엔드 통신에는 `window.ogmaSDK.ready(...)`를 사용하고, 백엔드 호출은 `sdk.api` 핸들러에서 처리합니다.

## 4) 일반적으로 필요한 권한 {#\_4-permissions-you-almost-always-need}

위 백엔드 예제의 경우:

* 없음(안전한 기본 권한은 자동으로 부여됨)

플러그인이 외부로 요청을 보내는 경우 다음을 추가합니다.

```json
"permissions": ["send_requests"]
```

플러그인이 발견 사항을 작성하는 경우 다음을 추가합니다.

```json
"permissions": ["write_findings"]
```

실제로 사용하는 권한만 요청하세요.

## 첫 플러그인 문제 해결 {#troubleshooting-first-plugin}

* `Plugin failed to initialize` → **로그**를 열고 `init(sdk)`가 정의되어 있는지 확인합니다.
* `Invalid manifest` → JSON의 쉼표와 따옴표를 확인합니다.
* 콜백이 실행되지 않음 → 플러그인이 활성화되어 있고 해당 이벤트(`onInterceptResponse`)가 등록되어 있는지 확인합니다.

전체 API 참조:

* [플러그인 시스템](./README)
* [백엔드 SDK](/ko/plugins/backend-sdk)
* [프런트엔드 SDK](/ko/plugins/frontend-sdk)