다른 분들도 위와 같은 에러가 많이 뜨시는 것 같은데 아직 해결 방법이 없는 걸까요? supabase 프로젝트 생성 딜레이로 예측하신다면 시간 두고 기다려봐야 하는 것일지 궁금하네요 ㅜ

안녕하세요 ~강사님 수업 실무적으로 잘 가르쳐주셔서 너무 잘 듣고 만족합니다.현재 완벽한 프론트엔드코스를 거의 다 소화하고, 풀스택을 배우고자 합니다. 부트캠프에서 만든 고농축 백엔드 코스는 현재 수강한 프론트엔드 코스 내용과 겹치는 강의가 많고 강의량도 많다보니 구매가 고민스로운데요..강사님 강의중 관리자 모드와 유저모드간에 통신을 다루는 실무 프로젝트 중심의 백엔드까지 배울수 있는 강의가 있는지 추천받고 싶습니다.

선생님이 가르쳐 주신 웹서비스를 만들고 나서(컨텐츠,로그인,결제 등 전부 포함),위의 것들로 커서에서 구글 플레이스토어, 애플 스토어 등에 올릴 수 있나요?커서와 수파베이스,버셀로 웹페이지 만들어서 사람들하게 공유하는것은 가능한데, 그걸 또 앱 배포용 코드(?)로 변환해서 만들 수 있는지요?쳇지피티에 물어보면 이미 만들어진 웹서비스를 앱용으로도 가능하다는데...커서에서도 쉽게(현재까지는 쉽게 배워서 쉽네요 ^^) 변환을 시킬 수 있는지 알고 싶습니다~

안녕하세요! 파이널 과제를 완성하고 레퍼런스 코드를 보며 공부를 하다가 const와 let 사용에 대해 질문이 생겼습니다. 레퍼런스 코드에서는 함수 내에서 값이 변화하는 변수가 아니면 전부 const로 변수 선언을 하였는데, 주로 const를 많이 사용하고 값이 변화하는 경우에만 let으로 선언을 하는 걸까요? const를 주로 쓰는 이유가 따로 존재할까요? 주로 권장되는 스타일인지 궁금합니다. 미리 답변 감사합니다.

안녕하세요 제로초님 질문있습니다. 강의에서 post 데이터 서버로부터 불러오고 화면에 렌더링 해주는 과정을 아래와 같이 이해하였습니다. prefetchQuery 로 서버로부터 데이터를 가져온다.그렇게 가져온 데이터를 client component 에서 useQuery 로 가져온다 위와 같이 하는 이유가 궁금합니다. 사실 처음부터 클라이언트 컴포넌트로 useQuery 만 써도 문제없이 동작할텐데useQuery 이전에 prefetchQuery 로 먼저 불러오는 이유는 ssr 을 위해서이고, 그말은 즉 seo 를 위해서 인가요? (useQuery 만 사용하면 csr 방식이여서..?) 감사합니다.

iOS 디바이스에서 input 요소에 포커스가 되면 가상키보드가 나타나면서 다음과 같은 문제가 발생합니다:문제 상황:가상키보드가 올라오면서 웹뷰의 전체 document가 위로 이동position: fixed로 설정한 헤더, 바텀 버튼 등의 엘리먼트들이 함께 올라가면서 고정 위치를 유지하지 못함시도해본 해결방법:가상 인풋(virtual input) 방식 적용 → 효과 없음Visual Viewport API 활용 → 해결되지 않음질문: 이 문제를 해결할 수 있는 효과적인 방법이 있을까요? 특히 iOS Safari 웹뷰 환경에서 position: fixed 엘리먼트가 가상키보드의 영향을 받지 않고 제자리를 유지할 수 있는 방법을 찾고 있습니다.

import BookItem from "@/app/components/book-item"; import BookListSkeleton from "@/app/components/skeleton/book-list-skeleton"; import { fetchSearchBooks } from "@/app/lib/fetch-search-books"; import { Suspense } from "react"; // export const dynamic = "force-dynamic"; // 특정 페이지 유형을 강제로 설정하는 dynamic 세그먼트 옵션 // 1. auto - 아무것도 강제하지 않는 옵션, 기본형 // 2. force-dynamic - dynamic 페이지를 강제하는 옵션 // 3. force-static - static 페이지를 강제하는 옵션 // 4. error - static 페이지를 강제하지만 이로 인해 오류가 발생할 것으로 예상되면 빌드과정에서 오류를 발생하는 옵션 async function SearchResult({ q }: { q: string }) { const searchBooks = await fetchSearchBooks(q); return ( <> {searchBooks.map((book) => { return <BookItem key={book.id} {...book} />; })} </> ); } export default async function Page({ searchParams, }: { searchParams: { q?: string }; }) { return ( <Suspense fallback={<BookListSkeleton count={3} />}> <SearchResult q={searchParams.q || ""} /> </Suspense> ); } 스켈레톤 UI를 적용하고 있는데 속도를 3g로 하고 새로고침을 해도 Suspence가 작동하지 않고 페이지가 랜더링 됩니다.그리고 터미널에서 이런 에러가 발생하고 있습니다.Error: Route "/search" used `searchParams.q`. `searchParams` should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis at Page (src/app/(with-searchbar)/search/page.tsx:31:37) 29 | return ( 30 | <Suspense fallback={<BookListSkeleton count={3} />}> > 31 | <SearchResult q={searchParams.q || ""} /> | ^ 32 | </Suspense> 33 | ); 34 | } GET /search?q=%ED%95%9C 200 in 47msSearchResult가 서버 컴포넌트로 만들어져 있어서 서버에서 이미 만들어 가져오기 때문에 fallback이 적용되지 않는건가요? SearchResult를 클라이언트 컴포넌트로 바꿔야지 해결되는 문제인가요?

