ITstudy

FCM(Firebase Cloud Messaging) ๊ฐœ๋…๋ฐ ์•„ํ‚คํ…์ฒ˜

martinooo 2024. 7. 1. 19:03
728x170

 

 

 

 

 

๐Ÿคท‍โ™‚๏ธ ๋ณธ๋ก ์— ์•ž์„œ


 

 

 

Firebase Cloud Messaging(FCM)? ์•ฑ์—์„œ ์•Œ๋žŒ,๊ณต์ง€์„ ๋ณด๋‚ด๊ธฐ์œ„ํ•ด์„œ ์‚ฌ์šฉ๋˜๋Š” ์•Œ๋ฆผ์„ ๋ณด๋‚ด๋Š” ๋„๊ตฌ์ž…๋‹ˆ๋‹ค.

์šฐ๋ฆฌ๊ฐ€ ์‚ฌ์šฉํ•˜๋Š” ์•ฑ/์›น์—์„œ ์šฐ๋ฆฌ๋Š” ์•Œ๋ฆผ์„ ๊ณต์ง€, ์—…๋ฐ์ดํŠธ, ์•Œ๋ฆผ์„ ํœด๋Œ€ํฐ ๋ฉ”์„ธ์ง€๋กœ ๋ฐ›๋Š”๋ฐ ์ด ํ‘ธ์‹œ ์•Œ๋ฆผ์„ ๋ณด๋‚ผ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ฃผ๋Š” ํด๋ผ์šฐ๋“œ ๊ธฐ๋ฐ˜ ๋ฉ”์„ธ์ง• ์†”๋ฃจ์…˜ ๊ธฐ์ˆ ์ž…๋‹ˆ๋‹ค.

์ €๋Š” Nest.js ๋ฐฑ์—”๋“œ๋กœ FCM์„ ๊ตฌ์ถ•ํ•ด์„œ ํ‘ธ์‹œ์•Œ๋ฆผ ์„œ๋น„์Šค๋ฅผ ๊ฐœ๋ฐœํ•  ์˜ˆ์ •์ด์ง€๋งŒ ๊ฐœ๋ฐœ์— ์•ž์„œ FCM์˜ ๊ฐœ๋…๋ฐ ์•„ํ‚คํ…์ฒ˜๋ฅผ ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค.

 

FCM ์ด๋ž€?

๐Ÿ’ก Firebase Cloud Messaging(FCM)๋Š” Google Firebase ํ”Œ๋žซํผ์—์„œ ์ œ๊ณตํ•˜๋Š” ๋ฉ”์‹œ์ง• ์„œ๋น„์Šค๋กœ ์„œ๋ฒ„์—์„œ ์‚ฌ์šฉ์ž๋“ค ํ•ธ๋“œํฐ์œผ๋กœ ํ‘ธ์‹œ ๋ฉ”์‹œ์ง€๋ฅผ ์•ˆ์ •์ ์œผ๋กœ ์ „๋‹ฌํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ์ด๋ฅผ ํ†ตํ•ด์„œ ๋‹ค์–‘ํ•œ ํ•ธ๋“œํฐ๊ธฐ๊ธฐ์™€ ์‚ฌ์šฉ์ž์— ๋งž์ถฐ์„œ ์‹ค์‹œ๊ฐ„ ์•Œ๋ฆผ ์„œ๋น„์Šค๋ฅผ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. 

 

300x250

 

๐Ÿคท‍โ™‚๏ธ FCM์˜ ์ฃผ์š”๊ธฐ๋Šฅ?


