if (previewImage) { const formData = new FormData(); formData.append("file", previewImage); formData.append("upload_preset", "react_blog"); // formData.append("api_key", "688125195814112"); // formData.append("api_secret", "S2HFi155abf2HkDpkcgArvWP5HE"); // formData.append("public_id", "87f7932d-354d-4a7f-8f39-5dbf751f1c46"); const { data } = await axios.post( "https://api.cloudinary.com/v1_1/dptshe37e/image/upload", { formData }, ); console.log(data); https://api.cloudinary.com/v1_1/dptshe37e/image/upload { "error": { "message": "Upload preset must be specified when using unsigned upload" } } 일단 강의가 정말 훌륭합니다. 잘 듣고 있고 정말이지 많은 도움이 되고 있습니다. 게시글 등록하기 -4 강을 듣고 있는데 파일 업로드 부분에서 좀 막히네요. 요청 시 오류가 나는데요. 여러가지 방향으로 시도해 봤는데 잘 안되네요. 강의 촬영 시점하고 cloudnary 가 개편되었는데 특별하게 다른 점은 없어 보입니다. 일단 업로드 부분은 보류하고 다음 강의 들어야겠네요. 한번 살펴 봐 주시면 감사하겠습니다.
강의 잘 듣고있습니다. tailwindcss@v4로 변경되고 이후론 사용을 안해봐서 이번 강의가 매우 도움이 되고있습니다. 섹션2 모든 챕터 수강 이후 퀴즈를 푸는데 문제 1개가 강의에 사용되는 버전인 v4가 아닌 v3에 대한 내용이 있는 것 같아서 Q&A 올렸습니다. 공식문서 - docs - getting started - upgrade guide에서도 확인 가능합니다. 강의 감사합니다.
투두 삭제할 때 mutation 부분 코드를 강의와 똑같이 // use-delete-todo-mutation.ts export function useDeleteTodoMutation() { const queryClient = useQueryClient(); return useMutation({ mutationFn: deleteTodo, onSuccess: (deletedTodo) => { queryClient.setQueryData<Todo[]>(QUERY_KEYS.todo.list, (prevTodos) => { if (!prevTodos) return []; return prevTodos.filter((prevTodo) => prevTodo.id !== deletedTodo.id); }); }, }); } 이렇게 치면 바로 삭제가 안 되고 새로고침해야 적용이되는데 export function useDeleteTodoMutation() { const queryClient = useQueryClient(); return useMutation({ mutationFn: deleteTodo, onSuccess: (_data, deletedId) => { queryClient.setQueryData<Todo[]>(QUERY_KEYS.todo.list, (prevTodos) => { if (!prevTodos) return []; return prevTodos.filter((prevTodo) => prevTodo.id !== deletedId); }); }, }); } 이렇게 작성하면 바로 삭제 적용이 됩니다. 무슨 차이가 있는 걸까요?? 그리고 강의에 왜 처음 코드는 바로 삭제 반영이 안 되는 건지 궁금합니다 ㅜㅜ!
라우트 가드 학습 중 궁금한 점이 생겨서 질문드립니다! import { useSession } from "@/store/session"; import { Navigate, Outlet } from "react-router"; export default function MemberOnlyLayout() { const session = useSession(); if (!session) return <Navigate to={"/sign-in"} replace={true} />; return <Outlet />; } 라우트 가드에서는 인증 정보 유무만 검사하고, 인증 정보 만료 여부는 별도로 확인하지 않나요? 만약 그렇다면 인증 정보가 만료된 상황에서의 처리 방법이 궁금합니다! 고민해봤을 때 인터셉터 등 별도 로직으로 구현해 다음과 같이 처리할 것 같습니다 접근한 페이지에서 인증이 필요한 요청 처리가 있다면 refreshToken 을 이용해 accessToken 을 재발급 한 뒤 요청을 재시도한다 refreshToken 도 만료되었다면 요청을 취소하고 로그인 페이지로 리디렉션 한다 그런데 이렇게 처리하면 refreshToken 도 만료된 사용자는 인증 정보가 있으므로 요청 페이지로 이동한다 짧은 순간이나마 데이터가 없는 빈 화면이나 깨진 UI를 본다 로그인 페이지로 리디렉션되며 혼란을 겪는다 그래서 라우트 가드에서 만료된 경우 접근을 막아야 되지 않을까 생각해봤는데 매번 토큰 유효성 검증을 수행하면 성능 저하가 발생할 것 같다는 생각을 했습니다 어떻게 처리하면 좋을지 의견을 여쭤보고 싶습니다!
안녕하세요! 항상 강의 잘 듣고있습니다 :) 강의에서 onAuthStateChange 를 사용해서 사용자 로그인 시 세션 데이터가 변경되며 업데이트된 세션이 매개변수로 전달되고, 업데이트된 세션을 스토어에 보관했었습니다 supabase 를 사용하지 않는다면 세션 데이터 변경을 어떻게 감지하고, 스토어에 보관 해야될지 고민해봤는데 세션 데이터를 사용하는 곳에서 직접 저장 / 수정하는 방법 혹은 강의에서 배웠던 persist 와 subscribeWithSelector 를 활용한 방법도 있을 것 같은데 명확한 방법이 떠오르지 않아 강의 내용과는 조금 방향성이 다르지만 질문드리게 되었습니다!
id를 전부 string으로 변경했음에도 계속 오류가 발생해서 ai한테 도움을 요청했더니 create-todo.ts에 header값을 붙이라고 하더라고요! 그래서 해당 파일 코드에 headers: { 'Content-Type': 'application/json',} 를 붙여줬더니 정삭작동하는 걸 확인할 수 있엇습니다. 왜 이 헤더를 붙여줘야 하는 건가요? import { API_URL } from '@/lib/constants'; import type { Todo } from '@/types'; export async function createTodo(content: string) { const response = await fetch(`${API_URL}/todos`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ content, isDone: false }), }); if (!response.ok) throw new Error('Create Todo Failed'); const data: Todo = await response.json(); return data; }
타입스크립트 강의를 따로 안들어서 그런데 컴포넌트 별로 props를 넘길때 언제는 구조분해할당으로 넘기고 언제는 그냥 타입만 선언해서 넘기던데 따로 판단하는 기준이 있을까요? CommentEditor 컴포넌트 props 넘길때 {postId}:{postId : number} 과 (postId : number) 의 차이가 명확히 그려지지가 않습니다.
안녕하세요! 강사님이 얘기해주신 부분에서 구현을 다했고, 추가로 구글로그인도 적용시켰습니다! 이후에, 카카오 로그인 관련해서 적용하려고 앱설정 및 AI 도움을 받아 하려했는데, 구현 부분에서 막혔습니다. 잘못된 요청 (KOE205) onebite-log 서비스 설정에 오류가 있어, 이용할 수 없습니다. 서비스 관리자의 확인이 필요합니다. 서비스 관리자라면 아래를 확인해보세요. 왜 에러가 발생하나요? 접기 설정하지 않은 카카오 로그인 동의 항목을 포함해 인가 코드를 요청했습니다. 설정하지 않은 동의 항목: account_email 어떻게 해결할 수 있나요? 접기 앱 관리 페이지의 [카카오 로그인] > [동의항목]에서 동의 항목 설정을 변경하거나, 설정하지 않은 동의 항목을 제외하고 재요청합니다. 이걸 해결하기 위해선 동의항목에 가서 비즈앱으로 전환하는 방법 밖에 없는 지 궁금하여 문의드립니다!
안녕하세요! ui 관련해서 궁금한 것이 있어 질문드립니다. Popover와 같이 radix-ui 와 @/components/ui (shadcn/ui ..?) 있는 컴포넌트의 경우, 어떤 것을 사용하는지에 대한 기준이 있을까요?? PopoverClose 는 @radix-ui 에서 받아오는데, 어떤 것은 @/components/ui 에서 가져와서 사용하고 그래서 혹시나 기준이 있나 궁금해서 질문드립니다!
