안녕하세요, 햅뽀이입니다.
오늘은 Firebase의 데이터베이스 설정하는 방법을 함께해보려고합니다.
원래 이렇게 많은 서비스를 제공하고 있지만, 일단 저는 데이터베이스가 필요 하기 때문에 먼저 데이터베이스만 다루어 보려고합니다. 간단한 앱의 DB로는 Fireabase의 데이터베이스가 짱이라던 @anpigon 님의 말을 듣고, 설정을 실제로 해보면서 포스팅을 작성해봅니다.
1. Firebase 접속 및 프로젝트생성
- 이미 하나 추가를 한 상태에서 캡쳐를 했네요.
- 현재개발중인 Steem Tools의 사용자별 설정을 DB로 저장해놓고 어느 크롬에서도 불러올 수 있도록 개발할 예정입니다.
- steem-extension 으로 프로젝트명을 설정하였습니다.
2. Firebase Console
- Firebase 콘솔화면입니다.
- 개발도구 뿐만아니라 품질/분석/성장에 대한 부분까지 종합적으로 서비스를 합니다.
3. 데이터 베이스 설명
데이터베이스는 Realtime Database / Cloud Firestore로 구분됩니다.
차이점 설명 를 참고하시면 차이점을 아실 수 있을 듯 합니다.
두가지 DB 모두 No-SQL 기반입니다.
그 외에 많은 비교설명이 있는데, 대체로 Cloud Firestore가 진보된 DB라고 설명하고 있습니다.
그래서!! Cloud Firestore로 진행해봅니다..!! 최신을 써봐야죠!!
4. Web에 Firebase 설정
- 현재 개발중인 Chrome Extension은 웹기반이기 때문에 웹으로 설정합니다.
- 웹 이외의 언어는 링크를 참조하시면 됩니다.
1 | <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase.js"></script> |
5. Firebase Database 사용법(쓰기)
- Cloud Firestore는 컬렉션에 저장되는 문서에 데이터를 저장합니다. 문서에 데이터를 처음 추가할 때 Cloud Firestore에서 암시적으로 컬렉션과 문서를 만듭니다. 컬렉션이나 문서를 명시적으로 만들 필요가 없습니다.
1 | db.collection("users").add({ |
6. Firebase Database 사용법(읽기)
- Cloud Firestore에 추가한 데이터를 빠르게 확인하려면 Firebase 콘솔의 데이터 뷰어를 사용하면 됩니다.
1 | db.collection("users").get().then((querySnapshot) => { |
7. 저장된 데이터 확인
- 아래와 같이 데이터가 저장되었습니다. DB 설계를 하지 않아도 일단 그냥 들어가고 봅니다.(테스트를 여러번해서 동일 데이터가 여러번 들어갔습니다.)
- 추후 Update/Delete 기능도 확인해볼 예정입니다.
생각보다 정리하면서 실행해보려니 오래 걸리네요. 아직 파악해볼 기능이 많은데, 오늘은 여기까지 해야 하겠습니다. 4시간을 공부하면서 정리했네요;;
그럼 남은 주말.. 잘 보내십시오..
읽어주셔서 감사합니다!!