일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- 리액트 프로젝트
- 파이썬 enumerate
- 파이썬 for in
- 내일배움캠프
- 리액트 훅
- 타입스크립트 리액트
- 코딩테스트
- 자바스크립트
- js
- 파이썬 반복문
- 타입스크립트 props
- typeScript
- 파이썬 list
- 한글 공부 사이트
- 타입스크립트
- 프로그래머스
- 내배캠 프로젝트
- JavaScript
- 리액트
- 내일배움캠프 프로젝트
- useState
- 파이썬 slice
- Next 팀 프로젝트
- 리액트 페이지 이동
- 리액트 팀 프로젝트
- 그리드 정렬
- React Hooks
- 파이썬 for
- 내일배움캠프 최종 프로젝트
- REACT
- Today
- Total
aotoyae
[React/TS] supabase 시작하기 + Type Script 본문
패키지 설치
npm i @supabase/supabase-js
.env 에 키 넣기
VITE_SUPABASE_URL= URL
VITE_SUPABASE_KEY = KEY
config.ts
process.env 가 아니라 import.meta.env 로 호출
import { SupabaseClient, createClient } from '@supabase/supabase-js';
const supabaseUrl = import.meta.env.VITE_SUPABASE_URL as string;
const supabaseKey = import.meta.env.VITE_SUPABASE_KEY as string;
export const supabase: SupabaseClient = createClient(supabaseUrl, supabaseKey);
Supabase 클라우드 스토리지로 CRUD React 애플리케이션을 구축하는 방법 – All Things N
React의 활용은 개발자가 웹 애플리케이션의 인터페이스를 구성하는 방식을 크게 변화시켰습니다. 컴포저블 구조와 선언적 언어는 상호작용적이고 생동감 넘치는 사용자 인터랙션을 제작할 수
new.atsit.in
🔗 https://velog.io/@liabin124/React-%EC%B5%9C%EC%A2%85-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-Supabase2
[최종 프로젝트 - React with typescript] Supabase(2)_DB 가져오기
Supabase 패키지 설치 Supabase에 프로젝트를 만들었으니 이어서 패키지를 설치해주자. 나는 yarn을 사용하기 때문에 yarn으로 설치해줬다.
velog.io
🔗 https://www.peterkimzz.com/supasbase-overview
Firebase를 대체할 오픈소스 프로젝트, Supabase
Supabase는 구글 Firebase를 엔터프라이즈 레벨에서도 사용 가능하도록 만든 오픈소스 프로젝트이다. 현재는 베타 서비스이다.
www.peterkimzz.com
🔗 https://velog.io/@sanghyeon/NextJS-TypeScript-Supabase-%EC%84%A4%EC%A0%95
NextJS + TypeScript + Supabase 설정
NextJS 프로젝트에 supabase type 적용하기
velog.io
#4 supabase에서 데이터 불러오기
Supabase를 연결하고 데이터를 불러오자
velog.io
[Supabase] Supabase 로 백엔드 없이 Database 구축하기(기본 사용법)
[Supabase] Supabase 로 백엔드 없이 Database 구축하기(기본 사용법) 프론트는 토이프로젝트 시 공공 데이터를 이용하지 않는 이상 CRUD 를 경험해보기 쉽지 않다. `Firebase` 라는 좋은 서버리스 툴이 있지
ramincoding.tistory.com
'React' 카테고리의 다른 글
[React] input 체크박스 ERROR : You provided a `checked` prop to a form field without an `onChange` handler (0) | 2024.03.16 |
---|---|
[React] JSX 내 table 작성법 : thead, tbody 필수 (0) | 2024.03.15 |
[React] useSearchParams : 검색 기능, setSearchParams, ?search='' (0) | 2024.03.07 |
[React] 리다이렉트 : Navigate 페이지 이동 (0) | 2024.03.07 |
[React] * 와일드카드 : Route, 잘못된 주소 방지 (0) | 2024.03.07 |