프로그래밍 언어/React (16) 썸네일형 리스트형 FCM Token 만료 및 갱신 (3) 토큰의 만료 FCM 토큰은 정해진 수명이나 갱신 주기가 없다. 따라서 시간과 관계없이 아래 이벤트가 발생하지 않는다면 만료되지 않는다. 앱이 인스턴스 ID를 삭제한 경우 앱이 새 기기에서 복원되었을 경우 사용자가 앱을 제거/재설치 한 경우 사용자가 앱 데이터를 지운 경우 토큰의 갱신 상기와 같이 fcm token은 정해진 수명이나 갱신 주기가 없으나, 오래된 토큰은 권장하지 않기 때문에 유효기간(2주)가 지나면 새로운 토큰을 발급받는 것이 좋다. 따라서 마지막 fcm token 발급 시점으로부터 14일 이상 경과한 경우 현재 fcm token을 삭제하고 재 발급한다. // 토큰 삭제 await messaging().deleteToken(); // 재발급 const token = await messagin.. FCM Token 생성 및 권한 설정 (2) 토큰의 생성 앱을 처음 실행할 때 FCM은 클라이언트 앱 인스턴스에 대한 등록 토큰 생성 // React native에서의 토큰 생성 import messaging from '@react-native-firebase/messaging'; const token = await messaging().getToken(); React Native의 경우 android, iOS 설정을 각각 해줘야 한다. iOS 권한 iOS에서는 사용자가 앱에게 알림 권한을 부여하지 않으면 알림 전송을 할 수 없다. 알림 권한 종류 granted not determined(default) declined 사용자가 권한 요청을 거절한다면 다시 요청할 수 없으며, 사용자가 직접 iOS 설정에서 변경해야 한다. // React nativ.. FCMToken이란? (1) FCMToken이란? firebase Cloud Messaging의 약자로, google firebase에서 사용하는 클라우드 메시징 서비스로, 무료로 메세지를 안정적으로 전송할 수 있는 교차 플랫폼 메시징 솔루션이다. 그렇다면 FcmToken은 왜 사용하는가? fcmToken은 어플리케이션에서 사용자에게 푸시 알림을 줄 때 필요하다. fcmToken은 디바이스마다 다르게 부여 되는데, 서버는 이 토큰으로 디바이스를 구분한다. 이 토큰으로 구분하지 않는다면, 서버는 어떤 디바이스에 알림을 줘야하는 것인지 모르기 때문이다. DB의 유저 테이블에 fcm Token 필드를 추가하고, 푸시 알림을 주고자 할 때 유저의 토큰 필드를 조회하여 프론트에 보내주는 방식으로 앱 푸시 알림을 구현할 수 있다. Fireba.. Javascript VS Typescript Javascript란 웹 개발에 주로 사용되며, 웹 페이지를 대화식으로 만드는 프로그래밍 언어 클라이언트 측 스크립팅 언어 객체 지향 프로그래밍 지원 높은 수준의 코드 탐색과 디버깅 자바스크립트 호환 TypeScripte란 자바스크립트를 기반으로 정적 타입 문법을 추가한 프로그래밍 언어 컴파일 언어, 정적 타입 언어 객체 지향 프로그래밍 지원 높은 수준의 코드 탐색과 디버깅 자바스크립트 호환 ➡️ 코드 작성 단계에서 타입을 체크해 오류를 확인할 수 있고 미리 타입을 결정하기 때문에 실행 속도가 매우 빠름. React Native에서의 코드 차이 변수 선언 // Javascript const [ data, setData ] = useState([]); const [ text, setText ] = useS.. React : Context API context를 이용하면 단계마다 일일이 props를 넘겨주지 않고도 컴포넌트 트리 전체에 데이터를 제공할 수 있습니다. Context를 써야 하는 이유 1. props을 명시적으로 넘겨주고 있는 예시 class App extends React.Component { render() { return ; } } function Toolbar(props) { // Toolbar 컴포넌트는 불필요한 테마 prop를 받아서 ThemeButton에 전달해야 합니다. // 앱 안의 모든 버튼이 테마를 알아야 한다면 이 정보를 일일이 넘기는 과정은 매우 곤혹스러울 수 있습니다. return ( ); } class ThemedButton extends React.Component { render() { return ; .. React : cookie / localStorage / SessionStorage HTTP 프로토콜 환경: "connectionless, stateless"한 특성을 가짐 → 서버는 클라이언트가 누구인지 매번 확인해야 함 connectionless : 클라이언트가 요청을 한 후 응답을 받으면 그 연결을 끊어 버리는 특징 stateless : 통신이 끝나면 상태를 유지하지 않는 특징 ※ 이러한 특성을 보안하기 위해 쿠키를 사용함 Cookie란? 웹 서버가 웹 브라우저에게 보내어 저장했다가 서버의 부가적인 요청이 있을 때 다시 서버로 보내주는 문자열 정보 웹 페이지 방문 시 방문 기록 등 브라우저에서의 정보들이 저장된 텍스트 파일 웹에서 요청마다 매번 연결과 해제가 되면서 요청마다 새로운 사용자로 인식되는 단점이 있지만, 쿠키와 세션을 통해 브라우저를 종료했다가 다시 접속해도 로그인 상태.. React의 기초 리액트(React)란? 리액트란 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다. 현재 가장 핫한 라이브러리 중 하나로, 싱글 페이지 애플리케이션이나 모바일 애플리케이션의 개발 시 토대로 사용될 수 있다. 즉, 현재 많이 활용되고 있는 웹/앱의 view를 개발할 수 있도록 하는 인기있는 라이브러리! 리액트의 필요성 React를 사용하지 않아도, html과 css, javascript를 이용해서 웹 페이지를 만들 수 있다 그러나 react를 이용해 사용자와 상호작용 할 수 있는 동적인 UI를 쉽게 만들 수 있기 때문에 많이 이용되고 있다. 프로젝트가 사용자와의 인터랙션이 별로 없다면 사실상 프론트엔드 라이브러리는 필요하지 않습다만, 프로젝트 규모가 커지고 정말 다양한 유저 인터페.. 자바스크립트의 기초 자바스크립트(JAVASCRIPT)란? 자바스크립트는 객체 기반의 스크립트 프로그래밍 언어이다. 즉, 웹 문서를 동적으로 제어하기 위해 고안된 프로그래밍 언어이다. 이 언어는 웹브라우저 내에서 주로 사용하며, 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있다. HTML : 모델 담당 CSS : 뷰 담당 자바스크립트 : 제어담당 자바스크립트의 역할 요소의 추가 및 삭제 CSS 및 HTML 요소의 스타일 변경 사용자와의 상호작용 폼의 유효성 검증 마우스와 키보드 이벤트에 대한 스크립트 실행 웹 브라우저 제어 및 쿠키 등의 설정과 조회 AJAX 기술을 이용한 웹 서버와의 통신 자바스크립트의 역할 대소문자 구분하여 작성 문장은 세미콜론(;)으로 구분 큰따옴표(" ")와 작은 따옴표(' ')를.. 이전 1 2 다음
