파이어베이스, SPA

• 파이어베이스

: 구글에서 제공하는 클라우드 기반의 baas 플랫폼
: 서버나 API 관리 없이 애플리케이션 백엔드 부분 구현 가능

• 파이어베이스 제공 서비스

1. Cloud Firestore : NoSQL 데이터베이스

2. Authentication: 사용자 인증 서비스

3. Cloud Storage: 사용자가 파일을 업로드하고 다운로드 받을 수 있게 해주는 클라우드 서비스

4. Hosting: 웹 앱 호스팅 서비스, 정적인 파일들을 빠르고 안전하게 전달

5. Cloud Functions: 서버리스 환경에서 백엔드 로직을 실행하게 함

• 파이어베이스 사용 이유

1. 백엔드 개발 지식이 없어도 사용 가능
2. 백엔드 인프라 관리 : 서버관리, 데이터베이스 최적화, 인증 시스템 구측 등필요 없음
3. 실시간 기능 제공 : 실시간 데이터베이스와 실시간 기능을 통해 채팅이나 피드 업데이트와 같은 기능 구현 가능
4. 확장성 : 자동으로 스케일링

• SPA

: 단일 페이지 애플리케이션

: 전통적인 웹페이지 - 페이지 이동 시 서버에서 새로운 HTML을 로드하여 페이지 새로 고침

: SPA 웹페이지 - 새로고침 없이 필요한 부분만 업데이트 (서버에 HTML을 요청X Javascript가 새로운 HTML을 만들어서 필요한 부분 교체)

• SSR의 장단점

1) 장점

• 초기 로딩 속도 : 서버에서 랜더링된 완성된 HTML을 클라이언트에 전송하기 때문에, 초기 페이지 로딩 속도가 빠르다.

• SEO 최적화 : 랜더링된 완성된 HTML을 클라이언트에 전송하므로, 검색 엔진이 쉽게 크롤링 할 수 있다.

• 호환성 : 모든 브라우저에서 동작

2) 단점

• 서버 부하 : 각 사용자 요청마다 서버에서 렌더링 작업을 수행해야 하므로, 서버 부하가 클 수 있음

• 사용자 인터랙션 : 동적인 페이지 요소를 구현하기 위해 추가적 자바스크립트 코드 필요

• CSR의 장단점

1) 장점

• 서버 부하 감소 : 랜더링 작업이 클라이언트에서 수행

• 사용자 인터렉션

• 속도 최적화 : 초기 로딩 후 전체적인 페이지 전환 속도가 빠름

2) 단점

• 초기 로딩 속도: 클라이언트에서 자바스크립트를 다운로드하고 실행한 후 랜더링을 진행해야 하므로 초기 로딩 속도가 느려짐

• SEO 최적화 문제: 검색 엔진이 자바스크립트를 실행하지 않은 경우, 랜더링되지 않은 페이지를 크롤링하게 되어 SEO에 불리할 수 있음

• 클라이언트 자원 사용: 성능이 낮은 기기에서 페이지 로딩 속도와 반응성 문제

• 호환성 문제 : 자바스크립트 기반, 호환성 문제