๐Ÿš€ ๋‚˜๋Š” WhatsApp Web ์ž๋™ํ™” Chrome ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ์„ ๋งŒ๋“ค์—ˆ๋‹ค (Manifest V3)

๋ฐœํ–‰: (2025๋…„ 12์›” 23์ผ ์˜คํ›„ 10:07 GMT+9)
3 ๋ถ„ ์†Œ์š”
์›๋ฌธ: Dev.to

Source: Dev.to

์™œ ์ด ํ™•์žฅ์„ ๋งŒ๋“ค์—ˆ๋‚˜์š”

์ œ๊ฐ€ ์ฐพ์€ ๋Œ€๋ถ€๋ถ„์˜ WhatsApp ์ž๋™ํ™” ๋„๊ตฌ๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ฌธ์ œ๊ฐ€ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค:

  • ๋„ˆ๋ฌด ๊ณต๊ฒฉ์ ์ด๋ผ(๋ฐด ์œ„ํ—˜์ด ๋†’์Œ)
  • ํ์‡„ํ˜•์ด๋ฉฐ ์‚ฌ์šฉ์ž ํ”„๋ผ์ด๋ฒ„์‹œ๋ฅผ ๋ฌด์‹œํ•จ

์ €๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ชฉํ‘œ๋ฅผ ๊ฐ€์ง„ ๋ฌด์–ธ๊ฐ€๋ฅผ ๋งŒ๋“ค๊ณ  ์‹ถ์—ˆ์Šต๋‹ˆ๋‹ค:

  • ๊ฐœ๋ฐœ์ž ์นœํ™”์ 
  • ํˆฌ๋ช…ํ•จ
  • ์•ˆ์ „๊ณผ ํ”„๋ผ์ด๋ฒ„์‹œ ์ค‘์‹ฌ
  • Chrome Manifest V3์™€ ์™„์ „ ํ˜ธํ™˜

ํ™•์žฅ ๊ธฐ๋Šฅ

  • ์—ฌ๋Ÿฌ ๋ฉ”์‹œ์ง€๋ฅผ ์ž๋™์œผ๋กœ ์ „์†ก
  • ์ธ๊ฐ„ ํ–‰๋™์„ ํ‰๋‚ด ๋‚ด๊ธฐ ์œ„ํ•œ ๋ฉ”์‹œ์ง€ ๊ฐ„ ๋žœ๋ค ์ง€์—ฐ
  • ์ŠคํŒธ์ฒ˜๋Ÿผ ๋ณด์ด์ง€ ์•Š๋„๋ก ์ตœ์†Œ/์ตœ๋Œ€ ์ง€์—ฐ ๊ฐ•์ œ ์ ์šฉ

์Šค์ผ€์ค„๋ง

  • ํŠน์ • ๋‚ ์งœ์™€ ์‹œ๊ฐ„์— ๋ฉ”์‹œ์ง€ ์บ ํŽ˜์ธ ์˜ˆ์•ฝ
  • Chrome ์•Œ๋žŒ์„ ์ด์šฉํ•œ ์ง€์—ฐ ์‹œ์ž‘ ์ง€์›

๋‹ค์–‘ํ•œ ์ž…๋ ฅ ๋ชจ๋“œ

  • JSON ๋ชจ๋“œ โ€“ ๋ฉ”์‹œ์ง€ ๋ฐฐ์—ด์„ ๊ทธ๋Œ€๋กœ ๋ถ™์—ฌ๋„ฃ๊ธฐ
  • ํผ ๋นŒ๋” โ€“ UI๋ฅผ ํ†ตํ•ด ๋ฉ”์‹œ์ง€ ์ถ”๊ฐ€/์ œ๊ฑฐ
  • ํ”„๋กœํ•„ ๋ชจ๋“œ โ€“ ์ „ํ™”๋ฒˆํ˜ธ์™€ ๋ฉ”์‹œ์ง€๋ฅผ ๊ฐ€์ง„ ์‚ฌ์šฉ์ž ๋กœ๋“œ
  • API ๊ฐ€์ ธ์˜ค๊ธฐ (POST) โ€“ ๋ฐฑ์—”๋“œ์—์„œ ์บ ํŽ˜์ธ ๊ฐ€์ ธ์˜ค๊ธฐ
  • ์ž๋™ ํด๋ง โ€“ ์ƒˆ๋กœ์šด ์„ค์ •์„ ์ฃผ๊ธฐ์ ์œผ๋กœ ํ™•์ธ

์ „์ฒด ์ œ์–ด

  • ์–ธ์ œ๋“  ์‹œ์ž‘, ์ผ์‹œ์ •์ง€, ์žฌ๊ฐœ, ์ค‘์ง€ ๊ฐ€๋Šฅ
  • Chrome์„ ๋‹ซ์•„๋„ ์„ค์ •์ด ์œ ์ง€๋จ

ํ”„๋ผ์ด๋ฒ„์‹œ ์šฐ์„  ๊ธฐ๋Šฅ

