Day26_Supabase

정소현·2024년 8월 21일
0

스파르타

목록 보기
30/50

BaaS플랫폼

  • Firebase : Google이 운영하는 플랫폼, 실시간데이터베이스, 사용자인증, 애널리틱스를 쉽게 이용할 수 있다.
  • Parse : 자유도가 높은 오픈 소스 BaaS로, 커스터마이징이 가능해 많은 개발자한테 사랑받고 있음
  • AWS Amplify : 강력한 AWS 클라우드 기반, 복잡한 백엔드 작업을 손쉽게 할 수 있게 도와줌

장단점

장점
1. 개발속도가 빨라짐
2. 유지보수 간편
3. 자동확장

단점
1. 유연성 부족
2. 비용 예측 어려움
3. 플랫폼 의존성

Supabase

supabase는 PostgreSQL을 기반으로 하는 오픈 소스 BaaS 플랫폼
Firebase의 대안으로 자리잡음, 관계형 데이터베이스를 사용하면서도 실시간 기능을 원하는 개발자들 사이에서 인기를 끔

  • 관계형 데이터베이스?
    엑셀처럼 열과 행이 존재한다.

Supabase의 개념

  • PostgreSQL을 사용하여 관계형 데이터를 관리하면서도 실시간으로 데이터 변화를 감지하고 반응할 수 있는 기능을 제공
  • 데이터베이스 업데이트가 필요할 때마다 사용자 인터페이스가 자동으로 반응하여 변경사항을 보여줌

Supabase 사용이유

  • Firebase의 실시간 데이터베이스 기능을 똑같이 제공
    주식거래 플랫폼, 실시간 대시보드, 협업 도구 등 실시간 데이터 처리가 중요한 어플리케이션 개발에 매우 유용하다.

React에서 사용하기

  1. supabase추가
yarn add @supabase/supabase-js
  1. supabase홈페이지에서 새로운 프로젝트 생성 table에서 column추가
  2. src 아래 supabaseClient.js 생성
  3. supabase API docs Introduction 에서 APIKEY연결
  4. src > components 에 fetch데이터
  5. useEffect()를 사용해 fetch 연결
import React from "react";
import { useEffect } from "react";

const FetchData = () => {
  useEffect(() => {
    const fetchData = async () => {
      const { data, error } = await supabase.from("NBCAMP_SAMPLE");
      if (error) {
        console.log("error=>", error);
      } else {
        console.log("data=>", data);
      }
    };
  }, []);
  return <div>FetchData</div>;
};

export default FetchData;

🌟 오늘 느낀 점

전보다 로직들을 작성하고 쓰는데 익숙해진 것 같다
하면서도 계속계속 까먹고 그런 일상이 반복이지만...ㅎㅎ
머릿속에서 뿅뿅 떠오르는 날이 오지않을까!!!

0개의 댓글