[Flutter] Android에서 FCM 연동(3) - Topic으로 알림 수신 개별 설정하기

구현 목표모든 사용자들에게 동일하게 전송되는 알림이 있는데,설정 화면에서 각각의 알림을 개별적으로 On/Off 할 수 있도록 구현해 보았다. Token과 Topic의 차이점FCM(Firebase Cloud Messaging)을 통해 사용자가 알림을 수신하는 방식에는 대표적으로 두 가지가 있다.Token 방식: 특정 사용자에게만 알림을 보낼 때 사용Topic 방식: 다수의 사용자에게 동일한 알림을 보낼 때 사용 항목 Token Topic대상단일 기기 (1:1)여러 기기 (그룹)사용 목적사용자마다 다른 알림 전송동일한 알림을 다수에게 전송사용 예시 1:1 메시지, 주문 상태 등 이벤트, 공지 등전송 방식개별 토큰으로 전송topic으로 전송유지 조건앱 삭제·재설치 시 토큰 변경될 수 있음구독 취소 전까지 유지..

• format_list_bulleted Flutter
• · 2025. 8. 8.
• textsms

[Flutter] Android에서 FCM 연동(2) - 알림 클릭 시 웹 링크로 이동하기

구현 목표사용자가 알림을 클릭했을 때, 지정된 웹 링크로 이동하는 기능을 구현한다. FCM 메시지 수신 시 기기 상태상태설명Foreground앱이 켜져 있고 사용자에게 보여지고 있는 상태Background앱은 실행 중이지만 백그라운드로 전환된 상태 (예: 홈 버튼 누름)Terminated앱이 완전히 종료된 상태각 상태에 따라 알림 수신 및 처리 방식이 다르므로, 상태에 맞는 코드를 구현해야 한다. 기본 설정기본적인 FCM 연동 방법은 다음 글을 참고한다. [Flutter] Android에서 FCM 연동(1) - 푸시 알림 수신 테스트 flutter pub add url_launcher`url_launcher` 패키지를 설치한다. import 'package:url_launcher/url_launche..

• format_list_bulleted Flutter
• · 2025. 8. 5.
• textsms

[JavaScript] Firebase Cloud Functions 연동(3) - DB 조회 후 FCM 알림 전송

구현 목표지정된 시간마다 자동으로 Firestore에서 데이터를 조회해서조건을 만족하면 FCM으로 알림을 전송하는 기능을 구현한다. onShedule 예약 함수 작성// The Cloud Functions for Firebase SDK to create Cloud Functions and triggers.const { logger, setGlobalOptions } = require("firebase-functions/v2");const { onSchedule } = require("firebase-functions/v2/scheduler");// The Firebase Admin SDK to access Firebstore.const { initializeApp } = require("firebase-..

• format_list_bulleted JavaScript
• · 2025. 8. 4.
• textsms

[JavaScript] Firebase Cloud Functions 연동(2) - 지정된 시간마다 호출되는 함수

