David

시니어 (9년 이상)

내 100G를 다운로드 하는것 이기 때문에 말씀하신 금액이 맞습니다.구글이 다 좋긴 한데 이런거에 과금을 해서 돈을 버는 형태인것 같습니다.참고로 아래 내용은 AWS S3(storage) 과금 표입니다. 하나를 예를 들면 0.09$ + 리즌(0.02) => 0.11$정도 네요.근데 다운로드 사이즈가 클수록 가격이 저렴해지니 구축하시려는 비즈니스에 따라서AWS와 Google과 적절히 섞어서 사용하시는게 좋은 방법일것 같습니다.<img src="https://cdn.inflearn.com/public/comments/ac24962d-7849-40b3-9bac-0ca72851440a/Screen Shot 2022-10-15 at 8.24.44 AM.png" alt="image" title="image">&nbsp;

안녕하세요 Firebase Storage로 모바일게임 업데이트시스템을 만들려고하는데요

Firebase CLI 설치 시, 에러가 납니다! - sudo로 해결

안녕하세요&nbsp;
백엔드 단은 아래 문서와 같이&nbsp;<span style="color: #202124; font-family: Roboto, 'Noto Sans', 'Noto Sans JP', 'Noto Sans KR', 'Noto Naskh Arabic', 'Noto Sans Thai', 'Noto Sans Hebrew', 'Noto Sans Bengali', sans-serif; font-size: 16px; background-color: #ffffff;">&nbsp;Node.js, Java, Python, Go 및 C#(.NET)를 지원 합니다.
https://firebase.google.com/docs/reference/admin
<img title="Screen Shot 2022-08-21 at 5.23.10 AM.png" src="https://cdn.inflearn.com/public/comments/9c17588c-8d75-4bba-97fc-6f9e314445b5/Screen Shot 2022-08-21 at 5.23.10 AM.png" alt="" width="1440" height="259" />
제가 연동은 해보지 못했지만 아래 개발자분이 레퍼런스 문서를 만들어 놓으신게&nbsp; 있어서 링크 드립니다.
혹시 도움이 되시길...
https://firework-ham.tistory.com/111
&nbsp;

스프링부트 프로젝트는 firebase 로 배포할 수 없나요???

&nbsp;
설치되신 버젼이 아래와 같은지 확인 부탁드릴께요.
아래와 같은데도 그러면 설치되신 package.json화일 공유 부탁드리겠습니다.
&nbsp;
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Menlo, Monaco, 'Courier New', monospace; font-size: 12px; line-height: 18px; white-space: pre;">"vue-pwa-install": "^1.1.0",</div>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Menlo, Monaco, 'Courier New', monospace; font-size: 12px; line-height: 18px; white-space: pre;">
<div style="line-height: 18px;">"@vue/cli-plugin-pwa": "^4.5.9",</div>
</div>

TypeError: Cannot read property 'tap' of undefined

네 안녕하세요
아무나 사용할수 있을것 같아 강의 중간에 명시하긴 했는데&nbsp;
여기에 명시 해드리도록 하겠습니다.
https://github.com/david-inflearn/boilerplate

작업하신 Source는 어디서 다운 받을수 있나요? Table2 화면

