Firebase의 시작 방법

9235 단어 Firebase
비둘기다.안녕하세요.오늘은 Firebase를 시작하고 싶습니다.

뭐?


Firebase는 구글이 운영하는 서비스(2014년 하반기 구글 인수)로 BaaS 또는 mBaaS라고 불리는 물건이다.
아마도...그런데 너무 고기능적이고 다기능적이어서 큰일났어요.

BaaS/mBaaS는 무엇입니까?


내 이해는 몬고 DB(또는 각종 스키노 SQL)의 클라우드 트랜잭션부터'서버에서 일하지 않으면 응용 프로그램을 만들 수 없는 것들'을 가상화하기 위해 추가된 여러 가지(로그인 기능,push 알림, etc...)서비스간단하고 빠르게 앱을 만드는 것.
많지만 기본 기능으로는'JSON 던지기, 저장, 검색 키로 JSON 꺼내기'가 있다.

Firebase 기능


중심 기능 및 특징
1. 실시간 데이터베이스.누군가가 데이터를 업데이트하면 다른 단말기에도 자동으로 반영된다.오프라인 동작도 가능합니다.
2. Firebase 클라우드 메시지 전달.이른바 push 알림을 포함합니다.이 문장 이해하기 쉽다.
3. FirebaseAuth 소셜 로그인.Facebook, GitHub, Twitter and Google.익명 로그인과 메일 비밀번호를 통해 인증할 수도 있다.
4. Firebase 스토리지 S3를 교체합니다.
5. 정적 네트워크를 호스팅합니다.CDN 및 HTTPS 포함스파 제작이라면 Firebase만으로 완성됩니다.
6. TestLab Android 장치를 원격으로 테스트할 수 있습니다.테스트 동작을 설명할 수도 있고 Robo가 UI를 완전히 자동으로 조작할 수도 있습니다.요금
7. Crash Reporting 충돌 보고서.
8. AdWords 대상 광고 부트 어플리케이션으로 이동
9. AdMob 애플리케이션 내 광고에서 수익 창출
10. Dynamic Link 응용 프로그램이 설치되면 응용 프로그램을 열고 설치되지 않을 때 웹 페이지를 열면 자동으로 처리됩니다.
11. Invite e-mail 또는 SMS를 통해 초대 메시지를 보내는 기능.링크에 소위 소개 코드를 포함할 수도 있다.

Firebase가 싸요?