FCM ๊ธฐ์ˆ ์— ์ฃผ์š” ๊ธฐ๋Šฅ์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.

  1. ๋‹ค์–‘ํ•œ ํ‘ธ์‹œ ์•Œ๋ฆผ ํ˜•์‹: ๋‹จ์ˆœ ํ…์ŠคํŠธ, ์ด๋ฏธ์ง€, ์•ก์…˜ ๋ฒ„ํŠผ ๋“ฑ ๋‹ค์–‘ํ•œ ํ˜•์‹์˜ ํ‘ธ์‹œ ์•Œ๋ฆผ์„ ์ง€์›ํ•˜์—ฌ ์•Œ๋ฆผ์˜ ๊ฐ€์‹œ์„ฑ๊ณผ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ํ–ฅ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค.
  2. ๋Œ€์ƒ ์ง€์ •: ์ฃผ์ œ(topic) ๊ตฌ๋…, ๊ธฐ๊ธฐ ๋“ฑ๋ก ํ† ํฐ์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ฉ”์‹œ์ง€๋ฅผ ํŠน์ • ๊ทธ๋ฃน ๋˜๋Š” ๊ฐœ๋ณ„ ๊ธฐ๊ธฐ๋กœ ์ „์†กํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
  3. ๋ฐฑ๊ทธ๋ผ์šด๋“œ ๋ฐ์ดํ„ฐ ๋™๊ธฐํ™”: FCM์„ ์‚ฌ์šฉํ•˜๋ฉด ์•ฑ์ด ๋ฐฑ๊ทธ๋ผ์šด๋“œ์— ์žˆ๋Š” ๋™์•ˆ์—๋„ ๋ฐ์ดํ„ฐ๋ฅผ ๋™๊ธฐํ™”ํ•˜๊ฑฐ๋‚˜ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์–ด ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ํ–ฅ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค.

 

FCM์„ ์‚ฌ์šฉํ•ด์„œ ํ‘ธ์‹œ ์•Œ๋ฆผ์„ ๋ณด๋‚ด๋Š” ์ด์œ ?

์‚ฌ์šฉ์ž์—์„ธ ํ‘ธ์‹œ ์•Œ๋ฆผ ์„œ๋น„์Šค์„ ๋ณด๋‚ด๊ธฐ ์œ„ํ•ด์„œ FCM ๋„๊ตฌ๋ฅผ ํ™œ์šฉํ•ฉ๋‹ˆ๋‹ค.

๊ทธ๋Ÿผ ์™œ? FCM ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ผ๊นŒ?

  • ๊ธฐ์กด์— ios, Android, web๋“ฑ์˜ ํ”Œ๋žซํผ์—์„œ ํ‘ธ์‹œ ์•Œ๋ฆผ์„ ๋ณด๋‚ด๊ธฐ ์œ„ํ•ด์„œ๋Š” ๊ฐ ํ”Œ๋žซํผ ํ™˜๊ฒฝ์— ๋งž์ถฐ์„œ ๊ฐœ๋ฐœํ•ด์„œ ํ‘ธ์‹œ ์•Œ๋ฆผ์„ ๋ณด๋‚ด์•ผ ๋˜๋Š”๋ฐ FCMํ™œ์šฉํ•˜๋ฉด ํ˜ธํ™˜์„ฑ ๋ฌธ์ œ๋ฅผ ์‰ฝ๊ฒŒ ํ•ด๊ฒฐํ•ฉ๋‹ˆ๋‹ค.
  • FCM ๊ต์ฐจ ํ”Œ๋žซํผ ๋ฉ”์‹œ์ง€ ์†”๋ฃจ์…˜ ์ด๊ธฐ๋•Œ๋ฌธ์— ๋‹ค๋ฅธ ํ”Œ๋žซํผ์— ์ข…์†๋˜์ง€ ์•Š๊ณ  ํ‘ธ์‹œ ์•Œ๋ฆผ์„ ์ „์†กํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

 

๐Ÿคท‍โ™‚๏ธ FCM ์•„ํ‚คํ…์ฒ˜?


FCM ๋™์ž‘์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.

  1. ์„œ๋ฒ„์—์„œ FCM ์„œ๋ฒ„๋กœ HTTP Request๋ฅผ POST ๋ฉ”์„œ๋“œ ๋ฐฉ์‹์œผ๋กœ ์š”์ฒญ
  2. FCM ์„œ๋ฒ„์—์„œ HTTP Response ์‘๋‹ต
  3. ios, Android, web ๊ธฐ๊ธฐ ํ™˜๊ฒฝ์— ๋งž์ถฐ ๋ฉ”์‹œ์ง€ ๋ณ€ํ™˜
  4. FCM ์„œ๋ฒ„์—์„œ ์‚ฌ์šฉ์ž ์•ฑ์œผ๋กœ ํ‘ธ์‹œ์•Œ๋ฆผ
  5. ์•ฑ์—์„œ ๋ฐ›์€ ์•Œ๋ฆผ์„ ์ฒ˜๋ฆฌํ•˜๊ณ  ์‘๋‹ต

 

