{
    "manifest_version": 3,
    "name": "My First Extension",
    "version": "1.0",
    "description": "클릭하면 인사를 건네는 팝업 프로그램",
    "action": {
      "default_popup": "popup.html"
    },
    "permissions": ["activeTab"]
  }

<!DOCTYPE html>
  <html lang="ko">
  <head>
    <meta charset="UTF-8">
    <style>
      body { width: 200px; padding: 10px; font-family: sans-serif; text-align: center; }
      button { background: #4ecb99; color: white; border: none; padding: 8px 12px; border-radius: 4px; cursor: pointer; }
    </style>
  </head>
  <body>
    <h3>Hello Extension!</h3>
    <button id="btn">클릭해봐</button>
    <script src="popup.js"></script>
  </body>
  </html>

document.getElementById('btn').addEventListener('click', () => {
    alert('반갑습니다! 확장 프로그램이 정상 작동 중입니다.');
  });

mkdir chrome-extension-test
cd chrome-extension-test

cat <<EOF > manifest.json
{
  "manifest_version": 3,
  "name": "My First Extension",
  "version": "1.0",
  "description": "클릭하면 인사를 건네는 팝업 프로그램",
  "action": {
    "default_popup": "popup.html"
  },
  "permissions": ["activeTab"]
}
EOF

cat <<EOF > popup.html
<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <style>
    body { width: 200px; padding: 10px; font-family: sans-serif; text-align: center; }
    button { background: #4ecb99; color: white; border: none; padding: 8px 12px; border-radius: 4px; cursor: pointer; }
  </style>
</head>
<body>
  <h3>Hello Extension!</h3>
  <button id="btn">클릭해봐</button>
  <script src="popup.js"></script>
</body>
</html>
EOF

cat <<EOF > popup.js
document.getElementById('btn').addEventListener('click', () => {
  alert('반갑습니다! 확장 프로그램이 정상 작동 중입니다.');
});
EOF