본문 바로가기

CodeLab41

Firebase Web 채팅앱 만들기 - Realtime Database를 이용한 채팅기능 구현 - 유저데이터 저장하기 새로 가입한 유저 데이터를 저장할때는 몇 가지 고민해야 할 부분이 있습니다. 첫번째는 유저데이터를 저장하는 시점입니다. Realtime Database의 특성상 권한이 부여된 후 저장이 되는 것이 바람직합니다. 가입 메소드에서 수행하면 아직 미인증 상태이므로 기본을 설정된 데이터베이스 권한으로는 저장할 수 없습니다. 그러므로 저장 위치는 onAuthChange 메소드에서 저장해야할 것입니다. 두번째는 onAuthChange메소드 위치에 두면 로그인할때마다 프로세스를 수행하게 됩니다. 그리고 새로 가입한 유저데이터를 저장하는 프로세스를 로그인할 때마다 저장하는 것은 Realtime Database 특성상, 만약에 Users 위치를 클라이언트에서 변화 감지해서 데이터를 받아오는 코드가 작성되어 있다면 불필요.. 2017. 12. 3.
Firebase Web 채팅앱 만들기 - Realtime Database를 이용한 채팅기능 구현 - Reatime Database 특징 및 데이터 구조 1) Realtime Database 특징 Firebase Realtime Database 는 JSON형태의 NoSQL 데이터베이스입니다. 그리고 연결된 모든 클라이언트에 실시간 동기화되는 특징이 있습니다. 이로 인하여 일반적인 SQL 데이터베이스로 구현하는 웹개발과는 다른 특징을 가집니다. NoSQL의 특징을 가지고 있는 데이터베이스로서 데이터베이스 구조를 미리 정의 하지 않습니다. (미리 테이블이나 칼럼을 생성할 필요가 없습니다.) NoSQL 데이터베이스지만 실시간 동기화되는 특성으로 인하여, 저장할 데이터 구조는 최대한 중첩을 배제해야합니다.(JSON Object 값에 다시 JSON Object가 중첩이 되는 형태를 말합니다.) Firebase Realtime Database와 Node.js를 함께.. 2017. 12. 3.
Firebase Web 채팅앱 만들기 - Authentication을 이용한 유저 가입 및 로그인 구현하기 1) Authentication 콘솔 설정 Firebase Authentication을 사용하여 가입 및 로그인 처리를 해보겠습니다. Authentication 을 사용하기 위하여 Firebase Console화면으로 진입한 후 좌측 Authentication 메뉴에 들어가고, 그 다음 로그인 방법 탭으로 들어갑니다. 로그인 방법 탭 항목 중 이번 예제에서는 '이메일/비밀번호', 'Google', 'Facebook' 항목을 이용하겠습니다. '이메일/비밀번호' 라인을 클릭해봅니다. 그러면 아래와 같은 팝업창이 뜹니다. 사용설정 스위치버튼을 눌러 사용설정을 해줍니다. 'Google'도 마찬가지로 사용설정을 해줍니다. Facebook 설정은 Facebook 로그인과 Firebase Authentication을.. 2017. 12. 2.
Firebase Web 채팅앱 만들기 - Hosting을 활용한 프로젝트 준비 작업 1) 예제 시작 소스 다운로드 받기 프로젝트를 시작하기 위해서 미리 구조를 잡아둔 예제 시작파일을 다운로드 받습니다. 예제 시작 파일을 받기위하여 https://github.com/cionman/firebase-tutorial-chat/ 아래 링크로 진입하여 commit 히스토리를 볼 수 있는 부분을 클릭합니다. commit 히스토리 중 맨 아래 쪽 '1. 예제 시작 파일' 부분 우측에 '' 버튼을 클릭 합니다. 나중에 예제를 글 단위별로 커밋을 해두었으니 따라하시면서 commit 히스토리를 참조하시면 됩니다. '1. 예제 시작 파일' 커밋 화면으로 진입한 후 아래의 스크린샷 부분을 클릭하면 예제 시작 파일을 다운로드 받을 수 있습니다. 다운로드 받은 파일을 프로젝트를 구성할 위치에 압축을 풀어줍니다. .. 2017. 12. 2.
728x90

티스토리툴바