FCM ๋™์ž‘ ์›๋ฆฌ

์†ก์‹ ์ž, FCM ๋ฐฑ์—”๋“œ ์„œ๋ฒ„, ์ˆ˜์‹ ์ž 3๊ฐœ๋กœ ๊ตฌ๋ถ„๋ฉ๋‹ˆ๋‹ค.

  • ์†ก์‹ ์ž: ์ฃผ๋กœ ์•ฑ์„œ๋ฒ„, HTTP ๊ธฐ๋ฐ˜์— ์„œ๋ฒ„, Firebase Console GUI ๋“ฑ๋“ฑ, ios, Android ์šด์˜์ฒด์ œ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๋ชจ๋ฐ”์ผ ๊ธฐ๊ธฐ
  • FCM ๋ฐฑ์—”๋“œ ์„œ๋ฒ„: ์‹ค์งˆ์ ์œผ๋กœ ์•ฑ ์„œ๋ฒ„์—์„œ ์š”์ฒญ์„ ๋ฐ›์•„์„œ ์ฒ˜๋ฆฌํ•˜๋Š” firebase ์„œ๋ฒ„
  • ์ˆ˜์‹ ์ž: ios, Android, web FCM ๋ฉ”์„ธ์ง€๋ฅผ ๋ฐ›๋Š” ์‚ฌ์šฉ์ž

 

FCM ์‚ฌ์šฉํ•˜๊ธฐ ์œ„ํ•œ ์„œ๋ฒ„ ํ™˜๊ฒฝ ๊ตฌ์„ฑ

FCM ๋ฐฑ์—”๋“œ ์„œ๋ฒ„์™€ ํ†ต์‹ ์„ ํ•˜๊ธฐ์œ„ํ•œ ์„œ๋ฒ„๋ฅผ ๊ตฌ์ถ•ํ•˜๊ธฐ ์œ„ํ•ด์„  ๋‹ค์Œ 3๊ฐ€์ง€ ๊ทœ์น™์„ ์ง€์ผœ์•ผ ํ•ฉ๋‹ˆ๋‹ค.

  • FCM ๋ฐฑ์—”๋“œ ์„œ๋ฒ„์— ์ง€์ •ํ•œ ๋ฐ์ดํ„ฐ ์…‹ ํ˜•์‹์— ๋งž์ถฐ์„œ ์š”์ฒญ์„ ๋ณด๋‚ด์•ผํ•ฉ๋‹ˆ๋‹ค.
  • ์ง€์ˆ˜ ๋ฐฑ์˜คํ”„๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ•˜๊ณ  ๋‹ค์‹œ ๋ณด๋‚ผ ์ˆ˜ ์žˆ์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.
    • ์ง€์ˆ˜ ๋ฐฑ์˜คํ”„๋ž€? ์š”์ฒญ์ด ์‹คํŒจํ•  ๋•Œ๋งˆ๋‹ค ์žฌ์š”์ฒญ์„ ์ง€์—ฐ์‹œํ‚ค๋Š” ์•Œ๊ณ ๋ฆฌ์ฆ˜
  • ์„œ๋ฒ„ ์Šน์ธ ์‚ฌ์šฉ์ž์™€ ์ธ์ฆ์ •๋ณด์™€ ํด๋ผ์ด์–ธํŠธ ํ‘ธ์‹œ ํ† ํฐ์„ ์•ˆ์ „ํ•˜๊ฒŒ ์ €์žฅํ•ด์•ผํ•ฉ๋‹ˆ๋‹ค.
    • ์„œ๋ฒ„ ์Šน์ธ ์‚ฌ์šฉ์ž์˜ ์ธ์ฆ ์ •๋ณด Authentication ์ •๋ณด
    • ํด๋ผ์ด์–ธํŠธ์˜ ๋“ฑ๋ก ํ† ํฐ: ๋ฉ”์‹œ์ง€๋ฅผ ๋ณด๋‚ด๊ณ ์ž ํ•˜๋Š” ์‚ฌ์šฉ์ž ๋””๋ฐ”์ด์Šค์˜ ์ •๋ณด

 

