자바스크립트 (20) 썸네일형 리스트형 AWS S3 이미지 업로드 with React 거두절미하고 바로 본론으로 들어가겠다. 우선 https://aws.amazon.com/ko/s3/에 접속해 계정을 생선한다. 계정 생성 후. 버킷 생성에 들어가 이름과 지역을 선택한다. 쭉 내려가다가 "이 버킷의 퍼블릭 엑세스 차단 설정"에서 모든 체크를 해제하고 만들기를 클릭한다. 이제 버킷이 만들어졌으면, 버킷을 하나 클릭한 후, 권한 > 버킷 정책에 { "Version": "2012-10-17", "Statement": [ { "Sid": "PublicListGet", "Effect": "Allow", "Principal": "*", "Action": [ "s3:List*", "s3:Get*" ], "Resource": [ "arn:aws:s3:::Your_Bucket_Name", "arn:aws:.. React)Discord 로그인 (with Supabase) 디스코드로 로그인하는 기능을 추가할 필요성이 있었기에 추가했다. 처음엔 클라이언트에서의 로그인만 되길 원했으나 아쉽게도 discord 개발자 문서에 자바스크립트는 node.js만 지원했다. 우선 nodejs로 로그인 하는 방법이다. 디스코드 개발자 포탈로 들어가서 앱을 만들어야한다. https://discord.com/developers/applications로 들어간다. Discord Developer Portal — API Docs for Bots and Developers Integrate your service with Discord — whether it's a bot or a game or whatever your wildest imagination can come up with. discor.. use-query)useInfiniteQuery를 사용해보자. 작업 도중 데이터가 누적되어 쌓일 경우 데이터를 가져오는 것에서 시간이 걸릴 것을 예상해 Infinity Scroll를 구현하려 한다. 원래라면 Debounce 등을 이용해 구현했겠지만, 이미 해당 기능에 대한 라이브러리가 존재했었고, 친절한 Tanstack팀은 use-query에 무한 스크롤 기능까지 만들어두었었다. 우선 use-query의 Infinite Scroll 기능인 useInfiniteQuery는 다음과 같은 형태를 띈다. const {data, isLoading, ..., fetchNextPage} = useInfiniteQuery(key,QueryFn, { ...Options, getNextPageParam:(lastPage, pages) =>{ return lastPage.nextPag.. use-query) queryClient.invalidateQueries가 동작하지 않을 때. useQuery와 useMutation을 사용하던 중, 에러가 발생했다. 에러는 Mutation이후 queryClient.invalidateQueries가 동작하지 않아 useQuery가 실행되지 않는 것. Mutation을 사용할 기능은 이미지를 저장하는 기능인데, 이미지를 File base로 변환 후 post를 보내면, mutation이후 get이 요청되는 것이 아니라, get요청 이후 post가 들어간다. 우선 queryClient.invalidateQueries가 동작하지 않는 몇몇 경우를 살펴보자 1.enabled를 사용했을때. 2. 오타 등의 이유로 Key값이 다를 때. 3.리렌더링 과정에서 queryClient가 stable하지 않을 때. 1,2,3)-https://stackoverflow... 이전 1 2 3 다음
