Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
강의를 듣다가 궁금한 점이 생겨서 질문드립니다. 브라우저에서 실행되는 코드에서는 브라우저 클라이언트를 사용하고, 서버에서 실행되는 코드에서는 서버 클라이언트를 사용합니다. - [ 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; }
안녕하세요! 이번 강의 4분 10초에 나오는 state 값 content를 사용자에게 값을 입력받는 input의 value로 아래 코드와 같이 작성해주시는 이유는 무엇일까요?? value는 어떤 용도로 사용되며 content를 넣어주면서 어떤 변화가 생기는건지 이해가 잘 안되어서 질문드립니다! <input value={content} placeholder="새로운 Todo..." />
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요. 궁금증이 생겨서 질문을 남깁니다. '문제 풀이2번 을 어떻게 하면 될까?' 라고 생각 하던 도중,조인 하나만 맨 밑에 넣어보자, 라고 해보니.. 답은 나오긴 하였습니다. (코드 내용) t1.start(); t2.start(); t3.start(); t3.join(); (코드 완료) 근데 여기서 궁금증이 생겼습니다. 여러 개의 작업을 시키고 나서, 끝이 나고, 기다려야 하는 경우에, 정답 풀이에서는 t1.join(); , t2.join(); , t3.join() 이렇게 전부다 join()을 해주었는데, 저 처럼 't3.join()' 하나만 써도 상관 없나요? 답변 부탁 드립니다.
현재 useMemo에 대한 강의를 보고 있습니다. 강의를 볼 땐 어느 부분의 코드가 계속 렌더링이 되기 때문에 불필요한 부분이라 최적화를 해주기 위해 useMemo를 사용한다라고 이해는 하지만 막상 혼자 어떤걸 만들어볼땐 어느 부분의 코드가 계속 렌더링이 되고 불필요한 코드인지 몰라 useMemo를 이용하기가 많이 어렵더라구요. 어떻게 하면 쉽게 이해해서 혼자 코드를 작성할 때 잘 이용할 수 있는지 궁금합니다 ^^
04 : 08 안녕하세요. C언어로 입력받고 출력하기 문제 - 1 에서 교재의 문제 하단 답에 왜 printf("두 숫자를 입력하세요: ") 이후의 출력이 두 숫자를 입력하세요: 5 10 5 + 10 = 15 (이하 생략) 로 출력되는지 궁금합니다. printf("두 숫자를 입력하세요: ") 의 경우 개행 문자가 없기 때문에 두 숫자를 입력하세요: 5 105 + 10 = 15 이런식으로 붙어서 출력되어야 하는게 아닌가요? 기초적인 질문입니다만, 답변 부탁드립니다. 감사합니다.
개발환경 자바 버전 : 21.0.2 프로젝트 : gradle 스프링부트 : 3.4.1 dependencis : 1. Spring Web Spring Boot DevTools ================================================================== 인텔리제이에서 프로젝트 열기시 오류가 발생함. - 이걸로 3일째 해결을 못하고 있어요. Build file 'D:\proj\demo1\build.gradle' line: 3 Plugin [id: 'org.springframework.boot', version: '3.4.1'] was not found in any of the following sources: * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. > Get more help at https://help.gradle.org .
글 수정기능을 추가하고 useReducer로 바꿔서 했는데 글을 추가해도 새로운 내용이 나타나지 않고, 마지막 요소가 다시 추가되었습니다. [{content:"To1"}, {content:"To1"}] 확인해보니 컴포넌트에서 받은 props를 useState초기화값으로 넣으면 바뀌지 않는 사실을 알게되었습니다. 하지만 이부분을 useEffect형식으로 바꿔 적어주니 새로운 내용으로 바뀌는 것을 확인했습니다. // props content를 useState 초기화값으로 적용 const TodoItem = ({ content, id, isDone, date, onUpdate, onDelete }) => { const [upContent, setUpcontent] = useState(content); ... } //////////////////////////////////////////// // useEffect 적용 const TodoItem = ({ content, id, isDone, date, onUpdate, onDelete }) => { const [upContent, setUpcontent] = useState(""); useEffect(() => { if (content) { setUpcontent(content); } }, [content]); ... } useReducer를 적용하지 않을때 props를 useState초기화값을 넣어도 잘 구동되었습니다. // props content를 useState 초기화값으로 적용 const TodoItem = ({ content, id, isDone, date, onUpdate, onDelete }) => { const [upContent, setUpcontent] = useState(content); ... } 이것이 리액트 라이프 사이클 때문에 이러한 현상이 발생한것인가요?
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요 영한님 코드는 제가 이해한 바로는 세션 객체를 돌리는 스레드가 채팅을 다른 사람에게 전파하는 코드도 돌리는 걸로 알고 있습니다. 저는 채팅을 다른 사람에게 보내는 것을 맡은 객체를 따로 만들고 스레드도 따로 돌리게 만들었습니다. 혹시 이렇게 하는 게 좋은 건지 궁금합니다. 이걸 가능하게 하기 위해서 ConcurrentLinkedQueue를 사용했고 각 세션이 채팅을 받으면 이 queue에 채팅 내용을 넣으면 이 queue를 담당하는 스레드에서 큐를 비워가면서 채팅을 각 사용자에게 보내게 했습니다. 근데 큐가 차 있는지 확인하는 방법을 잘 몰라서 0.1초마다 while문을 돌려서 큐가 차 있는지 확인하고 차 있으면 채팅을 보내게 했습니다. 이 방식이 굉장히 마음에 안 드는데 더 좋은 방법이 뭐가 있을지 궁금합니다.
[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? ( 예 /아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? ( 예 /아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? ( 예 /아니오) [질문 내용] 제목그대로요 어떤차이가 있고, 현업에서도 그러는지 궁금합니다.
주기적으로 업데이트한다고 강의 소개에 크게 적어놓으셨는데, 왜 2023년 초 이후로 업데이트가 없나요? 그리고 새로운 버전 강의가 나왔던데, 이전 버전 수강자들에게는 무료로 제공되나요? 이 강의가 저렴한 것도 아니고 몇십만 원이나 하는데, 그 정도 보상은 해주셔야 한다고 생각합니다.
안녕하세요 단일연산변수 api에 관련해서 질문드립니다! 13:50 ppt에서 단일연산변수를 사용한(왼쪽) 코드에서 for문에서 counter.incrementAndGet()을 호출하는부분이 있는데 해당 메서드 실패시 재연산을 수행하는 코드가 없더라고요 그래서 해당 api는 내부적으로 cas연산을 사용하는데 내부적으로 cas연산이 실패하는경우 재시도를 통해서 최종적으로 나오는 결과값을 무조건 보장해주는걸로 이해했는데 맞는걸까요??