FCM ๊ณต์‹๋ฌธ์„œ

https://firebase.google.com/docs/cloud-messaging/send-message?hl=ko#node.js_5โ€‹

 

 

 

๐Ÿคท‍โ™‚๏ธ ๋งˆ์ง€๋ง‰์œผ๋กœ


์šฐ๋ฆฌ๊ฐ€ ํ•ธ๋“œํฐ์—์„œ ํ”ํžˆ ๋ฐ›๋Š” ์•Œ๋ฆผ์„œ๋น„์Šค๋ฅผ FCM ๋„๊ตฌ๋ฅผ ํ™œ์šฉํ•ด์„œ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

FCM ๋„๊ตฌ๋ฅผ ํ™œ์šฉํ•ด์„œ ์•ฑ์ด๋‚˜ ์›น์—์„œ ์ค‘์š”ํ•œ ์ •๋ณด๋ฅผ ๊ณ ๊ฐ๋“ค์—๊ฒŒ ๋น ๋ฅด๊ณ  ์•ˆ์ „ํ•˜๊ฒŒ ์ „๋‹ฌ๋ฐ›์„์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ฃผ๋Š” ์„œ๋น„์Šค๋ผ๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค.

FCM ๊ฐœ๋…, ๋™์ž‘์›๋ฆฌ, ์„œ๋ฒ„ํ™˜๊ฒฝ์— ํ•„์š”ํ•œ ๋ถ€๋ถ„๋“ค์„ ์•Œ์•„๋ณด๋ฉด์„œ ์ฒ˜์Œ ์•Œ๊ฒŒ๋œ ๋‚ด์šฉ๋„ ๋งŽ์•˜๊ณ  ๋” ์ž์„ธํ•œ ์ •๋ณด๋ฅผ ๊ณต์œ ํ•˜์ง€๋Š” ์•Š์•˜์ง€๋งŒ ์ค‘์š”ํ•œ ํ•ต์‹ฌ ํฌ์ธํŠธ๋ฅผ ์ •๋ฆฌํ•ด๋ดค์Šต๋‹ˆ๋‹ค.

 

 

 


 

์žฌ๋ฐŒ๋Š” ์˜ค๋Š˜์˜ ๋ ๋ณ„ ์šด์„ธ ๋ณด๊ณ  ๊ฐ€์„ธ์š”! 

 

 

https://cometruedream.tistory.com/247

 

[React] Tailwind ํ•œ์ค„, ๋‘์ค„, ์„ธ์ค„ ํšจ๊ณผ className ์ปค์Šคํ…€

๐Ÿคท‍โ™‚๏ธ Tailwind ํ•œ์ค„, ๋‘์ค„, ์„ธ์ค„ ํšจ๊ณผํ”„๋กœ์ ํŠธ ์ง„ํ–‰์ค‘ ๋ฐฐ๋„ˆ ๋งํฌ์— URL ๊ธธ์ด๊ฐ€ ๋„ˆ๋ฌด ๊ธธ์–ด์„œ 3์ค„ ํšจ๊ณผ ์ฒ˜๋ฆฌ๋ฅผ ํ•ด์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค. React + Tailwind CSS ์…‹ํŒ…๋œ ํ”„๋กœ์ ํŠธ ์—ฌ์„œ CSS ํŒŒ์ผ & style ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•˜

cometruedream.tistory.com

 

 

https://cometruedream.tistory.com/243

 

NestJS Lifecycle (์ƒ๋ช…์ฃผ๊ธฐ) ๊ฐœ๋…

