개발실69 Vite에 firebase 셋팅하기 .env 파일을 생성후 환경변수를 추가해야한다. 리액트에서 .env를 사용할때 prefix로 REACT_APP_을 사용해야 환경변수를 사용할 수 있다. Vite를 사용한다면 아래의 코드처럼 VITE_ 를 사용해야 한다. VITE_API_KEY=your_api_key VITE_AUTH_DOMAIN=your_auth_domain VITE_PROJECT_ID=your_project_id VITE_STORAGE_BUCKET=your_storage_bucket VITE_MESSAGING_SENDER_ID=your_messaging_sender_id VITE_APP_ID=your_app_id Vite는 import.meta.env를 통해 환경 변수를 사용할 수 있도록 해준다. 그후 firebase sdk설정에서 f.. 2023. 10. 30. Javascript란 무엇인가? Javascript 정의 Javascript는 런타임에 컴파일되는 동적 약형 프로그래밍 언어이다. 동적 약형에 대해서는 아래의 더보기 클릭! 더보기 동적 약형을 설명하기 전에 먼저, 동적 타이핑과 약한 타이핑의 개념을 알아야 한다. 동적 타이핑 (Dynamic Typing) 변수의 타입이 실행 시간에 결정되는 언어의 특성이다. 즉, 변수를 선언할 때 변수의 타입을 명시하지 않아도 되며, 프로그램이 실행되는 도중에 변수의 타입이 변경될 수 있다. Python, JavaScript, Ruby 등이 동적 타이핑 언어에 속한다. 약한 타이핑 (Weak Typing) 다양한 타입의 값이 다른 타입의 값으로 자유롭게 변환될 수 있는 언어의 특성이다. 이런 언어에서는 명시적인 타입 변환 없이도 다른 타입 간의 연산이.. 2023. 9. 23. [React-Query v3] staleTime과 cacheTime staleTime은 데이터가 만료됐다고 판단하기전까지 허용하는 시간이 staleTime입니다. 웹사이트에 표시된 데이터가 10초정도는 그대로여도 괜찮다면 staleTime을 10초로 설정합니다. staleTime setup은 아래처럼 useQuery의 3번째 파라미터에서 설정해주면 됩니다. 참고로 useQuery의 3번째 파라미터가 useQuery의 옵션을 설정합니다. staleTime은 옵션중 하나입니다. const { data, isError, isLoading } = useQuery("posts", fetchPosts, { staleTime: 10000 }); //10초 staleTime과 cacheTime 차이점 staleTime은 refetching할때의 고려사항이고 cacheTime은 다시 사.. 2023. 1. 4. [React-Query v3] 리액트 쿼리 개발자도구(React Query Devtools) 셋업 index.js 에서 셋업을 합니다. react-query/devtools 에서 ReactQueryDevtools를 import 하여 Provider위에 작성해주시면 됩니다. import React from "react"; import ReactDOM from "react-dom"; import "./index.css"; import App from "./App"; import reportWebVitals from "./reportWebVitals"; import { QueryClientProvider, QueryClient } from "react-query"; import { ReactQueryDevtools } from "react-query/devtools"; const queryClient = .. 2023. 1. 4. 이전 1 2 3 4 ··· 18 다음