1. Vue와 Firebase로 개발하는 서버리스 PWA myBlog

PWA - myBlog

이제까지 공부한 것을 이용하여
Vue와 Firebase로 PWA를 개발합니다.
앱의 이름은 ‘byBlog’입니다.

Architecture Overview

서버는 없습니다.
백엔드 없이 프론트엔드 앱을 개발합니다.

1. Client Side: Vue.js (with Vuetify)
2. Backend as a Service: Firebase (Authentication, Firestore, Hosting)
   Authentication : 사용자 인증
   Firestore : 데이터베이스, profiles collection, posts collection
   Hosting : 웹앱 인터넷 서비스
3. PWA: Service Workers, Web App Manifest

앱의 구성

앱의 구성은 다음과 같습니다.

계정관리

1. 계정만들기 : 회원의 계정을 생성합니다.
2. 비밀번호 변경 : 비밀번호를 변경합니다.
3. 비밀번호 리셋 : 비밀번호를 잊었을 때 다시 설정합니다.
4. 로그인 : 사용자 로그인을 처리합니다.
5. 자동 로그인 : 로그아웃 하지 않고 앱을 종료하였다면 다음에 앱에 접속할 때 자동 로그인됩니다.
6. 계정 설정 : 회원의 정보를 설정합니다

글관리

1. 홈(글목록) : 홈페이지로 글의 목록을 보여줍니다.
2. 글쓰기 : 새글을 등록합니다.
3. 글수정 : 저자는 자신의 글을 수정할 수 있습니다.
4. 상세보기 : 글의 상세보기로 댓글과 답글도 볼 수 있습니다.
5. 댓글과 답글 : 상세보기에서 댓글을 쓸 수 있고, 댓글에 대한 답글을 쓸 수 있습니다.
6. 구독요청 : 저자에 대해 구독 요청을 할 수 있습니다.
7. 조회수 : 글을 상세보기한 회수입니다. 한 사용자에 대해 하루에 한번만 조회수를 증가시킵니다.
8. 블로그 : 각 저자의 글들만 모아 봅니다.
9. 구독 : 구독 중인 저자들의 글들을 모아 봅니다.
10. 독자 : 나를 구독하는 독자들의 목록을 보여 줍니다
11. 검색 : 검색어를 입력하여 검색어 포함하는 블로그의 목록을 가져옵니다.
12. 카테고리 관리 : 글쓰는 카테고리를 관리합니다.

푸시 알림

1. 알림 설정 : 알림을 요청하면 구독 저자가 새글을 저장하면 푸시 알림을 받을 수 있습니다.
2. FCM 보내기 : 클라우드에서 등록된 토큰에 대해 알림을 보냅니다.
3. FCM 받기 : 클라우드에서 보낸 알람을 받아 알림 정보를 팝업하여 보여줍니다.