그리고 강의에 언급을 하지 않았지만 쿼리를 좀더 쉽게 할수 있는 firesql이라는 모듈이 있습니다.
https://www.npmjs.com/package/firesql
이 모듈은 where 절을 쉽게 대량으로 사용할수 있는 모듈인데요(쿼리 속도도 그냥 순수하게 사용하는 문법보다 훨씬 빠릅니다)
참고로 해당 모듈이 9버젼은 지원을 안하더라구여
그리고 조금 황당한건 아래 예제가 9버젼 쿼리 예제인데요. 현재 이렇게 "in" 문법에 담길수 있는 array 수 Max가 5개라고 합니다.
기존 8버젼은 그럼 굉장히 많냐? 그것도 아닙니다. 한번에 호출할수 있는게 8버젼은 10입니다.
그래서 앞서 말씀 드린 firesql이라는걸 사용했거든요. 이건 제약이 없습니다.
근데 이걸 못쓰니 실무에서 한번에 5개씩 담아서 loop를 돌려야 되는 힘든 상황이라 흠..
<pre class="lang-js" dir="ltr" style="box-sizing: inherit; color: var(--devsite-code-color); font-size: 14px; padding: 24px 24px 24px 23px; margin-top: 0px; margin-bottom: 0px; overflow-x: auto; position: relative; padding-block: var(--devsite-code-padding-block,24px); padding-inline: var(--devsite-code-padding-inline,24px); border-radius: var(--devsite-content-border-radius,0); direction: ltr !important;" translate="no" data-code-snippet="true" data-github-path="firebase/snippets-web/snippets/firestore-next/test-firestore/in_filter.js" data-region-tag="in_filter_modular">import { query, where } from "firebase/firestore"; const q = query(citiesRef, where('country', 'in', ['USA', 'Japan']));</pre>
좀더 해법이 나올때 까지 업그레이드를 안하시는게 어쩌면 더 나은게 아닐런지 하는 생각도 듭니다.

혹시 강의 내용 업그레이드 계획이 있으신지요?

네 안녕하세요
질문 주셔서 감사합니다 ^^
이부분에 대해서 고민을 많이 해봤는데요
구글 같은 경우는 아래와 같이 "Web version8" 이라고 해서 강의에 맞는 소스 예제를 보실수 있어서 개발하시는데는 이슈가 없으리라 생각이 듭니다,
구글링 해도 왠간해서 8버젼 관련 예제들도 많이 있기 때문에..
다만, 구글이 더이상 8버젼대는 업그레이드를 안하는게 이슈이긴 합니다.
그래서 최근에 9버젼 용으로 개인 프로젝트 들을 컨버팅을 하곤 있는데. 생각보다 러닝 커브가 있는것 같습니다.
기존에 8버젼하시다가 9버젼으로 개발하셔야 된다면 많은 시행착오가 있을것 같아 처음부터 9버젼 예제와 소스를 가지고 공부하실게 아니시라면 8버젼을 당분간 계속 고수 하시는게 어쩌면 더 낫지 않을까 하는 생각도 듭니다.
막상 까보면 기능 면에서는 별반(?) 차이가 없어서.
또한 8버젼에서 사용했던 수 많은 특이 케이스에 대해 9버젼 에 관련된 문서가 굉장히 희박합니다.&nbsp;
단순 쿼리야 아래 화면에서 볼수 있지만 예를 들어, 로그인을 할때 세션을 계속 유지시키는 기능이 있는데 9버젼용 예제가 어디에도 없습니다.
9버젼에 맞는 Cloud function(node.js) 예제도 희박합니다.
Vue3도 마찬가지 일듯 합니다.
관련 npm library도 Vue3용만 사용할수 있는거 Vue2용까지만 맞는거 이렇게 나누어져 있어 편의성 면에서는 Vue2를 당분간은 고수하시는게 어떨까 합니다.&nbsp;
조금 더 시간이 흘러 왠관해서는&nbsp; Vue3용 Library만 있어 Vue3로 갈아타지 않으면 답답할 즈음에 갈아 타시는게 좀더 낫지 않을까 하는 제 짧은 답변이 될것 같습니다.
<img style="float: left;" src="https://cdn.inflearn.com/public/comments/052a85f9-b64e-48f7-841b-6df0e006d7b6/Screen Shot 2022-02-04 at 8.41.14 PM.png" />
&nbsp;
&nbsp;
&nbsp;

yarn remove node-sass
yarn add sass@1.36.0
&nbsp;
이렇게 하시면 됩니다.
혹시 맥에서 사용하시는데 권환 에러가 나면 앞에 sudo yarn add sass@1.36.0 하시면 됩니다.
윈도우 이신데 권환 에러가 나신다면 관리자 command 창에서 실행하시면 되구여~~~ ^^
&nbsp;
ps. 아마 특정 컴퓨터 환경에서만 작동이 안되는듯 합니다 -.-;; 맥북 m1 칩은 무조건 node-sass를 사용하면 안되는것 같구여&nbsp;
&nbsp;

node-sass 때문에 서버실행이 안됩니다

