강디너의 개발 일지

Firebase Web 만들기 - Hosting, Database 본문

Javascript/삽질

Firebase Web 만들기 - Hosting, Database

강디너 2019. 3. 6. 22:00
728x90
반응형

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 를 사용했습니다.



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

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


커피한잔...
Comments