전체 정리 - chungstar/hansei-study2 GitHub Wiki
- 블로그란?
web + log = blog
정보 공유나 의견 교환을 목적으로 올리는 글을 모아 월드 와이드 웹상에 게시하는 웹사이트의 일종
- 블로그의 종류
서비스형, 설치형
지역은 northeast3
npm install -g firebase-tools
설치가 완료되면 다음을 입력한다.
firebase login
로그인 창이 뜬다. 로그인을 해준다.
firebase init
밑줄을 선택해서 설치
나머진 기본으로 선택
y/n 선택하는건 n
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-storage.js"></script>
<script>
var firebaseConfig = {
apiKey: "your apiKey",
authDomain: "your authDomain",
projectId: "your projectId",
storageBucket: "your storageBucket",
messagingSenderId: "your messagingSenderId",
appId: "your appId",
measurementId: "your measurementId"
};
firebase.initializeApp(firebaseConfig);
</script>
윈도우에서 허가되지 않은 스크립트입니다라고 에러가 뜨면 시작 메뉴에서 powershell 검색 후 관리자 권한열고 Set-ExecutionPolicy Unrestricted 라고 입력
규칙 설정
데이터베이스 콘솔에서 false를 true로 변경
db.collection('콜렉션 이름').get(): 콜렉션에 저장되어있는 데이터를 가져온다.
<script>
const db = firebase.firestore();
db.collection('post').get().then((i)=>{
i.forEach((doc)=>{
console.log(doc.data())
})
})
</script>
데이터를 저장하기위해선 add와 set을 주로 사용한다.
const db = firebase.firestore();
db.collection('콜렉션 이름').doc('doc').set({ title : '~~~~~' })
set은 문서를 지정해서 저장
const db = firebase.firestore();
db.collection('콜렉션 이름').add({ title : '~~~~~' })
그냥 add만 써도 자료를 저장할 수 있는데 이 경우 document의 이름은 자동으로 부여
query로 원하는 문서만 가져오는 방법
컬렉션 또는 컬렉션 그룹에서 검색할 문서를 지정하는 강력한 쿼리 기능 where()를 사용하면 원하는 문서만을 가져올 수 있다. 필터링할 필드, 비교 연산, 값의 3가지 매개변수를 가진다. 아래는 지원하는 연산자
예시
- 검색
- 카테고리 추가 및 카테고리에 따른 정렬
- 구글 애널리틱스 활용하여 방문자통계
- 깔끔한 디자인
- 본문삭제가 까다로움-> 컬렉션 삭제가 어려움
- 알림기능 추가
- 코드 최적화, 모듈화
- Html css 구조 통일