๐Ÿคท‍โ™‚๏ธ ๋ณธ๋ก ์— ์•ž์„œ Nest JS ๊ฐœ๋…?Nest JS๋Š” Node JS ๊ธฐ๋ฐ˜์œผ๋กœ ํ•œ ์„œ๋ฒ„ ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ ํ”„๋ ˆ์ž„์›Œํฌ ์ž…๋‹ˆ๋‹ค. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ์ƒ๋‹นํžˆ ์˜ค๋žซ๋™์•ˆ Express ๊ธฐ๋ฐ˜์œผ๋กœ ์„œ๋ฒ„ ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ฐœ๋ฐœ์—์„œ ์••๋„์ ์ธ ์ 

cometruedream.tistory.com

 

 

https://cometruedream.tistory.com/242

 

๋ฆฌ์•กํŠธ Vite Proxy ํ™œ์šฉํ•œ CORS ์˜ค๋ฅ˜ ํ•ด๊ฒฐ

๐Ÿคท‍โ™‚๏ธ ๋ณธ๋ก ์— ์•ž์„œํ”„๋ก ํŠธ์—”๋“œ ๋ฒˆ๋“ค๋Ÿฌ ๊ฐœ๋…๊ณผ webpack vs vite ๋น„๊ต์— ๋Œ€ํ•ด์„œ ๊ณต๋ถ€๋ฅผ ํ•˜๊ณ  ๊ธ€์„ ๋ณด์‹œ๋ฉด ๋” ๋งŽ์€ ๋„์›€์ด ๋ฉ๋‹ˆ๋‹ค^^ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์„ ์œ„ํ•œ ๋ฒˆ๋“ค๋Ÿฌ ๊ฐœ๋…๊ณผ webpack vs vite ๋น„๊ตhttps://comet

cometruedream.tistory.com

 

 

https://cometruedream.tistory.com/241

 

React ํด๋”๊ตฌ์กฐ FSD ๊ธฐ๋Šฅ ๋ถ„ํ™œ ์„ค๊ณ„ ์•„ํ‚คํ…์ฒ˜

๐Ÿคท‍โ™‚๏ธ ๋ณธ๋ก ์— ์•ž์„œํ”„๋กœ์ ํŠธ๋ฅผ ์‹œ์ž‘ํ•˜๊ธฐ์— ์•ž์„œ ํด๋” ๊ตฌ์กฐ, ์„ค๊ณ„์— ๋Œ€ํ•œ ์•„ํ‚คํ…์ฒ˜๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ์ƒ๋‹นํžˆ ์–ด๋ ต๋‹ค. ์ด๋ฒˆ ํ”„๋กœ์ ํŠธ์— React FSD ํด๋”๊ตฌ์กฐ ์•„ํ‚คํ…์ฒ˜๋ฅผ ์„ค๊ณ„ํ•  ์˜ˆ์ •์ด๋ผ์„œ FSD ์•„ํ‚คํ…

cometruedream.tistory.com

 

 

https://cometruedream.tistory.com/244

 

์‰ฝ๊ฒŒ ์ดํ•ดํ•˜๊ณ  ์‚ฌ์šฉํ• ์ˆ˜ ์žˆ๋Š” Prisma ๋ช…๋ น์–ด ์ •๋ฆฌ

๐Ÿคท‍โ™‚๏ธ Prisma ๋ช…๋ น์–ด ๋ณธ๋ก ์— ์•ž์„œ Prisma๋ž€?Nest JS ํ”„๋ ˆ์ž„์›Œํฌ์™€ Prisma ORM์„ ํ™œ์šฉํ•ด์„œ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜๋ฉด์„œ Prisma๋Š” Node JS ๊ธฐ๋ฐ˜์— ํ”„๋ ˆ์ž„์›Œํฌ/๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์™€ ์ƒํ˜ธ์ž‘์šฉ์ด ์ž˜๋˜๋ฉฐ Prisma + DB ์—ฐ๋™์œผ

cometruedream.tistory.com

 

 

๊ทธ๋ฆฌ๋“œํ˜•