묻고 답해요
140만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
7.2 강 구글 로그인 1 강좌에서 redirectTo 로 설정해도 이동이 안되요.
강좌 잘 보고 있습니다. package.json 버전은 모두 같습니다.강좌에 있는데로 모두 supabase.com 에서 셋팅을 했습니다.구글 로그인 코드도 다 정상 작동이 되는데 http://localhost:3000 으로 이동을 하네요. Redirect URLs 에는 http://localhost:3000/auth 로 작성해 둔 상태입니다. ㅠㅠ; "use client"; import useHydrate from "@/hooks/useHydrate"; import { createSupabaseBrowserClient } from "@/lib/client/supabase"; import { Auth } from "@supabase/auth-ui-react"; import { ThemeSupa } from "@supabase/auth-ui-shared"; import { useEffect, useState } from "react"; export default function AuthUI() { const [user, setUser] = useState(); const supabase = createSupabaseBrowserClient(); const isMount = useHydrate(); const getUserInfo = async () => { const result = await supabase.auth.getUser(); console.log(result); }; useEffect(() => { getUserInfo(); }, []); if (!isMount) return null; return ( <section className="w-full"> <div className="mx-auto max-width-[500px]"> <Auth // redirectTo={process.env.NEXT_BUBLIC_AUTH_REDIRECT_TO} redirectTo="http://localhost:3000/auth" supabaseClient={supabase} appearance={{ theme: ThemeSupa, }} onlyThirdPartyProviders providers={["google", "github"]} /> </div> </section> ); }
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
OnDestroy() 위치 질문
안녕하세요,강의에서 메모리 절약을 위해 인터벌을 제거하는 내용을 듣던 중 궁금한 점이 생겼는데요 만약 이벤트창이 닫혔을 때 인터벌을 종료시키고 싶다면 App.svelte가 아닌 Event.svelte 내에 OnDestroy를 작성해주면 되는거겠죠? App.svelte에 OnDestroy를 작성하신 이유는 이벤트 인덱스를 증가시키는 로직과 이벤트 텍스트 관리를 App.svelte에서 하고있으니 이벤트 창이 열리거나 닫힌 여부와는 상관 없이 App.svelte가 살아있는 동안에는 계속 이벤트배열 인덱스를 증가시키기 위해라고 이해했는데 제가 이해한 내용이 맞을까요??
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
smtp 사용
안녕하세요! 강의 잘 듣고있습니다.강의를 듣던 중 cannot be used as it is not authorized 라는 오류가 떠서 찾아봤는데 supabase에서 SMTP설정이 필수적으로 정책이 변경된 것 같아요.
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
카카오 로그인 관련
카카오 로그인 까지 구현 후vercel에 배포 까지 한 상태이고 아직 도메인은 등록 하지않았습니다만집에서 할 때는 vscode로 로컬 서버를 열어놔서 몰랏었는데 로컬 서버를 열어놨을 때는 잘되지만밖에서 제가 vercel에 배포한 사이트를 들어가서 카카오 로그인을 시도해보니 localhost에서 연결을 거부했습니다. ERR_CONNECTION_REFUSED 에러가 나오는데 어디가 문제 인걸까요? ㅠ
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
build 오류
$ npm run build > instagram-clone@0.1.0 build > next build ▲ Next.js 14.2.12 - Environments: .env Creating an optimized production build ... ✓ Compiled successfully Linting and checking validity of types .Failed to compile. Linting and checking validity of types ...next/types/app/page.ts:8:13 Type error: Type 'OmitWithTag<typeof import("D:/Study/React/next/Supabase/instagram-clone/app/page"), "config" | "generateStaticParams" | "revalidate" | "dynamic" | "dynamicParams" | "fetchCache" | "preferredRegion" | ... 6 more ... | "generateViewport", "">' does not satisfy the constraint '{ [x: string]: never; }'. Property 'matadata' is incompatible with index signature. Type 'Metadata' is not assignable to type 'never'. 6 | 7 | // Check that the entry is a valid entry > 8 | checkFields<Diff<{ | ^ 9 | default: Function 10 | config?: {} 11 | generateStaticParams?: Function빌드할때 오류뜹니다.next 안에 있는 오류인데 지웠다 다시 해도 똑같아요어떻게 해야 할까요??
-
미해결[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
카카오 로그인 질문
Error: The given sign-in provider is disabled for this Firebase project. Enable it in the Firebase console, under the sign-in method tab of the Auth section. 강의 내용대로 설정을 마치고 실행을 했더니 위와같은 오류 메시지가 나타납니다.로그인 버튼을 누르면 새창이 열리다가 종료되면서 해당 메시지가 보여집니다.어떤 부분을 더 확인해봐야 할까요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
채팅 관련 부분, useInfiniteQuery
안녕하세요, 채팅 관련 부분에, reverseInfiniteQuery를 적용할 수 있을 것 같아, 도전해보던 찰나에 잘 안되어서 질문드립니다!!혹시 역무한스크롤 방식으로 할 수 있는 방법이 있을까요??보통 실무에서 채팅을 어떠한 방식으로 구현하는지 매우 궁금합니다.1. 역무한 스크롤 방식2. 계속해서 refetch를 하는 방식
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
Supabase smtp 추가 강좌 계획
안녕하세요, Supabase 인증강좌를 너무 잘 들었습니다!혹시 smtp 추가 강좌는 언제 추가 될 예정인지 알 수 있을까요??또 추가적으로, Supabase에 큰 관심이 생겨서, 학습해보면서, 개인 블로그를 제작해보고자 하는데 보통 서버비용을 얼마정도로 예상하면 될지, 뭔가 요금 같은거를 대시보드 형태로 쉽게 볼 수 있는 방법이 있는지도 궁금합니다!
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
유효성 검사 누락된 부분...
회원가입과 로그인 기능에서 이메일 형식과 비밀번호 최소 길이 등에 대한 유효성 검사를 추가해 주실 수 있는지 궁금합니다. 현재 학습 중인데, 이 부분에 대한 자료를 추가로 올려주시면 감사드리겠습니다.
-
미해결[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
FF + supabase 사용 시 소셜로그인
안녕하세요 선생님! 앞에 다른 질문이 있었는데, 내용이 달라서 따로 질문 드립니다앞의 강의는 FF + firebase 에서 구글로그인뒤의 강의는 FF + firebase 에서 kakao 로그인이 있는데 FF + supabase 사용 시 다른 소셜로그인은 어떤식으로 하시는지 궁금합니다.감사합니다.
-
미해결[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
플러터플로우 / supabase 사용 시 push 는 어떻게 하시는지 궁금합니다
안녕하세요 선생님! 강의 잘 보고 있습니다.궁금한게 있는데 혹시 FF + supabase 사용 시 push notification 은 어떻게 사용하고 계신지 궁금합니다!감사합니다!
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
npm run dev 오류 내용을 모르겠습니다
npm run dev 접속이 안되는데 무슨 오류인지 모르겠습니다전체 코드 따라했는데 이렇게 뜹니다layout? middleware? 이쪽 같아서 계속 건드려보다가 안되서 질문 남깁니다
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
강의 내용 중복
아래 두 강의 내용이 동일합니다. [인앱결제] 10. 플러터플로우-RevenueCat 연결 및 구현[인앱결제] 11. iOS에서 인앱결제 테스트하기
-
해결됨Firebase보다 10배 좋은 Supabase
npm error could not determine executable to run
https://join.slack.com/t/lopun-lecture/shared_invite/zt-2mkxcgt5h-7Bq~fMnMJ8Scle17fzFYCQ 영상에선 supabase 설치안했는데 npm i supabase 하니깐 실행되는데.. 누락된건가요 ?
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
$(리액티브선언문) 으로 setInterval과 clearInterval 를 작성 시 메모리 관련
영상 마지막 로직에 대해 질문드리려고 문의드립니다.onMount와 onDestory 함수로 setInterval과 clearInterval을 생명주기에 맞게 실행시키게되어 setInerval과 clearInterval을 한번씩만 실행시키는 거 같은데 $(리액티브선언문) 으로 setInterval과 clearInterval 를 작성 시setInterval과 clearInterval이 반복적으로 호출되어 생성되었다 지웠다 하는것 같아 보이는데이 방식이 메모리 영역에서 괜찮은건지 궁금합니다!<script> let intervalEventText; let eventIndex = 0; const eventText = [ "영화 정보 업데이트", "신규 영화 추가", "이벤트 진행중" ] import { onMount, onDestroy } from 'svelte' /** 리액티브 선언문 방식 */ $: { // 이벤트 인터벌 제거 clearInterval(intervalEventText); console.log(eventIndex) // 일정 시간 경과 후 eventIndex를 1 증가 intervalEventText = setInterval(() => { eventIndex += 1; if (eventIndex >= eventText.length) { eventIndex = 0; } }, 1000); } /** onMount & onDestory 방식 */ // onMount(()=>{ // intervalEventText = setInterval(() => { // eventIndex += 1; // if (eventIndex >= eventText.length) { // eventIndex = 0; // } // }, 1000); // }); // onDestroy(()=>{ // console.log(eventIndex) // clearInterval(intervalEventText); // }) </script> <p>{eventText[eventIndex]}</p>
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
getPublicUrl로 이미지 URL 받는 방법?
getImageUrl을 얻는 방식을 강의 방식이 아닌 getPublicUrl을 사용해서 얻으려면 어떻게 해야 하나요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
reactQuery와 supabase의 channel등
reactQuery의 queryFn : ['users']supabase의 channel의const channel = supabase.channel("online_users", {부분users와 online_users의 쓰임새를 모르겠습니다.queryFn : ['users', userId]를 하면 useEffect의 의존성 배열처럼 userId의 값에 따라 실행되는게 맞나요?그럼 'users'는 뭔가요? 구조가 잘 와닿지 않습니다.ㅜㅜconst channel = supabase.channel("online_users", {도 "online_users"라는 이름값을 다른곳에서 사용할 때 쓰임새가 있는건가요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
Nextjs14 에서의 react query사용의 필요성
리액트 쿼리를 사용하면 결국 client side fetching이 됩니다. nextjs13부터 server side fetching이 가능해지고 suspense를 활용한 data streaming은 데이터펫칭에서 새로운 패러다임을 제시했다고 생각합니다. 굳이 리액트 쿼리를 사용할 이유가 있을까요?
-
해결됨Firebase보다 10배 좋은 Supabase
'[풀스택 완성] Supabase로 웹사이트 3개 클론하기 심화 강의' 3만원 쿠폰
"Firebase보다 10배 좋은 Supabase" 무료강의 수강하면 쿠폰수령 가능하다는데, 어떻게 받나요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
Client provider in layout.tsx - 어떻게 동작하나요?
강사님 강의를 이제 막 듣기 시작한 수강생입니다!지금 리코일 기본 문법 관련 강의를 듣던중 궁금증이 생겨 질문드립니다.클라이언트 페이지 하위의 페이지는 모두 클라이언트 페이지로 바뀌는 것으로 이해하고 있었는데전역에 리코일 프로바이더로 감싸주는 형태로 사용하게 되면 부분적으로 클라이언트 페이지가 되는 것인가요?!어떻게 이해하면 좋을지 궁금합니다!