안녕하세요. 우선 강의 잘 듣고 있습니다.Next.js 에서 Zustand를 사용할때는 create대신 createStore로 개별 생성하여 RQ와 같이 Provider로 사용하는 것을 공식문서에서도 권장하고 있는 것으로 이해하고 있습니다만 provider없이 create()를 통해 사용하신 이유가 궁금합니다.1. SSR없이 완전한 client component로 분리하여 이슈가 없을 것이라 판단하신것인지2. client component에서만 사용하게되면 모듈 레벨에서 캐싱되기때문에 (next에서 SSR/hydrating이 필요한 store를 생성하는 것이 아니라면) 매번 store를 생성하지 않는것인지답변주시면 감사하겠습니다!

궁금한 내용"NextJS에서 클라이언트 컴포넌트도 SSR을 수행하는데, 상호작용이 불가능한 정도의 SSR을 수행하여 리액트 트리를 구성하여 HTML을 만들고, HTML과 함께 클라이언트에 자바스크립트 번들 형태(하이드레이션 용도)로 전달된다." 라고 알고 있는데 맞는 말일까요? 그렇다면, '첫 페이지 로드 시'에만 1번과 같이 동작하고 첫 페이지가 아닌 '다른 페이지'에 들어갈 땐 CSR처럼(JS번들을 클라이언트에게 전달하여 브라우저 단에서 리액트 생명주기 시작) 동작한다면, 강의 중 나온 SearchBar 컴포넌트는 빌드 단계에 렌더링되는 컴포넌트 안에 있다하더라도 CSR될 것인데 Suspense로 래핑하여 클라이언트 단에서 렌더링이 되게끔 강제할 필요가 없지 않나요? 클라이언트 컴포넌트로 선언된 페이지 컴포넌트(create 페이지)가 next/link를 통해 프리패칭된 것을 네트워크 탭을 통해 확인했습니다. 다만, 클라이언트 페이지 컴포넌트 임에도 RSC Playload로 가져온 것을 확인했는데, 이것은 왜 그런 걸까요?  첫 페이지 로드 이후 페이지 이동 시에 CSR로 동작한다하더라도 진입하는 페이지의 RSC Payload와 JS번들은 주기적으로 서버로부터 가져와야하지 않나요? 아래의 그림에는 JS 실행 전에 서버로부터 가져오는 단계가 보이지 않는데 프리 패칭 과정이 생략된 걸까요? 

강의 찍으실 때 어떤 프로그램 쓰면 선생님처럼 화면녹화도하면서 마우스로 네모박스도 그리고 그림도 그릴 수 있는거에요? 너무 궁금해요. 아 그리고 강의가 너무 꼼꼼해서 아직까진 아주 이해가 잘됩니다. 감사합니다.

안녕하세요 선생님금일 수강신청 및 프로젝트해보면서 오류가 발생하여 질문드립니다. 우선 프로젝트를 clone하고 pnpm install로 의존성을 설치했습니다.  그리고 docker compose -f docker-compose/redis/redis-compose.yml up -d를 실행하였는데 아래와 같은 결과가 나왔습니다.network ludgi-network declared as external, but could not be found어떻게 조치하면 될까요~?

안녕하세요 ~수업내용과 똑같이 코드작성을 하고 마지막에 실행을 했는데, 페이지 이동하기와 뒤로가기도 잘 되는데 Tost 메세지가 안뜹니다. 해당 수업 자료로 실행을 해바도 같은데 무슨 문제일까요 ?

