생각하며 글을 쓰는 사람

이제 파이어베이스로 부터 데이터를 가져오는 방법을 배우겠습니다. 버전9로 진행을 하겠습니다. 이전에 시작하는 방법에 대해서 글을 썼습니다. 그 글에서 이어서 강의를 진행 하겠습니다. 파이어스토어에 들어가서 권한은 모두 접근할 수 있도록 풀어줍니다. 그리고 컬렉션은 blog로 하나 만들어주고 그 안에 임의로 데이터를 발행합니다. 임시로 서버를 띄워서 확인을 할 수 있습니다. 콘솔창에서 데이터를 확인하려면 아래의 코드를 작성하면 됩니다. // 예전 8버전 const db = firebase.firestore(); db.collection('blog').get().then((결과)=>{ console.log(결과) }) // 새로운 9버전 import { initializeApp } from "https://..

오늘은 파이어베이스 호스팅을 임시로 실행하는 방법에 대해서 알아보겠습니다. 일반적으로 파이어베이스를 시작하게 되면 html, css, javascript 로 시작하게 됩니다. 그리고 js를 이용해서 파이어베이스 로직을 프로그래밍 하게 됩니다. 간단하게 html과 css를 이용해서 화면을 꾸미게 되고 js를 이용해서 뭔가 기능을 만들고 파이어베이스를 실행하려면 파이어베이스 호스팅 기능에서 뭔가를 실행해야 합니다. 그러면 아래와 같이 콘솔에서 시작하게 됩니다. firebase serve --only hosting 그러나 이것은 예전 8버전의 기능입니다. 신버전의 9버전의 실행방법은 아래와 같습니다. firebase emulators:start 그리고 firebase.json 파일을 수정해줘야 합니다. 아래와..

파이어베이스는 어떻게 시작할까요? 일반적으로 파이어베이스는 스마트폰 어플리케이션 개발자들이 빠른 시간안에 풀스택 개발자가 되기 위해서 이용하는 플랫폼입니다. Swift를 이용하여 아이폰 어플, java( 또는 코틀린 )을 이용하여 안드로이드 어플은 일반적으로 클라이언트라고 하고... 이 어플이 동작하기 위해서는 서버가 필요하게 되겠죠? DB도 필요하구요 자바를 이용하여 스프링으로 백엔드를 할것인지? node.js를 이용하여 express를 할것인지? 장고를 할것인지? 루비 온 레일즈로 할것인지? 복잡합니다. 만약 1인 개발자로 시작해야 한다면 쉽지 않은 선택이지요~ 그러나 더 문제는 클라이언트 개발자가 데브옵스 지식을 가지는 것은 더 어렵습니다. 갑자기 트래픽이 증가하면 골치가 아프죠... 그러나 파이어..

저는 원래 파이어베이스를 공부했었고, 버전8로 시작을 했습니다. 그러나 이제 버전9를 구글에서 업데이트를 했고, 파이어베이스 공식 문서를 보면 " Firebase는 한 번의 주요 릴리스 주기 후에 이 버전에 대한 지원을 제거하므로... 새 앱은 대신 버전 9를 채택해야 합니다. " 라고 적혀 있습니다.... 배포되어 있는 8버전은 돌아가겠지만 정식지원은 9버전 위주로 진행을 할 것 같습니다. 그래서 9버전에 대한 내용을 정리하려고 합니다. 우리가 흔히말하는 '웹서버'는 그냥 데이터 꺼내달라고 하면 데이터 꺼내주는 기계입니다. 버전 9 는 webpack 또는 Rollup 과 같은 최신 JavaScript 빌드 도구를 사용해서 파이어베이스 크기를 줄이고 효율성을 높이는 모듈식 접근 방식을 사용합니다. 앱에서..

