Firebase Web 만들기 - Hosting, Database

Firebase 이용해서 Hosting, Database 사용하기 !

https://translator-c4119.firebaseapp.com/

Vscode 플러그인에서 데이터를 받은지... 한달 ?

하지만 데이터가 많이 쌓이지 않는다... 테스트 할때 보니 170개 가량... 쥬륵

만들었던 과정을 끄적끄적 해보겠습니다.

우선

가이드 - https://firebase.google.com/docs/hosting/quickstart?authuser=0

요약하자면

node 를 설치하고 firebase-tools 를 설치하고 firebase login  하고 firebase init 으로 시작합니다.

그리고 firebase deploy 를 하면 배포가 됩니다.

- 끝...

호스팅은 생각보다 쉽습니다. (데이터베이스 연동하는것보단 ㅠ)

저 위에 페이지를 만들어 보겠습니다.

index.html 입니다.

  

    

      

        

          현재 쌓인 데이터의 수는  개 입니다.
        
      
    
    

      

    
  

Javascript 부분이 중요합니다 !!

Database 부터 연동하겠습니다.

var database = firebase.database();

끝 !!

끝입니다 연동 되었습니다. 바로 사용해보겠습니다.

function writeUserData() {
        firebase
            .database()
            .ref("translate/success")
            .on("value", function (snapshot) {
                console.log(snapshot.val());
            });
}

저는 translate 에서 success 부분에 있는 값들을 들고오기 위해서 저렇게 했습니다.

snapshot.val() 에는 아래와 같은 값이 나옵니다.

저 값들을 가지고 이제 변환하고 변환하고 이쁘게 만들어주고... 해서 Word Cloud 를 써서 아래와 같이 만들었습니다.

http://timdream.org/wordcloud2.js 를 사용했습니다.

어... 퇴사가 저렇게 큰 이유는...

테스트에 도움을 주신 분들께서 번역기를 돌린 결과... 크흠