본문 바로가기
반응형

프로그래밍/React|Next.js13

SupaBase 사용해보기 With Nextjs 프론트에서 간단하게 사용할 수 있는 오픈소스 백엔드 서비스인 Supabase 를 사용해보려고 합니다. Supabase는 데이터베이스 ,클라우드, 호스팅, 스토리지, 인증, 실시간 데이터 기능 등 많은 기능을 제공하고 무료 가격도 널널한 편이기 때문에 사이드 프로제긑로 사용하기 적합다고 생각했습니다. SupaBase 이전에는 Firebase를 주로 사용했는데 SupaBase는 관계형 데이터 베이스이고 Firebase는 noSql의 차이점이 있습니다. Firebase 의 큰 단점이 비용과 복잡한 쿼리 처리에 제한이 있었습니다. 가장 큰 것이 비용인데 Firebase는 읽기/쓰기/삭제 비용으로 부담하지만 supabase는 저장된 데이터의 양에 따라 부과하고 속도도 supabase가 훨씬 빠릅니다 위 장단점 나.. 2024. 4. 14.
사용 안하는 디펜던시 파일 지우기 리액트를 하다보면 많은 라이브러리들을 사용하게 됩니다. 사용처에 맞게 라이브러리를 테스트 하면서 가끔 제거하는 것을 잊어버리고 package.json에 남게됩니다. 하나하나 검색해서 사용하는지 찾기가 번거롭기 때문에 사용안하는 디펜던시를 찾아주는 방법을 소개해 드립니다 설치 npm install -g depcheck 실행 depcheck 결과 이런식으로 사용안하는 라이브러리들을 보여주고 package.json에서 제거해주시면 됩니다. 감사합니다 2024. 4. 4.
[DeepDive] 1장 - 자바스크립트: 클로저와 스코프 자바스크립트를 하면서 클로저에 대한 이야기를 들어봤을 것 입니다. 클로저가 말로 설명하기에 난해한 정의 때문에 어려운 개념이라는 인식 이 있어서 다가가기가 쉽지 않으며 설명이 어려워 금방 잊어 버립니다. 특히, 면접 질문으로 자주 나오는데 어렴풋이 아는데 막상 설명하라고 하면 당황한 경험이 많이 있습니다. 까먹지 않기 위해 블로그로 다시 정리해보려고 합니다. 먼저 리액트에서 클로저를 빼놓고 설명할 수 없을 정도로 많은 관련이 있습니다. 함수형 컴포넌트 구조와 작동방식, 훅의 원리, 의존성 배열 등 모든 대부분이 클로저에 의존하고 있기 때문입니다. 그렇기 때문에 클로저를 꼭 알고 넘어가보도록 하죠 클로저란? MDN 사전적 정의로는 아래와 같습니다. 정의를 보고서는 절대 이해할 수 없을 것 같아요 클로저는 .. 2024. 3. 14.
[DeepDive] 1장 - 자바스크립트: 데이터 타입과 함수 자바스크립트 데이터 타입 원시타입 : 객체가 아닌 모든 타입 boolean number string null undefined symbol : 중복되지 않는 고유한 값을 나타내기 위함 bigint : ES2020에 나온 값으로 기존 number 최대 값보다 더큰 숫자를 저장 객체타입 : 원시타입 이외 모든 타입 object null 과 undefined 차이점은? undefined: 선언됐지만 할당되지 않는 값 null: 명시적으로 비어있음을 나타내는 값 자바스크립트의 또 다른 비교, Object.is ES6 에서 등장한 문법으로 두개의 인수를 받으며 동일한지 확인하고 반환하는 메서드이다. 좀 더 개발자가 기대하는 방향으로 동작한다는 점에서 == 와 === 와 다른 차이점이 존재한다. 자세한 차이점은 아.. 2024. 3. 11.
반응형