오늘은 파이어베이스에 글과 이미지를 업로드 해보겠습니다. 1. 먼저 글을 업로드 해보겠습니다. 텍스트입력을 받을 html 을 작성합니다. 그 다음에는 html에 담겨진 정보를 javascript로 읽고, 파이어베이스 함수 add에 담아주면 됩니다. document.querySelector('.blog__submit').addEventListener('click', function () { //querySelector를 이용해서 blog__submit을 가져오고 //addEventListener를 걸어줍니다. //즉 버튼을 클릭시 function 안을 실행하라는 의미입니다. const blogContent = { title: document.querySelector('.blog__title').value,..

파이어베이스 파이어스토어(firestore)에 데이터를 저장하는 방법에 대해 알아봅니다. 만약 blog 라는 컬렉션을 만들고 문서(도큐먼트) 이름은 content1로 하고싶다면 1. 기본적으로 저장하는 방법은 아래와 같습니다. const db = firebase.firestore(); db.collection('blog').doc('content1').set( { title : '첫번째 블로그 글', user : userInfo, content : '블로그의 글 ~~~~', date : new Date(), } ) 내용은 객체의 형태로 저장하면 저장하면 됩니다. 2. 만약 문서(document) 이름을 따로 저장하기가 귀찮으면, 자동으로 부여되게 할 수 있습니다. const db = firebase.fi..

파이어베이스 콘솔에서 파이어스토어(Firestore)에 데이터를 저장하는 방법과 자바스크립트로 불러오는 방법을 이전 글에서 공부를 했습니다. 이제는 데이터를 불러와서 콘솔창에 찍어볼 수 있습니다. 자 그렇다면... html에 데이터를 보내줘서 웹사이트에 보이도록 해야하지 않겠습니까? 어떻게 할까요? 일단 user 컬렉션에 있는, 두명의 유저를 불러와서 html 에 삽입을 해보겠습니다. 유저의 정보는 email 과 name 으로 되어 있습니다. 1. 일단 유저의 정보를 넣을 수 있는 빈 박스를 넣어줘야 합니다. 클래스명은 myContent로 해줍니다. 2. 유저 정보를 읽어와서 반복문을 돌려줍니다. const db = firebase.firestore(); db.collection('user') .get(..

파이어스토어 데이터 베이스는 기존의 관계형 데이터베이스와 다른 NoSQL 데이터 베이스를 가지고 있습니다. 그래서 초보자 분들도 쉽게 접근을 할 수 있습니다. 오늘 설명하고자 하는것은 파이어베이스 8 버전입니다. 프로젝트를 시작하고 파이어스토어로 들어가면 쉽게 조작을 할 수 있도록 되어있습니다. 결론부터 말씀을 드리면 파이어스토어는 컬렉션(collection)과 문서(document)로 이루어져 있습니다. 그리고 문서(document)에 key 와 value 값을 넣어주시면 됩니다. 컬렉션(collection)이 블로그라면 문서(document)에는 블로그 글이 하나씩 들어가게 됩니다. 컬렉션(collection)이 제품이라면 문서(document)엔은 제품이 하나씩 들어가게 되는 거죠! 문서(docum..

파이어베이스에서 새로운 프로젝트를 만든다. >> 콘솔에 들어가서 그냥 진행하면 됩니다. 그리고 터미널 창에서 아래의 명령어를 치고 firebase-tools를 설치를 해야합니다. 글로벌로 설치가 되는 것이므로 한번만 하면 됩니다. firebase-tools는 콘솔창에서 파이어베이스 프로젝트를 실행하고 설치하고 배포를 할 수 있도록 도와주는 창지 입니다. 구글에 있는 파이어베이스와 내 컴퓨터가 상호작용을 할 수 있도록 도와주는 것이죠!! $ npm install -g firebase-tools 터미널창에서 로그인이 안되어 있다면, 로그인을 하시면 됩니다. 로그인을 해야 뭔가를 할것 아니겠습니까? 아래의 명령어를 치면 여러가지 화면이 뜨고 로그인을 할 수 있게 됩니다. 차근차근 진행을 하시면 됩니다. $ f..