묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결손에 익는 Next.js - 블로그 만들기
getPostData 함수 질문
return 문에 왜 matterResult.data를 반환해주나요? id 와 content만 있으면 되는거 아닌가요??추가해주는 이유가 궁금합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
graphql 백엔드 서버가 포폴용 빼곤 접속이 안됩니다.
backend-practice 로 시작하는 포트폴리오용 백엔드 서버만 접속이 가능하고다른 서버들은 현재 접속할 수 없습니다.이로인해 현재 포트폴리오용 사이트 실습을 제외하고 기본 강의에서 제시해주시는 코드 테스트가 불가능합니다.약 일주일정도 살짝 넘게 강의 수강하면서 시도하는데 문제가 지속되는 것으로 봐서 관리가 안되고 있는 것 같은데 확인 부탁드립니다.
-
해결됨프론트엔드 마스터클래스
이벤트 루프 실행 관련
저는 풀스택 주니어입니다.특수 목적을 위해 바닐라js에서 ,document.innerHTML이나 element.remove(), element.append() 등으로 html element의 생성과 삭제가 빈번한로직을 다루고 있습니다.이 때 종종 브라우저 렌더링의 실행 완료에 대해 명확하게 알지 못해서 찝찝한 채로 브라우저에 렌더링 일을 시키고 있습니다. 그러던 중 이벤트 루프 관련 3개 강의(16,17,18강) 를 듣고 복습차, 17강으로 다시 돌아와서 보는 2분18초 경에 브라우저 랜더링에 대해 궁금한게 생겼습니다. 예를 들면const mySchedule = async () => { await randeringPipelineTask(); //랜더링파이프라인 await macroTask(); // 매크로태스크(); }으로 구성된 mySchedule 메서드가 있다고 가정하겠습니다.macroTask()는 renderingPipelineTask()의 브라우저 페인트까지 모두 완료를 확인한 후에 실행될까요? 아니면 JS엔진이라는 것은, 페인트는 브라우저에 렌더링을 해달라고 부탁까지만하고 macroTask()를 실행할까요?('실행의 시작'과 '실행의 끝'을 나눠서 생각해서 그런지 생각하면 할수록 햇갈립니다.)
-
해결됨비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE
IOS 개발자 등록하고 앱스토어에 앱 올리기
안녕하세요!현재 flutter를 통한 IOS 앱스토어 등록을 진행하고 있는데요. 지금까지 진행 상황은Apple Developer 등록 (1년 결제까지 완료) 그리고 승인 메일까지 받았습니다.Xcode를 통해서 4-9 App Store 출시하기를 따라하는 중인데, 5분 55초 부분에서 이제 Signing & Capabilities에서 Team을 등록한 Apple Developer 계정으로 선택을 했습니다.그 이후에 Status에 아래의 에러 Status가 계속 나오면서 AI와 함께 이것저것 해보고 있는데 안되고 있는 상황입니다. 도와주세요!Communication with Apple failedYour team has no devices from which to generate a provisioning profile. Connect a device to use or manually add device IDs in Certificates, Identifiers & Profiles. https://developer.apple.com/account/No profiles for 'com.xxx.xxxx' were foundXcode couldn't find any iOS App Development provisioning profiles matching 'com.xxxx.xxxxx'.
-
해결됨[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
언제부터 영상을 볼수 있나요?
언제부터 영상을 볼수 있나요?공지를 해주세요
-
해결됨[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
챌린지 시작전 먼저 강의 볼 수 없나요?
챌린지 시작전 먼저 강의 볼 수 없나요?
-
미해결내가 타이타닉에 탔었다면?! PyTorch & Next.js로 생존 확률 예측 AI 웹 서비스 만들기
강의 잘듣고있습니다. next js에서 src 폴더 및에 폴더들 이름 정의할때 첫글자를 대문자로하는 이유가있나요?
또한 next에서 실습시 사용한 폴더구조는 어떤 구조이며 , 상용화된 구조인가요? 궁금합니다.추가로 닭강정님 강의 잘 듣고있습니다. 이번강의 완독후 electron 강의도 학습하려고하는데프론트 프레임워크가 해당강의는 next인데 , electron강좌는 react인것같더라구요next도 electron을 통해서 포팅가능한가요?
-
해결됨프론트엔드 마스터클래스
Map 강의 누락된 것 같습니다.
안녕하세요! 강의가 누락된 것 같아 글 작성합니다. 확인부탁드릴게요! 30강 Map 강의로부터 31강까진 문제없이 연결되는데, 32. WeakRef + FinalizationRegisty 강의시작부터 연결이 매끄럽지 못합니다. 뜬금없이 대안?에 대해서 나오는데 Map 예제부분과 WeakMap 부분이 누락된것같습니다.
-
해결됨[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
저도 피그마 강의 자료 이미지 누락 문제 관련 문의드립니다.
안녕하세요! 저도 동일한 현상을 겪고 있습니다. 레이아웃은 그대로 복제되는데, 이미지가 모두 누락되어 있습니다.제 생각에는 수강생들에게 보기 권한만 부여되어 있어서 해당 리소스에 접근할 수 없고, 그로 인해 파일 복제 시 이미지가 빠지는 것 같습니다.혹시 가능하시다면, 모든 수강생이 문제없이 접근할 수 있도록 이미지를 파일 내에 직접 포함한 버전으로 자료를 수정해 다시 업로드해 주실 수 있을까요?그렇게 해주신다면 저를 포함한 다른 수강생들도 문제없이 실습을 진행할 수 있을 것 같습니다.바쁘시겠지만 확인 부탁드립니다. 좋은 강의 감사드립니다!
-
미해결한 입 크기로 잘라먹는 Next.js(v15)
동적페이지 풀라우트 캐시 질문 있습니다.
강의에서 book/4는 동적 페이지인데 첫 접속 후 Full Route Cache에 저장되어 두 번째 접속이 빨라진다고 했습니다. 동적 페이지는 Full Route Cache에 저장되지 않는다고 배웠는데 왜 적용되나요? .next 폴더에 해당 페이지가 남아있는 것을 확인했는데, 이것이 Full Route Cache 적용을 의미하나요? npm run start로 프로덕션 모드에서 테스트했는데 첫 접속과 두 번째 접속 모두 170ms로 동일합니다. 왜 속도 차이가 없나요?import { notFound } from "next/navigation"; import style from "./page.module.css"; import { BookData } from "@/types"; // export const dynamicParams = false; export function generateStaticParams() { return [{ id: "1" }, { id: "2" }, { id: "3" }]; } export default async function Page({ params, }: { params: Promise<{ id: string | string[] }>; }) { const { id } = await params; const response = await fetch( `${process.env.NEXT_PUBLIC_API_SERVER_URL}/book/${id}` ); if (!response.ok) { if (response.status === 404) { notFound(); } return <div>오류가 발생했습니다...</div>; } const book: BookData = await response.json(); const { coverImgUrl, title, subTitle, author, publisher, description } = book; return ( <div className={style.container}> <div className={style.cover_img_container} style={{ backgroundImage: `url('${coverImgUrl}')` }} > <img src={coverImgUrl} /> </div> <div className={style.title}>{title}</div> <div className={style.subTitle}>{subTitle}</div> <div className={style.author}> {author} | {publisher} </div> <div className={style.description}>{description}</div> </div> ); } 🚨 필독) 질문하시기 전에 꼭 읽어주세요 (10초 소요)제목을 구체적으로 작성해 주세요✅ 좋은 예 : 감정일기장 Home 구현중 xx 이슈가 발생합니다.⛔️ 나쁜 예 : 이거 왜 안되나요?, 오류나요 도와주세요 등비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요! 코드의 이슈는 전체 프로젝트를 "링크 형태"로 올려주셔야 원인을 파악할 수 있습니다.깃허브, 구글드라이브 등의 수단을 통해 링크 형태로 전달해주세요직접 실행해보며 원인을 파악해야 하기 때문에 텍스트 형태로 붙여넣는건 삼가해주세요 🥲 답변이 도움이 되셨다면 답글 or 해결완료 버튼을 클릭해주세요비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요!제 답변이 여러분께 도움이 되었는지 저도 알고 싶어요 🥲 강의 내용에 궁금한 점이 있다면 몇 챕터의 몇 분 몇 초인지 알려주시면 더 좋아요더 빠른 답변이 가능합니다!
-
미해결Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
퀴즈 질문 풀이 오류
저는 아무래도 정답이 C 같은데.. 질문에서 /docs도 포함되어야 한다고 했으므로, 옵셔널 캐치올만이 루트 경로(/docs)까지 모두 처리할 수 있는거 아닌가요? 다 학습하고 혼란이 오네요..
-
해결됨비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE
구글 애드 센스 정책 위반을 해결하기 위해선 도데체..
아니 며칠이나 기다렸는데,웹에 특별히 더 넣을 기능도 없는데,어떻게 더 고품질로 만들죠...게시글도 15개이상 1000자이상 무조건 넣어야하나요~?ㅜ정확히 뭐가 어디가 부족하다라고 해주면 좋은데 특별한 고지도 없고..,이렇게 웹승인 받기가 힘들면...어떻게 만들으라구..ㅜㅠ혹시 방법있을까요 샘?커서는 두리뭉실한 얘기만 해줘서 또 며칠이나 기다려서 실패하면 어떡하나 고민입니다.그리고 커뮤니티 즉 회원가입,로그아웃 기능에 대해서 조금더 설명이나 관련 링크를 좀 주실수 있을까요?회원가입이나 뭐가 되야 결제시스템도 등록이 가능한데 그런게 없어서 계속 헤매고 있네요...
-
해결됨Next + React Query로 SNS 서비스 만들기
팔로우 추천 목록이 빈 배열로 들어옵니다.
안녕하세요. 팔로우 추천 API는 팔로워 수가 많은 순으로 최대 3명을 가져오도록 되어 있는 것으로 알고 있습니다.현재 발생하는 현상으로는 회원가입한 유저가 없는 경우에 기존 유저에게 추천 목록이 빈 배열로 나타납니다.그런데 회원가입 후 로그인하면 추천 목록에 로그인한 본인 아이디가 뜨고, 로그아웃 후 기존 유저 A로 로그인하면 이전에 회원가입한 유저 아이디가 추천 목록에 나타납니다.기존 유저 A가 그 회원가입 한 유저를 팔로우한 상태에서, 다른 기존 유저 B로 로그인하면 A가 팔로우했던 아이디가 추천 목록에서 사라져 있습니다.팔로우나 언팔로우 기능을 사용할 때 데이터는 정상적으로 들어오는 것으로 확인되고, 팔로워가 있는 아이디가 추천 목록에 나타나야 하는데 빈 배열로 표시됩니다.어느 부분을 점검해야 문제를 정확히 파악할 수 있을지 감이 잡히지 않아 질문 남겨봅니다..!import { MouseEventHandler } from "react"; import { User } from "@/model/User"; import { useMutation, useQueryClient } from "@tanstack/react-query"; import { useSession } from "next-auth/react"; type Props = { user: User; }; export default function FollowRecommend({ user }: Props) { const queryClient = useQueryClient(); const { data: session } = useSession(); const followed = !!user.Followers?.find((v) => v.id === session?.user?.id); // 팔로우 const follow = useMutation({ // 호출 시마다 userId를 전달 mutationFn: (userId: string) => { return fetch( `${process.env.NEXT_PUBLIC_BASE_URL}/api/users/${userId}/follow`, { method: "POST", credentials: "include", }, ); }, onMutate: (userId: string) => { const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { // 내가 팔로우 하는 대상 // User 배열 중에 팔로우 버튼을 누른 대상의 userId를 찾아서 그 유저의 Followers 수정 const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], Followers: [{ id: session?.user?.id as string }], _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers + 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, onError: (error, userId: string) => { console.error("팔로우/언팔로우 에러:", error); console.log("실패한 userId:", userId); const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], // 내 아이디가 대상 유저의 팔로워 목록에서 빠져야함 Followers: shallow[index].Followers.filter( (f) => f.id !== (session?.user?.id as string), ), _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers - 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, }); // 팔로우 끊기 const unfollow = useMutation({ mutationFn: (userId: string) => { return fetch( `${process.env.NEXT_PUBLIC_BASE_URL}/api/users/${userId}/follow`, { method: "DELETE", credentials: "include", }, ); }, onMutate: (userId: string) => { const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], Followers: shallow[index].Followers.filter( (f) => f.id !== (session?.user?.id as string), ), _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers - 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, onError: (error, userId: string) => { const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], Followers: [{ id: session?.user?.id as string }], _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers + 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, }); const onFollow: MouseEventHandler<HTMLButtonElement> = (e) => { e.stopPropagation(); e.preventDefault(); if (followed) { console.log("언팔로우"); unfollow.mutate(user.id); } else { console.log("팔로우"); follow.mutate(user.id); } };
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
혹시 일반적인 방법이 무엇일까요?
예를 들어 로그인이 되지 않는 경우는 메뉴가 굳이 나올필요가 없어서..세션이 미존재면 보이지 않게 처리 했는데....이렇게 처리하는 방법이 일반적이지는 않을거 같은데.... 보통 로그인이 되지 않아 메뉴가 필요 없는 페이지는 어떻게 처리하나요? export default async function RootLayout({ children }: Readonly<{ topmenu: React.ReactNode; children: React.ReactNode; }>) { const cookie = (await cookies()).get("session")?.value; const session = await verify(cookie); return ( <html lang="en"> <body className={`${geistSans.variable} ${geistMono.variable} antialiased`} > {/* 세션이 undefined가 아닌 경우 TopNavigationMenu를 렌더링합니다. 'undefined'는 문자열이 아닌 JavaScript의 실제 undefined 값입니다. */} { session!==undefined&&<TopNavigationMenu/> } <main> {children} </main> </body> </html> ); }
-
해결됨웹 개발자의 연봉을 올려주는 하이브리드앱 with Expo 프레임워크
웹 배포 시에 RN으로 만든 네비게이션은 어떻게 처리하나요?
React Native에서 바텀 네비게이션을 만들었다면,웹에서는 바텀 네비게이션이 나오게하려면 어떻게 해야하나요?
-
해결됨[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
첼린지 문의
현재 바이브코딩 강의를 구입한 사람입니다. 저는 현재 자영업을하면서 향후 웹서비스 창업을염두해서 본강좌를 미리 구입해둔상태이고 학습을 할수있는 상황은아닙니다. 쿠폰보니까 첼린지 쿠폰이 발급되어있던데 이미 강의를 구입한사람일경우 첼린지강의를 신청하면새로운내용을 더 얻어갈수있는건가요??? 기존강의구입자들은 첼린지를 어떻게 생각해야할지요?
-
해결됨[4주 완성] AI 바이브코딩으로 수익형 앱/웹 만들기
실습 중 작업영역 문의드려요
안녕하세요. 3:00 이정도 시점부터 기존 project-management 가 아닌 다른 폴더(코인~, FingerLuck )에서 실습을 하신거 같은데..디자인 변형 커서 룰 부터 이후 작업도요. project-management 에다가 실습을 해도 무방한건가요? 어느 시점부터 실습을 똑같이 따라 갈수 없는거 같아서요. 제가 뭘 놓친건가요? ㅠㅎㅎ
-
미해결Next.js 15 with Spring Boot
한글로 할 일 등록시 리스트 업데이트가 되지않습니다.
안녕하세요.강의를 보면서 차근차근 작업중인데요. 테스트 하다보니 한글로 제목과 내용을 작성하고 등록을 하면 등록이 완료되었다고 뜨나 실제 리스트 페이지에선 업데이트가 되지않고 있습니다. 제가 설정을 빠트린게 있는걸까요? 실제로 영문이나 숫자로만 입력후 등록하면 리스트에도 잘 반영됩니다.
-
미해결[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
figma 연결오류
피그마 mcp연결이 안되요...링크주신 피그마도 유료계정결제하고 피그마연결블로그도 보고했는데.. 연결되었다고 나오는데 커서에 세팅에 빨간불이 안없어지고 [INFO] Connecting to Figma socket server at ws://localhost:3055...[INFO] FigmaMCP server running on stdio[INFO] Connected to Figma socket server[DEBUG] Received message: "Please join a channel to start chatting"[LOG] myResponse"Please join a channel to start chatting"[INFO] Received broadcast message: "Please join a channel to start chatting"이런에러만뜨고요..로그를 보니 피그마 소켓 서버에는 연결이 되었지만, 채널에 참여하라는 메시지가 계속 표시되고 있습니다. 이는 피그마 플러그인이 실행 중이지만 채널 연결이 완료되지 않았다는 의미입니다.피그마에서 다음 단계를 확인해보세요:피그마 앱에서 Cursor Talk to Figma 플러그인이 실행되고 있는지 확인플러그인에서 채널 생성 또는 참여가 필요할 수 있음플러그인에서 채널 ID(udfelzqr)를 정확히 입력했는지 확인피그마 플러그인 측에서 채널 연결이 완료되어야 터미널에서 실행한 명령이 제대로 작동할 수 있습니다.현재는 이미 구현한 색상 토큰 시스템을 계속 사용하는 것이 좋겠습니다. 피그마 연결이 필요하시면 피그마 플러그인 설정을 다시 확인해주세요. 커서는 이렇게이야기하는데 왜 안되는지 알수가없습니다..ㅠㅠ
-
해결됨[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
강의 챌린지 참여
안녕하세요. 강의를 이전에 구매하였는데 해당 강의가 챌린지 형태로 진행한다고 들었습니다.기존 구매자는 챌린지에 참여할 수 없을까요?