혹시 몰라 공유 드린 github 소스를 보니 아래와 같이 정상적으로 되어 있어서 예제 소스랑 비교 해보시면서 해보시면 좋을듯 합니다 ^^
https://github.com/david-inflearn/david-zzang/blob/main/src/views/pages/Table2.vue
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Menlo, Monaco, 'Courier New', monospace; font-size: 12px; line-height: 18px; white-space: pre;"><a-table :columns="columns" :data-source="data"></div>
&nbsp;
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Menlo, Monaco, 'Courier New', monospace; font-size: 12px; line-height: 18px; white-space: pre;">
<div>data() {</div>
 
<div>return {</div>
 
<div>...</div>
 
<div>data: [],</div>
<div>...</div>
<div>}</div>
<div>};</div>
</div>
&nbsp;
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Menlo, Monaco, 'Courier New', monospace; font-size: 12px; line-height: 18px; white-space: pre;">
<div>
<div style="line-height: 18px;">
<div>onAddData() {</div>
<div>var db = firebase.firestore();</div>
<div>var self = this;</div>
<div>var user = firebase.auth().currentUser;</div>
<div>if (user) {</div>
<div>db.collection("bbs")</div>
<div>.add({</div>
<div>uid: user.uid,</div>
<div>name: self.name,</div>
<div>age: self.age,</div>
<div>address: self.address,</div>
<div>img: self.img,</div>
<div>})</div>
<div>.then(function (mRef) {</div>
<div>var _t = {</div>
<div>uid: user.uid,</div>
<div>name: self.name,</div>
<div>age: self.age,</div>
<div>address: self.address,</div>
<div>img: self.img,</div>
<div>};</div>
<div>_t["key"] = mRef.id;</div>
<div>self.data.push(_t);</div>
<div>});</div>
<div>}</div>
</div>
</div>
</div>

is not defined

아래 내용은 모르셔도 예제만 따라 하시면 될것 같아서 굳이 설명을 드리지 않았는데 여기에 말씀 드리도록 하겠습니다.
<div style="box-sizing: border-box; overflow-x: auto; color: #abb2bf; background-color: #282c34; font-family: D2Coding, Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">firebase.firestore()</div>
-> firebase.firestore 는 Google 에서 만든 database인 firestore 의 instance 객체 정보 입니다.
<div style="box-sizing: border-box; overflow-x: auto; color: #abb2bf; background-color: #282c34; font-family: D2Coding, Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">firebase.auth().currentUser</div>
-> firebase 안에 firestore는 db instance 이고 auth는 로그인 되어 있는 세션 instance 정보 입니다.
이 의미는 현재 firebase auth 를 통해 로그인한(구글이든,일반 이메일이든) 사용자 의 정보(이메일, 패스워드 등등) 에 대한 내용을 return 하는데 보통 해당 문장은 현재 로그인이 된 사용자가 있냐 없냐로 주로 사용한곤 합니다.
로그인 하지 않는 상태면 currentUser 값은 null 이라서요
<div style="box-sizing: border-box; overflow-x: auto; color: #abb2bf; background-color: #282c34; font-family: D2Coding, Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">db.collection</div>
-> db.collection 는 firestore라는 db를 collection이라고 구글에서 명시를 해놔서 저렇게 사용을 하면 구글 db 관련 제어를 할때 사용을 한다고 보시면 될듯 합니다.
자세한건 제가 강의내용에도 명시되어 있고 구글 문서에도 상황별(추가,삭제, 업데이트) 로 아주 아주 자세하게 나와 있어서 아래 링크 추가 참고하시면 될듯 합니다.
https://firebase.google.com/docs/firestore/manage-data/add-data#web-version-8
&nbsp;
그리고 위에 에러는 보시면 <a-table> 에 담길 :data-source를 "data" 라는 array를 참고 하겠다라고 적으셨는데 실제 변수 선언한데를 보면 data&nbsp; 라는 array가 없습니다.
&nbsp;
return {
 &nbsp; &nbsp; data: []
&nbsp;
이렇게 추가를 해주셔야 될듯 합니다. 
만약 users를 테이블에 담으실 용도였다면 :data-source="users" 라고 하시면 됩니다.
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;

David

Bài viết