묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
todolist할때 컴포넌트 분리 안했던 것 같은데...
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다.강의보고 todolist할때 컴포넌트 분리 안했던 것 같은데...dropbox (선택수강)UI구축에 보면 supabase-todo-list vscode에 컴포넌트폴더에 ui컴포넌트 들이 있네요... 혹시 추가 작업을 하셨던 것일까요??
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
네이버 로그인 구현 관련 문의
안녕하세요! 이번에 카카오 로그인을 강의를 보고 적절히 구현할수 있게 되었습니다.다만 제가 생각하는 앱에 네이버 로그인도 같이 있으면 좋을것 같은데.. 혹시 어떤식으로 구현하면 좋을지 팁을 주실수 있을까요..? 추가적으로 플러터 플로우에 있는 app state의경우 원래는 영구저장이 안되지만, persist옵션을 선택하면 로컬에 저장이 가능하다고 하는데, 확신이 없어서요.. 혹시 제가 생각하는게 맞을까요??앱에 필요한 json형식의 데이터들을 로컬에 저장하고, 앱이 재시작해도 초기화 되지 않도록 구현하려고 합니다..!
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
customAction loginaction 에러
안녕하세요! 현재 플러터 플로우에서 카카오로그인을 구현하고 싶은 개발자 입니다.강의에서 말씀하신데로 코드를 붙혀넣고, 에러가 떠서 질문&답변 게시판에 있는 해결방법 2가지를 따라서 해보았는데deploy시 오류가 납니다..ㅠ 어떻게 하면 될까요??ㅠRest API방식으로 실행해서 테스트해봐도 동일한 문제가 발생합니다..혹시 kakaoLogin.dart코드에 maybeCreateUser(credential.user!) 해당 코드는 어떤 코드인가요??
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
vscode에서 @material-tailwind/react component를 가져왔을 때 뜨는 빨간줄 제거할 수는 없나요?
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 안녕하세요?질 좋은 강의 잘 듣고 있습니다.코드를 치면서 신경쓰이는 부분이 있어서 질문드립니다.vscode에서 @material-tailwind/react component를 가져왔을 때 뜨는 빨간줄 없앨 수는 없나요?
-
해결됨Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
Supabase CRUD 하기 또는 REST API화 하기 중 질문이 있습니다.
안녕하세요! 좋은 강의 잘 들었습니다!강의 중 내용에 관한 질문이 있어 여쭙니다.현업에서 작은 사이드 프로젝트를 운영중인데 기존에는 Firebase를 사용하다가 SQL DB가 필요해 Supabase로 이전을 고려하다 강의를 듣게 되었습니다.다름이 아니라 Supabase에서도 REST API 형태를 지원하는 것으로 알고 있는데강의 내용을 보면, REST API 형태를 사용하는 것이 아닌,직접 Supabase의 Database에 CRUD 하는 것으로 여겨집니다.보안이나 코드의 유지 / 보수, 또는 프론트 개발자와 백엔드 개발자의 역할 분리 등 여러 측면을 고려하였을 때 REST API 형태가 아닌 프론트 코드 내에 직접 CRUD 코드가 구현된 이유가 무엇인지 궁금합니다.
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
searchMovies에서 hasNextPage가 필요한 이유
안녕하세요 로펀님. 강의 잘 듣고 있습니다. useInfiniteQuery에서 반환하는 hasNextPage를 이용해 fetchNextPage를 하는데 searchMovies에서 작성한 const hasNextPage = count > page * pageSize 는 사용하지 않는 것 같아서 질문 올립니다! {data?.pages ?.map((page) => page.data) ?.flat() ?.map((movie) => ( <MovieCard key={movie.id} movie={movie} />))}에서도 searchMovies 에서 반환하는 page, pageSize, hasNextPage를 제외하고 data만 쓰시길래 작성하신 이유가 궁금합니다. useInfiniteQuery에서 반환하는 hasNextPage와는 다른 건가요??
-
미해결
React 팀 프로젝트 (로그인 검증 기능)
Supabase의 DB로 로그인 검증 기능을 만들려고 해요 그런데 로그인 검증을 하기 위해서 예외처리를 테스트 하는데 error 400 (Bad request) 가 발생 합니다. 데이터 값이 있으면 로그인은 됩니다. 하지만 존재 하지 않는 값의 예외처리를 할려 하는데 무조건 error 400 (Bad request) 가 나타나내요 이 문제를 해결해 줄 수 있는분 답변 부탁 드립니다. const handleLogin = async (e) => { e.preventDefault(); if (!email || !password) { alert('이메일과 비밀번호를 입력해주세요.'); return; } // 이메일 형식 확인 (정규식 사용) const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; if (!emailPattern.test(email)) { alert('올바른 이메일 형식을 입력해주세요.'); return; } if (password.length < 6) { alert('비밀번호는 최소 6자 이상이어야 합니다.'); return; } try { const { data, error } = await supabase.auth.signInWithPassword({ email, password, }); if (error) { alert('이메일 또는 비밀번호가 잘못되었습니다.'); return; } if (data?.user) { alert('로그인이 완료되었습니다.'); navigate('/'); } else { alert('회원 정보가 존재하지 않습니다.'); } } catch (err) { console.error('오류 발생:', err); alert('오류가 발생했습니다. 잠시 후 다시 시도해주세요.'); } };
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
iOS에 deploy 시 초대받은 이의 화면에 TestFlight 초대코드
강의대로 iOS에 deploy를 했습니다. 초대받은 이가 첨부처럼 [코드 교환] 제목으로 TestFlight 초대 코드 입력 필드가 보인다고 합니다. 초대코드를 어떻게 확인해야 하는지요?
-
해결됨Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
Direct connection / Transaction pooler / Session pooler 차이가 무엇인가요?
Supabase 가 업데이트 되면서, 강의 화면과 다른 부분이 있어서 질문드립니다.Direct connection / Transaction pooler / Session pooler 차이가 무엇인가요?강의를 따라가기 위해 Transaction pooler 를 사용해서 연결은 하긴 했습니다.
-
해결됨[풀스택 입문] Firebase보다 10배 좋은 Supabase
쿠폰 문의
[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14) 할인 쿠폰코드를 적용하려니까 신규 발급이 제한되었거나 발급 수량이 초과된 쿠폰이라고 하네요 ㅠ
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
react 19버전에서는 recoil사용이 어렵나요?
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 안녕하세요. recoil 강의 부분에서 하나의 에러로 인해서 진행이 막힌 상태입니다!TypeError: Cannot destructure property 'ReactCurrentDispatcher' of '{imported module [project]/nodemodules/next/dist/compiled/react/index.js [app-client] (ecmascript)}.default.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' as it is undefined. "dependencies": { "next": "15.1.6", "react": "^19.0.0", "react-dom": "^19.0.0", "recoil": "^0.7.7" },next 15 & react 19 버전으로 진행중이었는데구글링을 해보아도 다들 더이상 recoi은 사용하지말라 이런 답만 알려주고있어 해결하기가 어려운 상태네요. 결국 버전문제인 것 같은데, 최신 버전으로 해당 문제가 해결이 어렵다면 다른 상태관리 라이브러리를 사용하며 진행하고싶은데요,Zustand 라이브러리를 사용해도 진행에 무리없을까요?
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
화면 구성 설명용 도구 이름
화면 구성 설명하실 때 보여주는 도구 이름이 궁금합니다.
-
미해결Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
LiveDemo 페이지 정상작동하나요?
강의를 본격적으로 듣기에 앞서Live Demo를 살펴보려했는데,링크 접속 자체에는 문제가 없으나,로그인 클릭시 리다이렉트 url이 잘못되었는지 정확한 이유는 모르곘으나 "This site can't be reached" 에러가 뜨네요?!확인 좀 해주실 수 있을까요?!
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
Error: Unknown error. Please contact support@flutterflow.io.
플러터플로우에서 cloud_functions를 배포할 때 위와 같은 에러가 발생해서 파이어베이스의 Authentication의 설정에보면 차단함수가 열려있지 않습니다. 이것을 열고 함수를 설정하는 부분이 나오는데 아마도 변경된것같아요.참고 링크 남겨드립니다.https://firebase.google.com/docs/auth/extend-with-blocking-functions?hl=ko&authuser=0&_gl=1*xve8tr*_ga*MTAyNjM2NTU2Ni4xNzI2ODIxNzcw*_ga_CW55HF8NVT*MTczNjczOTQ5Mi4yMDkuMS4xNzM2NzQxMTE4LjYwLjAuMA..&gen=2nd
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
플로터플로우 페이지 구성하기 오류
안녕하십니까 현재 플로터플로우 페이지 구성하기를 따라하고 있는중입니다. 다름이 아니라 CreatePorject를 누르면 하얀화면이 지속적으로 유지되는 버그가 있습니다. 혹시 다른방법으로 위의 문제를 해결할 수 있을까요?
-
해결됨[플러터플로우] 실전! 앱 출시를 위한 끝장 노하우!
3. Android 설정방법 및 플러터플로우에서 실행하기
3. Android 설정방법 및 플러터플로우에서 실행하기를 따라하였습니다. 첨부해주신 유튜브에서 자바 환경변수까지 작업을 수행하였습니다.https://www.youtube.com/watch?v=yP9LdwxVaNk 첫번째 영상의 url이나 동영상이 현재 존재하지 않습니다.현재 2번을 수행하려고 하는데 url을 요청드립니다.
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
netflix clone 할 때 recoil을 하는 순간 에러가 없어지지 않아요
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 깃허브에 올라온 선생님 코드를 모두 복붙해봐도 없어지지 않는데 무엇이 문제일까요? 선생님 코드와 같은데..
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
ThemeProvider에 대해 질문드리겠습니다.
컴포넌트 클라이언트인 ThemeProvider를 최상위 layout의 children을 감싸면 정적인 서버 컴포넌트를 더 이상 활용할 수 없는 제약이 생기지 않나요?? nextjs에서 지향하는 방법인지 잘 모르겠습니다. 이렇게 사용해도 되는것인가요? 아니면 단순 빠른 예제실습을 위해 그렇게 하신건가요?
-
해결됨Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
서버 컴포넌트에서 API 호출 시 Supabase의 클라이언트/서버 클라이언트 차이점이 궁금합니다.
강의를 듣다가 궁금한 점이 생겨서 질문드립니다.브라우저에서 실행되는 코드에서는 브라우저 클라이언트를 사용하고, 서버에서 실행되는 코드에서는 서버 클라이언트를 사용합니다. - [Creating a Supabase client for SSR](https://supabase.com/docs/guides/auth/server-side/creating-a-client?queryGroups=framework&framework=nextjs&queryGroups=environment&environment=client#create-a-client)@supabase/ssr 라이브러리를 사용해서 2가지 유형의 클라이언트를 생성합니다.클라이언트 컴포넌트 클라이언트(createBrowerClient) - 브라우저에서 실행되는 클라이언트 컴포넌트에서 Supabase에 접근서버 컴포넌트 클라이언트(createServerClient) - 서버에서만 실행되는 서버 컴포넌트, 서버 액션 및 라우트 핸들러에서 Supabase에 접근 서버 컴포넌트로 동작하는 page 컴포넌트에서 각 클라이언트를 사용해 번갈아 API 호출을 해봤는데 동일하게 작동하는 것 같았습니다. 서버 컴포넌트에서 Supabase의 클라이언트/서버 클라이언트가 동작하는 방식의 차이가 있는지, 렌더링 방식에 차이가 있는지 궁금합니다. 서버와 클라이언트 개념과 렌더링 방식(SSR, CSR)이 자꾸 혼동되어 헷갈리네요..import { getTodos as getTodosClient } from '@/apis/todos'; import { getTodos as getTodosServer } from '@/actions/todos'; export default async function page() { const todos = await getTodos...(); } // todos.ts import { createBrowserSideClient } from "@/lib/client/supabase"; export const getTodos = async() => { const supabase = await createBrowserSideClient(); const result = await supabase.from("todos").select("*"); return result.data; }// todos.action.ts import { createServerSideClient } from "@/lib/server/supabase"; export const getTodos = async() => { const supabase = await createServerSideClient(); const result = await supabase.from("todos").select("*"); return result.data; }
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
영화목록 component 만들기 에서 질문이 있습니다.
영화목록 컴포넌트 만들기 영상에서 Movies 컴퍼넌트로 분리할때좋아요 버튼 작동이 안되니까 handleLike 함수를프롭스로 넘겨주는데요. 영상에서는 잘 되는데동일하게 소스도 쳐보고 올려주신 github 소스도 가지고 와서 붙여넣어봐도 console창에서는 data 안의 likeCount 값이 버튼을 클릭하면 변경되는게 보이는데 실제로 화면에서는 변경이 되지 않습니다. 왜 그럴까요. 그리고 작동이 되는 게 영상에서도 보이는데, 저한테는 왜 안되는지도 궁금합니다. ;;;; 아래 .toUpperCase() 도 저는 왜 실행이 안될까요.;;