Pricing만 봐도 무료로 사용할 수 있는 것은
  • 실시간 데이터베이스
  • 100 동시 연결
  • 1GB 용량
  • 10GB의 전송량
  • 스토리지(S3like)
  • 5GB 용량
  • 30GB 전송량
  • 5만 회 업그레이드/다운로드
  • 정적 페이지 관리
  • 1GB 용량
  • 10GB의 전송량
  • 독립 실행형 도메인 및 무료 SSL
  • 이런 데
    25달러의 간이 요금 계획 (저렴함) 과 종량 요금 계획도 있다.
    종량요금에 비해 간이요금 계획은 45달러에 해당하는 기능으로 25달러이기 때문에 수지가 맞는다.

    실시간 데이터베이스 가격


    실시간 데이터베이스 가격만 보면 양적 계획
  • $5/GB 용량
  • $1/GB의 전송량
  • 이것은 같은 몬고DB의 호스트 사이트mLab보다 조금 싸고 AWS의 다이나모 DB보다 10배 정도 비싸다.하지만 다이나모 DB는 사용법이 완전히 다르기 때문에 비교하기 어렵다.
    니프티의 mobile backend는 3만 엔/100GB이기 때문에 3/GB의 용량이다.
    고기능의 실시간 데이터베이스지만 솔직히 싸다고 할 수는 없을 것 같다.
    데이터베이스의 사용을 최대한 억제하여 저장소로 도망가게 하는 것이 좋다.
    (주: Firebase는 로컬 캐시를 만들기 때문에 용량을 막론하고 전송량이 실제로는 더 적을 수 있습니다)

    스토리지 가격


    종량 계획 중
  • 0.026/GB 용량
  • $0.12/GB의 전송량
  • 달러당 0.01/1000회 업로드/다운로드 요청
  • AWS S3(Tokyo)에 비해 용량과 전송량이 저렴하고 요청이 높습니다.
    작은 그림을 대량으로 설정하면 불리할 수 있습니다.

    위탁 관리 가격


    종량 계획 중
  • 0.026/GB 용량
  • $0.15/GB 전송량
  • 거의 S3와 같다.
    전송량은 $0.01/GB가 S3보다 높지만, 1GB의 전송량인 500-1000PV를 고려하면 *10만 PV가 S3보다 100엔 높은 느낌일까.

    가격 총결산


    비록 싸지는 않지만, 나는 가격이 합리적이라고 생각한다.
    초기에는 무료로 시작할 수 있습니다. $25/Month가 부족할 때 5000명·1300명의 일일 이벤트도 이상하지 않다.
    (1인당 0.5MB의 텍스트 정보, DAU당 5MB를 전송하는 경우)
    실시간 데이터베이스의 단가가 높기 때문에 일정 시간마다 과거 로그를 삭제하거나 실시간 데이터베이스에 아예 저장하지 않아야 할 수도 있다.
    그럼에도 불구하고 종량요금의 경우 사용자당 1MB, 50MB의 DB통신을 저장한다... 이렇게 생각하면 1000명당 6달러이기 때문에 10만 사용자당 600달러이다.솔직히 월 10만 명의 사용자를 판매하는 서버라면 $600≈6만 엔으로는 구축할 수 없다.
    구성에 따라 서버 비용만 10-20만 엔, 인건비를 포함하면 50만 엔 정도가 소요될 것으로 보인다.
    자동 규모의 환경을 만드는 인프라의 인건비를 감안하면 저렴하다고 할 수 있죠.
    (돈은 못 받았는데 의미 없는 싸구려 홍보)

    Firebase를 시작해보도록 하겠습니다.


    제작 항목


    https://firebase.google.com부터 시작합시다.
    오른쪽 위 모서리를 클릭하여 콘솔로 이동합니다.
    (구글 계정으로 로그인. 없는 사람 하자)

    프로젝트 이름과 국가 이름을 입력합니다.

    로컬 시작 항목


    그러면 콘솔에서 CLI를 넣으십시오.
    npm install -g firebase-tools
    
    CLI 설치가 완료되면 시작합니다.
    firebase login
    
    "익명 정보 수집 가능한가요?"그러니까 취향에 따라 하세요.
    다음은 브라우저가 열리고 구글 계정은 로그인과 권한 승인을 요구하니 인정하세요.
    축하합니다!이제 명령줄에서 Firebase를 사용할 수 있습니다!
    자, 우리 다음 단계를 시작합시다.
    firebase init
    
    이렇게 타자를 치면 다음과 같은 화면이 나올 것이다.

    오, 멋있다.
    여기는 정적 사이트의 위탁관리를 하고 싶으니 아래Hosting: Configure and deploy Firebase Hosting
    sites
    를 선택하세요.
    프로젝트를 하나요?그러니까 아까 한 거myFirstFirebase를 선택해.
    나머지는 Enter 입니다. 문제 없습니다.
    규칙의 파일 이름은 무엇입니까?(database.rules.json)
    사이트에서 관리되는 디렉터리 이름은?(public)
    SinglePageApplication으로 설정하시겠습니까?(yes)
    그렇다면 지금의 목록에서
  • ./database.rules.json
  • ./firebase.json
  • ./public/index.html
  • 의 명세란 스타일에 정의된 설정입니다.
    이거 봐요!
    firebase serve
    
    방문http://localhost:5000/ 시 이런 홈페이지를 열 수 있을 것이다.

    실시간 데이터베이스 기능 내장


    대시보드 페이지에서 네트워크 응용 프로그램에 Firebase 추가 를 클릭합니다.

    이런 느낌의 자바스크립트 코드가 나왔습니다.
    <script src="https://www.gstatic.com/firebasejs/live/3.0/firebase.js"></script>
    <script>
      // Initialize Firebase
      var config = {
        apiKey: "あなたのAPIキー",
        authDomain: "myfirstfirebase(的な名前).firebaseapp.com",
        databaseURL: "https://myfirstfirebase-(的な名前).firebaseio.com",
        storageBucket: "myfirstfirebase-(的な名前).appspot.com",
      };
      firebase.initializeApp(config);
    </script>
    
    이것 좀 복사해 주세요.public/index.html의</style></head> 사이에 붙여주세요.
    다음 코드로 교체<body>~</body>.
      <body>
        <div id="message">
          <h1>Firebaseてすと</h1>
          <p>文字を入れると更新されます</p>
          <ul>
            <li id="chatText"></li>
            <li><input type="text" name="" id="my_text"></li>
            <li><a onclick="changeData()">更新</a></li>
          </ul>
        </div>
    
    
        <script>
          var db = firebase.database();
          var myChatAll = db.ref("/my/chat/all");
    
          function changeData(){
            var text = document.getElementById("my_text").value;
            myChatAll.set({title:"example", text:text});
          }
    
          myChatAll.on("value", function(snapshot) { 
            document.getElementById("chatText").innerText = snapshot.val().text;
          });
        </script>
      </body>
    
    http://localhost:5000/ 다시 읽으면 이런 화면을 볼 수 있을 거예요.

    이 화면에 문자를 넣으면 당연히 업데이트되지만 다른 화면에서도 실시간으로 업데이트됩니다!

    정상적으로 실행할 수 없을 때: Firebase 실시간 데이터베이스 규칙 설정


    위의 화면에서 업데이트에 성공하지 못하면 규칙 설정이 잘못될 수 있습니다.

    콘솔 화면에서 규칙을 다시 설정하세요.
    {"rules":{".read":"true",".write":"true"}}
    
    이렇게 모든 상태에서 읽고 쓸 수 있도록 먼저 설정해 보세요.

    실시간 업데이트


    브라우저 두 개를 열고 확인해 보세요.

    이렇게 한 곳에서 업데이트하면 바로

    둘 다 반영됐어!너무 좋아요!

    배치


    여기까지 완성하고 나면 한숨!우리는 실제적으로 위탁 관리 환경에 배치할 것이다.
    firebase deploy
    
    그럼 배치가 끝났습니다!너의 홈페이지를 열어라!
    firebase open hosting:site
    

    좋은 웹페이지 즐겨찾기