안녕하세요! 서버 액션에 관해 궁금한 점이 생겨 질문드립니다.일단 제가 강의를 보고 실습하면서 느꼈던 서버 액션의 큰 장점은 다음과 같습니다.브라우저에서 서버 측에서 사용되는 함수를 실행할 수 있다. => 별도의 백엔드 API를 구현하지 않고도 DB에 직접적으로 접근하는 등의 작업이 가능브라우저와의 상호작용을 하면서도 컴포넌트를 서버 컴포넌트로 유지할 수 있다. 하지만 1번 장점의 경우 혼자 풀스택으로 개발하지 않고 백엔드 개발자와 함께 개발하는 경우에는, 주로 이번 강의와 같이 서버 액션 함수 내에서 별도의 API를 호출하게 될 것이라 생각됩니다.이런 경우에도 기존의 방식대로 onSubmit 등을 사용해서 API를 호출하는 것보다, 2번 장점을 위해 서버 액션을 사용하는 것이 바람직 할지 궁금해 질문드립니다!state를 이용해 실시간 validation이 이루어져야 하는 곳이 아니라면 유용할 것 같다고 생각이 들지만, 구글링을 해봐도 최신 기술이라 그런지 실제 적용 사례를 잘 찾아볼 수 없어 질문 드립니다!

선생님 게시글이 슬러그 필드를 이용해서 고유의 url 형성되는건 알겠는데 만약 제목글이 같은 글의 경우 같은 url이 만들어지면 같은 제목의 여러개의 동일한 url이 생기는게 아닌가요?조금 이해가 안가서요... 

안녕하세요 1.3) 실습용 백엔드 서버 세팅 이후 terminal 에서 npm run start 로 Swagger UI 까지 작동이 되었는데요. 2.1) Page Outer를 소개합니다. 에서 npx create-next-app@14 section02를 진행하고 나면, npm run start 시 에러가 나고 있습니다. SSR 강의를 진행하면서 계속해서 백엔드 서버에 접속을 못하는데 왜 이러는 걸까요? error 사진파일 첨부하였습니다.  

혹시 커서ai말고 젯브레인ai로 강의를 진행해도 진행에 어려움이 없을까요?

안녕하세요, 정환님 궁금한게 있습니다. 동적 경로를 갖는 page.tsx 파일 안에 generateStaticParams 라는 함수를 설정하게되면, 경로에 해당하는 모든 페이지는 모두 Static Page로 만들어지는 것으로 알고 있습니다. return하지 않은 URL Parameter를 갖는 페이지에 대해서도 동일하다고 봤었는데요그렇다면 , 도서 id999번까지 있다고 가정해볼게요return [{id:"1"}] 이렇게만 작성해도 999번까지 static page가 되는게 맞을까요 ?

안녕하세요해당 수업 내용을 안드로이드로 실행시켰을때 세 가지 내용중 두 가가지는 잘 나오는데 기종정보는 alert가 안뜨는데 왜 그런걸까요 ??

선생님~커서에서 코드 수정하고 연동된 깃허브에 커밋도 시켜주었는데,버셀에 최종 마스터가 뜨지 않는데 왜 이런걸까요? ㅠㅠ 어제 저녁 이것땀시 너무 #&!@ 해서 ㅠㅠ커서에 '최종1'이 마스터로 된 화면이고요.. 깃허브에 최종1이 master 로 되어 있는것 같구요? 근데 버셀에서는 그전단계로만 되어 있어서요 ㅠㅠ(근데 사실 이것도 어제 저녁에 계속 마스터로 안되 있어서 버셀에 있는 프로젝트 계속 지우면서 최신 깃허브 가져온거거든요?) 깃허브에 버셀에 제대로 업뎃이 안되는데, 어디부터 봐야할지 좀 도움 좀 주세요~

index.tsx에 getStaticProps로 변경하고 검색을 하면 데이터가 나오질 않습니당..!ㅠ0ㅠ 검색을 한 뒤 페이지를 이동하면 오류 내용은 아래와 같습니다. 챗지피티한테 물어봐도 감이 안 와서 질문 올려봅니다.. import SearchableLayout from "@/components/searchable-layout"; import style from "./index.module.css"; import { ReactNode } from "react"; import BookItem from "@/components/book-item"; import { InferGetStaticPropsType } from "next"; import fetchBooks from "@/lib/fetch-books"; import fetchRandomBooks from "@/lib/fetch-random-book"; export const getStaticProps = async () => { console.log("인덱스 페이지"); const [allBooks, recoBooks] = await Promise.all([ fetchBooks(), fetchRandomBooks(), ]); return { props: { allBooks, recoBooks, }, }; }; export default function Home({ allBooks, recoBooks, }: InferGetStaticPropsType<typeof getStaticProps>) { return ( <div className={style.container}> <section> <h3>지금 추천하는 도서</h3> {recoBooks.map((book) => ( <BookItem key={book.id} {...book} /> ))} </section> <section> <h3>등록된 모든 도서</h3> {allBooks.map((book) => ( <BookItem key={book.id} {...book} /> ))} </section> </div> ); } Home.getLayout = (page: ReactNode) => { return <SearchableLayout>{page}</SearchableLayout>; };