구현 목표평일 오후 5시~5시 50분에 10분 간격으로 자동 실행되는 함수를 만들었다.함수가 실행되면 조건 충족 여부에 따라 DB에 데이터를 추가한다. onSchedule 예약 함수 작성지정된 시간에 함수를 실행하도록 예약하려면 `firebase-functions/v2/scheduler`에서 제공하는 `onSchedule` 핸들러를 사용하여 지정한 시간마다 함수 로직을 호출한다. 이를 위해서는 프로젝트에 `Cloud Scheduler API`가 사용 설정되어 있어야 하는데,대부분의 Firebase 프로젝트에서는 이미 사용 설정이 되어 있을 것이다.사용 설정 여부는 Google Cloud 콘솔에서 확인할 수 있다. const { logger, setGlobalOptions } = require("fire..

• format_list_bulleted JavaScript
• · 2025. 7. 22.
• textsms

[JavaScript] Firebase Cloud Functions 연동(1) - 기본 함수 테스트

구현 목표매일 특정 시간마다 특정 사이트를 스크래핑해서 원하는 데이터가 올라왔는지 확인하고,데이터가 올라왔다면 DB에 저장 후, 앱 푸시를 보내는 기능을 구현하고 싶다. 일단 Functions가 어떻게 작동하는지 직접 코드를 작성하고 실행해 보면서 배워보려고 한다.이번 글에서는 Firebase Functions를 초기화하고, 함수를 작성 후 배포까지 해 보았다. 프로젝트 초기화 및 구조 변경npm install -g firebase-toolsFirebase CLI를 설치한다. firebase login다음 명령어를 실행하여 Google 계정으로 Firebase에 로그인한다. firebase init`firebase init`을 실행한다. Firestore와 Fuctions를 선택한다.참고로 Firebas..

• format_list_bulleted JavaScript
• · 2025. 7. 17.
• textsms

[Flutter] Android에서 FCM 연동(1) - 푸시 알림 수신 테스트

구현 목표플러터로 만든 안드로이드 앱에서 매일 특정 시간에 DB를 조회해서조건 충족 시 푸시 알림을 보내는 기능을 구현해보려고 한다. 우선 이전 글에서 Flutter와 Firebase 기초 연동까지 구현했다. [Flutter] Android 앱에 Firebase 연동 기초 설정Firebase 프로젝트 생성 및 앱 등록Firebase에서 프로젝트를 생성하고 안드로이드 앱을 등록하면 `google-services.josn` 파일을 다운 받을 수 있다.이 파일을 `android\app\google-services.json` 디렉토리로 이동한divheer.tistory.com 이번에는 FCM 토큰을 등록해서 알림을 수신할 수 있도록 간단하게 테스트를 해 보자. FCM 메시지 수신 시 기기 상태상태설명Foregr..

• format_list_bulleted Flutter
• · 2025. 7. 16.
• textsms

[Flutter] Android 앱에 Firebase 연동 기초 설정

Firebase 프로젝트 생성 및 앱 등록Firebase에서 프로젝트를 생성하고 안드로이드 앱을 등록하면 `google-services.josn` 파일을 다운 받을 수 있다.이 파일을 `android\app\google-services.json` 디렉토리로 이동한다.민감할 수 있는 정보들이 들어있기 때문에 나는 이 파일을 `.gitignore`에 추가했다. Flutter 앱에 Firebase 추가필수 CLI 도구 설치npm install -g firebase-toolsFirebase CLI를 설치한다. firebase login다음 명령어를 실행하여 Google 계정으로 Firebase에 로그인한다. dart pub global activate flutterfire_cli디렉터리에서 다음 명령어를 실행하..

• format_list_bulleted Flutter
• · 2025. 7. 15.
• textsms

[TIL] 내일배움캠프 React 과정 2023.01.11

Today I Learend React Native 팀 프로젝트 진행 Firebase Error: Need to provide options import { initializeApp } from "firebase/app"; import { getFirestore } from "firebase/firestore"; import { getAuth } from "firebase/auth"; // ❌이 위치에 넣으면 안됩니다. const app = initializeApp(firebaseConfig); export const dbService = getFirestore(app); export const authService = getAuth(app); const firebaseConfig = { apiKey: ..

• format_list_bulleted 스파르타코딩클럽/내일배움캠프
• · 2023. 1. 13.
• textsms

[TIL] 내일배움캠프 React 과정 2023.01.05

Today I Learned React Native 심화 강의 수강 !!(느낌표 두 개) 연산자가 뭐지? let a = 1 console.log(!a) // false console.log(!!a) // true let a = undefined console.log(!!a) // false 해당 변수에 값이 할당되어있으면 true, 그렇지 않으면 false로 반환해주는 매우 유용한 연산자이다! 참고 https://hermeslog.tistory.com/279 https://velog.io/@hoon_dev/JavaScript-느낌표-두개Double-Exclamation-Marks-연산자-알아보기 FlatList 연구하기 ( ) )} Top Rated Movies } keyExtractor={(item) ..

• format_list_bulleted 스파르타코딩클럽/내일배움캠프
• · 2023. 1. 5.
• textsms

[TIL] 내일배움캠프 React 과정 2023.01.02

Today I Learned Firebase로 구현한 투두리스트 리팩토링 input 태그의 속성-value와 defaultValue input 태그의 속성인 defaultValue와 value에 값을 넣으면 둘 다 input 박스에 처음부터 보여진다. defaultValue: input tag에서 처음 보여줄 값 value: input tag에서 계속 보여줄 값 defaultValue를 지정하고 input 박스에 값을 입력하면 값이 수정이 된다. 반면, value를 지정하고 input 박스에 값을 입력하면 값이 입력되지 않고 지정해준 value만 계속해서 보여준다. 출처 https://velog.io/@e_juhee/defaultValue-value npm update 에러 생길 때 리액트 프로젝트 cl..

• format_list_bulleted 스파르타코딩클럽/내일배움캠프
• · 2023. 1. 2.
• textsms