๊ณต์šฉ ๋˜๋Š” ๊ณต์œ  ํ™˜๊ฒฝ์„ ์œ„ํ•œ ๋„๊ตฌ:

  • ์ฑ„ํŒ… ๋ฉ”์‹œ์ง€ ํ๋ฆผ ์ฒ˜๋ฆฌ
  • ์ตœ๊ทผ ์ฑ„ํŒ… ๋ฏธ๋ฆฌ๋ณด๊ธฐ ํ๋ฆผ ์ฒ˜๋ฆฌ
  • ์ด๋ฏธ์ง€ ๋ฐ ๋™์˜์ƒ ํ๋ฆผ ์ฒ˜๋ฆฌ
  • ํ”„๋กœํ•„ ์‚ฌ์ง„ ํ๋ฆผ ์ฒ˜๋ฆฌ
  • ๋ฉ”์‹œ์ง€ ์ž…๋ ฅ ์˜์—ญ ํ๋ฆผ ์ฒ˜๋ฆฌ

๋งˆ์šฐ์Šค๋ฅผ ์˜ฌ๋ฆฌ๋ฉด ์ผ์‹œ์ ์œผ๋กœ ํ‘œ์‹œ๋ฉ๋‹ˆ๋‹ค.

๊ธฐ์ˆ  ์Šคํƒ ๋ฐ ์•„ํ‚คํ…์ฒ˜

  • Chrome Extension Manifest V3
  • ์ˆœ์ˆ˜ JavaScript, HTML, CSS (์™ธ๋ถ€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์—†์Œ)
  • Chrome API ์‚ฌ์šฉ: storage, alarms, scripting

๋งํฌ

  • Chrome Extension:
  • Documentation / Source:
  • Issues & Feedback:
  • Privacy Policy:

ํ”ผ๋“œ๋ฐฑ ํ™˜์˜

์ปค๋ฎค๋‹ˆํ‹ฐ์˜ ์˜๊ฒฌ์„ ๊ธฐ๋‹ค๋ฆฝ๋‹ˆ๋‹ค:

  • UX๊ฐ€ ์ง๊ด€์ ์ธ๊ฐ€์š”?
  • ์–ด๋–ค ๊ธฐ๋Šฅ์„ ์ถ”๊ฐ€ํ•˜๊ณ  ์‹ถ์œผ์‹ ๊ฐ€์š”?
  • Manifest V3 ์ œํ•œ ์‚ฌํ•ญ์— ๋Œ€ํ•œ ์šฐ๋ ค๊ฐ€ ์žˆ๋‚˜์š”?

์ฝ์–ด ์ฃผ์…”์„œ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ์ฆ๊ฑฐ์šด ์ฝ”๋”ฉ ๋˜์„ธ์š”! ๐Ÿš€

Back to Blog

๊ด€๋ จ ๊ธ€

๋” ๋ณด๊ธฐ ยป

2์ฃผ ๋งŒ์— ํ”„๋ผ์ด๋ฒ„์‹œ ์šฐ์„  ํ†ตํ™” ๋ณ€ํ™˜๊ธฐ๋ฅผ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค

The Problem ๐Ÿคฆโ€โ™€๏ธ ๋‚ด๊ฐ€ ์‹œ๋„ํ•œ ๋ชจ๋“  currency converter๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ฌธ์ œ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ์—ˆ๋‹ค: - โŒ ๊ฐ•์ œ signโ€‘ups์™€ email ์ˆ˜์ง‘ - โŒ ์ฟ ํ‚ค๋กœ user behavior ์ถ”์  - โŒ ๋А๋ฆฌ๊ฒŒ ๋กœ๋“œ๋จ ...

๐ŸŽ‰ Node.js์™€ ํ•จ๊ป˜ํ•˜๋Š” WhatsApp ๋ฉ”์‹œ์ง€ ์ž๋™ํ™”๋กœ ์ƒˆํ•ด ์ธ์‚ฌ ๐ŸŽ‰

๊ฐœ์š”: Node.js์™€ whatsapp-web.js๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ WhatsApp์—์„œ ์ƒˆํ•ด ์ธ์‚ฌ ๋ฉ”์‹œ์ง€๋ฅผ ์ž๋™์œผ๋กœ ๋ณด๋‚ด์„ธ์š”. ์ž๋™ํ™”๋Š” ์ „์ ์œผ๋กœ ๊ท€ํ•˜์˜ ์ปดํ“จํ„ฐ์—์„œ ์‹คํ–‰๋˜์–ด, ๊ท€ํ•˜์˜ WhatsApp์„ ๋ณดํ˜ธํ•ฉ๋‹ˆ๋‹ค.

์™œ ๋‚˜๋Š” WebAssembly๋ฅผ ์‚ฌ์šฉํ•ด 100% ๊ฐœ์ธ ํŒŒ์ผ ๋ณ€ํ™˜๊ธฐ๋ฅผ ๋งŒ๋“ค์—ˆ๋Š”๊ฐ€ (์„œ๋ฒ„ ์—…๋กœ๋“œ ์—†์Œ)

ํด๋ผ์šฐ๋“œ ์ฒ˜๋ฆฌ์˜ ๋ฌธ์ œ์  ๋Œ€๋ถ€๋ถ„์˜ โ€œ๋ฌด๋ฃŒโ€ ์˜จ๋ผ์ธ ํŒŒ์ผ ๋ณ€ํ™˜๊ธฐ๋Š” ๊ฐœ์ธ ์ •๋ณด ๋ณดํ˜ธ์˜ ์•…๋ชฝ์ด๋‹ค. PDF๋‚˜ ์ด๋ฏธ์ง€๋ฅผ ConvertMyFile ๊ฐ™์€ ์„œ๋น„์Šค์— ์—…๋กœ๋“œํ•˜๋ฉดโ€ฆ