POST /book 해당 API에 { "title": "string", "subTitle": "string", "author": "string", "description": "string", "publisher": "string" } 위 body를 넣어서 요청했을 때 { "statusCode": 400, "message": "coverImgUrl는 요청에 포함되지 않아야 합니다", "error": "Bad Request" } 이런 에러가 나오는데 coverImgUrl가 없는데도 불구하고 위 에러가 나오는 이유는 뭘까요? 도서 생성 api는 사용할 수 없는 건가요..?
깃 실습처럼... 몇몇 작업이 에러가 심해서 돌아가려고 '깃 그래프'에서 돌아갈 커밋 위치한 곳에 reset current branch to this commit... 을 눌러 hard를 선택해 주었는데도... 돌아가지를 안네요 콘솔창에서 명령어 git reset --hard 810380ae 도 안먹고... ㅠㅠ(커서에서 에이전시에 시켰는데 810380ae로 돌아가로...여러 터미널 명령어를 실행했는데도 변하질 않네요) 어찌해야 하나요? 다른 방법이 있는지 좀 알려주세요
안녕하세요! 40강 관련 질문입니다. 강의에서 로그인 하는 방식을 두 가지 알려주셨습니다. 서버액션 사용 서버액션 미사용 서버액션 미사용해서 구현할 때 tanstack query 의 mutation 을 사용하는 방식도 좋지 않을까 생각을 하는데요, 로그인 버튼에 loading 처리를 하거나 등 의 이유로요! 근데 제로초님은 useState 만 쓰셨는데, 간단하게 보여주기 위해서 그렇게 하신걸까요? 로그인/회원가입에 tanstack query 를 사용하는 것이 추천하는 방식은 아닌걸까요?? 제가 강의 들으면서 개인프로젝트에 적용하고 있어서, 어떤 방식이 좋은지 고민이 돼서 여쭙니다!
안녕하세요 ~ 강사님 수업 실무적으로 잘 가르쳐주셔서 너무 잘 듣고 만족합니다. 현재 완벽한 프론트엔드코스를 거의 다 소화하고, 풀스택을 배우고자 합니다. 부트캠프에서 만든 고농축 백엔드 코스는 현재 수강한 프론트엔드 코스 내용과 겹치는 강의가 많고 강의량도 많다보니 구매가 고민스로운데요.. 강사님 강의중 관리자 모드와 유저모드간에 통신을 다루는 실무 프로젝트 중심의 백엔드까지 배울수 있는 강의가 있는지 추천받고 싶습니다.
timeouts.current가 useEffect의 input 인자로 들어간거에 대해서 헷갈려서 제가 이해한게 맞는지 1번 확인 부탁드립니다. 2번은 질문입니다. useEffect에서 input 인자에 값이 있으면, componentDidUpdate도 수행한다고 하셨는데요. componentDidUpdate는 state의 값이 변할 때마다 수행이 되는거잖아요. 그러면 timeouts.current값이 변할때마다 useEffect안에 있는 내용이 실행된다는 건데, onClickRedo를 해줬을 때 timeouts.current에 직접 [] 를 설정해줬으므로, 값이 변해서 다시 useEffect를 실행해주는게 맞을까요? timeouts.current[i] 이 부분에서 timetouts.current 의 값이 변하는게 아니라고 하셨는데, 배열에 값을 넣어주는 것이 왜 timeouts.current가 변하는게 아닌건지 잘 모르겠어요...값을 넣어준다해서 배열이 달라지는게 아닌걸까요?
선생님이 가르쳐 주신 웹서비스를 만들고 나서 (컨텐츠,로그인,결제 등 전부 포함), 위의 것들로 커서에서 구글 플레이스토어, 애플 스토어 등에 올릴 수 있나요? 커서와 수파베이스,버셀로 웹페이지 만들어서 사람들하게 공유하는것은 가능한데, 그걸 또 앱 배포용 코드(?)로 변환해서 만들 수 있는지요? 쳇지피티에 물어보면 이미 만들어진 웹서비스를 앱용으로도 가능하다는데... 커서에서도 쉽게(현재까지는 쉽게 배워서 쉽네요 ^^) 변환을 시킬 수 있는지 알고 싶습니다~
안녕하세요! 파이널 과제를 완성하고 레퍼런스 코드를 보며 공부를 하다가 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 47ms SearchResult가 서버 컴포넌트로 만들어져 있어서 서버에서 이미 만들어 가져오기 때문에 fallback이 적용되지 않는건가요? SearchResult를 클라이언트 컴포넌트로 바꿔야지 해결되는 문제인가요?
궁금한 내용 "NextJS에서 클라이언트 컴포넌트도 SSR을 수행하는데, 상호작용이 불가능한 정도의 SSR을 수행하여 리액트 트리를 구성하여 HTML을 만들고, HTML과 함께 클라이언트에 자바스크립트 번들 형태(하이드레이션 용도)로 전달된다." 라고 알고 있는데 맞는 말일까요? 그렇다면, '첫 페이지 로드 시'에만 1번과 같이 동작하고 첫 페이지가 아닌 '다른 페이지'에 들어갈 땐 CSR처럼(JS번들을 클라이언트에게 전달하여 브라우저 단에서 리액트 생명주기 시작) 동작한다면, 강의 중 나온 SearchBar 컴포넌트는 빌드 단계에 렌더링되는 컴포넌트 안에 있다하더라도 CSR될 것인데 Suspense로 래핑하여 클라이언트 단에서 렌더링이 되게끔 강제할 필요가 없지 않나요? 클라이언트 컴포넌트로 선언된 페이지 컴포넌트(create 페이지)가 next/link를 통해 프리패칭된 것을 네트워크 탭을 통해 확인했습니다. 다만, 클라이언트 페이지 컴포넌트 임에도 RSC Playload로 가져온 것을 확인했는데, 이것은 왜 그런 걸까요? 첫 페이지 로드 이후 페이지 이동 시에 CSR로 동작한다하더라도 진입하는 페이지의 RSC Payload와 JS번들은 주기적으로 서버로부터 가져와야하지 않나요? 아래의 그림에는 JS 실행 전에 서버로부터 가져오는 단계가 보이지 않는데 프리 패칭 과정이 생략된 걸까요?
안녕하세요, 강사님. 좋은 강의 감사히 듣고 있습니다! 현재 실제 앱 출시를 목표로 개발을 시작하려고 하는데, Expo와 CLI 중 어떤 방식으로 진행할지 고민 중입니다. 공식 문서에서도 Expo를 권장하고 있고, Prebuild 기능 덕분에 대부분의 네이티브 라이브러리도 사용할 수 있고, 성능 최적화도 많이 이루어진 것으로 알고 있습니다. CLI와 Expo 사이의 런타임 성능이나 최종 번들 용량 차이에 대한 정확한 비교 자료가 부족해 선택이 쉽지 않은 상황입니다. 강사님께서 CLI와 Expo를 모두 사용해보셨을 때, 두 방식 간에 실제 체감되는 성능이나 앱 용량 차이가 유의미했는지 궁금합니다. 만약 차이가 크다면 CLI를 선택하는 쪽이 맞을 것 같기도 한데, 강사님의 의견이 듣고 싶습니다. 감사합니다!
npm ls react "react": "19.0.0", npm ls react-native "react-native": "0.79.2", npm ls expo = "expo": "~53.0.9", 문제: expo go 앱에서 제가 빌드한 앱을 실행하면 로딩이 계속되다가 위와 같은 화면이 뜹니다. 터미널에서도 에러를 찾을 수 없어서 이렇게 질문 드립니다.