묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
영화목록 component 만들기 에서 질문이 있습니다.
영화목록 컴포넌트 만들기 영상에서 Movies 컴퍼넌트로 분리할때좋아요 버튼 작동이 안되니까 handleLike 함수를프롭스로 넘겨주는데요. 영상에서는 잘 되는데동일하게 소스도 쳐보고 올려주신 github 소스도 가지고 와서 붙여넣어봐도 console창에서는 data 안의 likeCount 값이 버튼을 클릭하면 변경되는게 보이는데 실제로 화면에서는 변경이 되지 않습니다. 왜 그럴까요. 그리고 작동이 되는 게 영상에서도 보이는데, 저한테는 왜 안되는지도 궁금합니다. ;;;; 아래 .toUpperCase() 도 저는 왜 실행이 안될까요.;;
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
"hello".toUpperCase() 가 안되는데요.
너무 첫 부분이라 민망하긴 한데요.강의 영상에서는 "hello".toUpperCase() 라고 하니까HELLO로 잘 변환되는데제가 직접해보니 그 부분 값이 아예 공백으로 표시가 됩니다. 개발자모드로 봐도 소스에 아예 비워져서 나가더라구요.스크립트 부분에 let text="hello"로 하고 html 부분에서 text.toUpperCase라고 쓰니까 또 잘되고요.이거 왜 이런가요? 궁금합니다.
-
미해결[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
포그라운드 앱 작동 관련 문의,
안녕하세요 선생님,올려주신 두 강의 모두 잘 보고 있습니다. 제가 flutter flow를 통해 만든 앱의 경우 앱이 백그라운드로 전환된 상태에서도 작동이 계속 되도록 하고 싶습니다(음악플레이어처럼)해당 기능을 flutter flow로 구현이 가능할까요? 현재 여러 방식을 트라이 해봤으나 정상적인 작동이 안되고 계속 꺼지네요,, 혹시 방법을 아시는지요?
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
날짜 포매팅 관련 질문
현재 날짜를 포매팅하는 함수는 아래와 같습니다,const formatDate = function() { return new Date().toLocaleDateString('ko-KR', { year: 'numeric', month: 'long', day: 'numeric', weekday: 'long', }); }위 함수는 현재 기준으로 날짜를 포매팅해주기 때문에 db에서 불러온 일기 날짜들이 모두 오늘 날짜로 포맷팅 되는 문제가 발생하는 것으로 이해했습니다. 따라서 파라미터로 받은 날짜를 포맷팅 해주도록(일기 쓰기 부분에선 위 함수가 필요하니 별도의 함수로 구현) 수정해야 할 것 같은데 제가 잘못 이해한 부분이 있을까요??
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
삭제 후 홈으로 돌아가는 코드 관련 질문
안녕하세요, "delete로 글 삭제하기" 강의를 듣던 중 궁금한 점이 생겨 질문드립니다. 삭제 후 다시 supabase에서 글 목록을 조회하고, 조회한 글들로 홈 화면의 게시글 목록을 구성하기 위해 goto 대신 location.reload() 함수를 사용하신 내용을 이해했는데요, 홈 화면에서 삭제하는 경우가 아닌 글 조회 후 /read/{diary_id} 경로에서 삭제 버튼을 누르게 되면 해당 경로에서 reload가 되기 때문에 문제가 발생하지 않나요? 따라서 말씀하신 location.reload() 대신 location.href = '/' 만 사용할 수 있는것이 아닌지 여쭤봅니다,감사합니다!
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
채팅기능 getAllUsers 질문드립니다.
Error: async/await is not yet supported in Client Components, only Server Components. This error is often caused by accidentally adding 'use client' to a module that was originally written for the server.이라는 에러가 뜨고 유저리스트가 빈배열 리턴되는데 이런 경우 어떻게 처리해야하나요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
무한 스크롤 시 화면 위치 문제
무한 스크롤 구현 중에, 스크롤을 내리면 자연스럽게 다음 페이지로 이어지는 게 아니라, 한번 아래로 내려갔다가 다시 스크롤했던 위치로 돌아옵니다. 이 문제는 어떻게 해결할 수 있을까요?
-
해결됨Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
7.2 구글 로그인 1 - AuthUI 구현 구글 로그인 관련 질문드립니다.
'use client'; import React, { useEffect, useState } from 'react'; import { Auth } from '@supabase/auth-ui-react'; import { ThemeSupa } from '@supabase/auth-ui-shared'; import { createSupabaseBrowserClient } from '@/lib/client/supabase'; import useHydrate from '@/app/hooks/useHydrate'; const AuthUI = () => { const supabase = createSupabaseBrowserClient(); const isMount = useHydrate(); const [user, setUser] = useState(); const getUserInfo = async () => { const result = await supabase.auth.getUser(); console.log(result); if (result?.data?.user) setUser(result?.data?.user); }; const handleLogout = async () => { supabase.auth.signOut(); window.location.reload(); }; useEffect(() => { getUserInfo(); }, []); if (!isMount) return null; return ( <section className="w-full"> <div>{user ? `로그인 됨${user?.email}` : '로그아웃'}</div> <> {user && ( <button onClick={handleLogout} className="border-2 border-black"> 로그아웃 </button> )} </> <div className="mx-auto max-w-[500px]"> <Auth redirectTo={process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO} supabaseClient={supabase} appearance={{ theme: ThemeSupa }} onlyThirdPartyProviders providers={['google']} /> </div> </section> ); }; export default AuthUI; {"code":400,"error_code":"validation_failed","msg":"Unsupported provider: provider is not enabled"}구글 로그인 시 해당 에러가 발생합니다 설정 같은 부분은 강의에 맞게 설정하였습니다
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
Next.js 15에서 Material Tailwind 설정
# Material Tailwind 와 연관된 라이브러리 설치 npm install @emotion/react @emotion/styled @material-tailwind/react @mui/icons-material --savenpm install @tailwindcss/typography autoprefixer --save-dev 지난주 공개된 next.js 15에서 Material Tailwind 설정하려니 안되서 도움 부탁드립니다.아직 초보라 이런 부분들이 개인적으로 좀 어렵네요~~^^;
-
미해결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 은 어떻게 사용하고 계신지 궁금합니다!감사합니다!