안녕하세요!이번 강의를 수강하며 궁금한 게 있어 질문드려봅니다.1. Next.js에서 페이지별 JS가 스플리팅되듯, CSS Modules도 페이지별로 스플리팅되는지 궁금합니다.tailwindCSS를 사용하면 페이지별로 스플리팅 되는지 궁금합니다.소중한 시간 질문 읽어주셔서 감사합니다.

안녕하세요, 강의 잘 듣고 있습니다.Prisma 관련 실습을 따라 하는 중인데, 다음과 같은 문제가 발생해서 문의드립니다.프로젝트 구조 상 prisma/schema.prisma 파일이 분명 존재하고 VSCode에서도 확인됩니다..env 파일에 DATABASE_URL, DIRECT_URL도 정상적으로 설정돼 있습니다.VSCode에서는 schema.prisma 파일이 보이고, Book, Review 모델도 정상적으로 작성되어 있습니다.문제 상황같은 명령어로 확인해봐도 PowerShell에서는 아예 prisma 폴더가 없다고 나옵니다.PS C:\Users\PC\Documents\onebite-books-server-main> npx prisma db Need to install the following packages:prisma@6.5.0Ok to proceed? (y) yEnvironment variables loaded from .envError: Could not find Prisma Schema that is required for this commyour package.json or put it into the default location.Checked following paths:schema.prisma: file not foundprisma\schema.prisma: file not foundprisma\schema: directory not foundSee also https://pris.ly/d/prisma-schema-locationPS C:\Users\PC\Documents\onebite-books-server-main> npx prisma db Environment variables loaded from .envError: Could not find Prisma Schema that is required for this commYou can either provide it with --schema argument, set it as `priChecked following paths:schema.prisma: file not foundprisma\schema: directory not foundSee also https://pris.ly/d/prisma-schema-locationPS C:\Users\PC\Documents\onebite-books-server-main> npx prisma db risma/schema.prismaError: Could not load --schema from provided path `prisma\schemaPS C:\Users\PC\Documents\onebite-books-server-main>PS C:\Users\PC\Documents\onebite-books-server-main> npx prisma db risma/schema.prismaError: Could not load --schema from provided path `prisma\schemaPS C:\Users\PC\Documents\onebite-books-server-main>PS C:\Users\PC\Documents\onebite-books-server-main> npx prisma db risma/schema.prisma하지만 VSCode에서는 명확하게 prisma/schema.prisma 파일이 존재합니다.VSCode에서 prisma/schema.prisma가 분명히 보이는데, 터미널(PowerShell)에서는 왜 인식되지 않는 걸까요?CLI가 해당 파일을 찾을 수 있게 하려면 어떤 방법을 써야 하나요?혹시 Windows 환경에서 자주 발생하는 문제인지, 강의에서 다루는 가이드와 다른 점이 있는지 궁금합니다.

안녕하세요? 궁금한것이 있습니다.보통 React로 csr을 만들어 배포하는데 next.js로 SSR 페이지 없이 CSR app을 만들어 웹서버(NGINX)에 배포할 수 있는지 궁금합니다.그리고 SSR로 배포할때, 일반적으로 Node.js 서버를 DMZ 영역에 구성하는지 아니면, WAS처럼 내부망에 구성하는지도 궁금합니다.

기존 수강자 새로운강의 쿠폰 발급 받을 수 있을까요?

안녕하세요 궁금한 것이 있습니다.Next.js 사전 렌더링 설명에서 유저가 접속 요청을 보낸다고 하면 서버에서 JS를 실행하여 렌더링 된 HTML을 보내게 되고 클라이언트에서 화면에 렌더링을 하고, 후속으로 JS 번들 파일을 보내게 되고 여기서 중요한 점은 CSR과 같이 모든 JS 파일을 번들링 해서 보낸다..??이후 페이지 이동 시 JS 파일이 있기 때문에 서버에 요청을 하지 않고 CSR 방식으로 흘러간다 라고 설명을 해주셨습니다.여기서 궁금한게 있습니다.초기 접속 시 JS 번들링 파일을 CSR과 같이 모든 JS를 보내는건지,,? 아니면 해당 접속 페이지에 해당하는 JS를 본내는 건지가 궁금합니다.검색해보니 Next.js 초기 접속 시 해당 페이지 JS만 번들링 해서 보낸다는 얘기가 있어 헷갈렸습니다.

안녕하세요!좋은 강의 감사합니다이번 강의를 수강하며 개념적으로 궁금한 점이 있어서 질문드려봅니다. ISR로 블로그 글을 revalidate 시간을 24시간으로 많이 넣어둔다고 하셨습니다. 티스토리나 벨로그에선 기존 글을 수정하면 바로 업데이트가 됩니다. 제가 아는 지식으로 ISR을 하게 된다면 24시간 동안 수정해도 기존 데이터를 보여주어야 한다고 생각해서 ISR보단 SSR이 적합하다고 생각했습니다. ISR은 이러한 문제를 해결할 수 있는지 궁금합니다.블로그 글이나 뉴스같은 경우 대량의 데이터이기 때문에 그만큼 대량의 페이지가 HTML 파일로 생성되어 큰 용량을 차지할 것 같다는 생각이 들었습니다.이러한 부분은 어떻게 해결할 수 있는지 궁금합니다.ISR / SSG를 사용하는 페이지 경로로 Next/Link를 사용하여 접속할 경우 클라이언트 사이드 라우팅이 이루어진다고 알고 있습니다. 이 경우 미리 빌드된 HTML 파일을 렌더링하는 ISR/SSG의 장점이 사라지는 것처럼 보이는데, Next/Link에서 ISR/SSG를 사용할 때 어떤 이점이 있는지 궁금합니다.소중한 시간내어 읽어주셔서 감사합니다.

🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

6:29 movie-card-list.tsx파일작성하시기전에혹시 movieActions.ts파일에서 작업을 하셨었나요?? 3000 포트 브라우저에서 저는 스크롤을 내렸는데 false 에서 true로 바뀌지 않았었습니다.

안녕하세요. 질문 있습니다.강의중 Fetching data where it's needed에 관한 설명을 해주셨습니다.https://nextjs.org/docs/14/app/building-your-application/data-fetching/patterns#fetching-data-where-its-needed구조 단순화와 확장성 측면에서 너무 좋은 말이라 생각이 되는데 15버전 부터는 해당 내용이 없어졋더라고요. 혹시 몰라 vercel/github 도 찾아 봤는데 그것에 대한 이슈나 토론도 없어서요. 혹시 이유를 알고 계신지, 권장 이지만 예전 모범 사례일 정돈 아닌건지 궁금해서 질문 드립니다. 감사합니다!!

강의를 거의 다들어가서 해당강의를 Summary해놓을려고 하는데완료된 소스가 있었음 좋겠는데 따로 다운로드 받을수 없는지요?

플레이그라운드 쓸때 저 상자가 계속 유지되고 없어지지 않습니다 ㅠㅠ방법있나요?

  Next.js 버전때문인지 tailwind.config.js가 설치가 안되고 posts.config.mjs가 설치가 됐는데 이게 맞나요 ,,? 

개발하면서 제가 불필요한 렌더링을 줄이기 위한 기법이 아니라, 리액트를 사용하게 되면 자연스럽게 얻을 수 있는 성능 최적화 효과라고 보면 되나요?

최대한 자료를 찾아봐서 이해해보려고 했는데, 너무 헷갈려서 도움을 구하고자 질문을 올립니다.강의에서 search page에는 페이지 이동 시 javascript bundle로써 전달 될 client component가 없기 때문에 그냥 rsc payload만 전달되는 것이라고 하셨는데, searchpage만 보면 client component가 없는 것이 맞지만, (with-searchbar)폴더 안에 layout으로 Searchbar component를 포함시킨 것은 어떻게 되는 것인지 궁금합니다.Searchbar component가 client component이므로 search page에서 직접적으로 import를 하지는 않았지만, 레이아웃으로써 사용되었기에 어쨌든 search page안에 client component가 포함되는 것은 아닌가요?이해가 명확하게 되지 않아 질문조차 조금 난해하게 쓴 것 같아서 죄송합니다!감사합니다.

zustand에 저장과 cookie 저장에 대해 보안적으로는 cookie가 더 안전하다고 들었습니다. xss 공격에는 HttpOnly를 통해 해결할 수 있지만 반환된 accessToken을 js로 접근하지 못하다 보니 저장을 할 수 없는 문제가 있지만secure을 통해 https에서만 요청가게 할 수 있으며, sameSite를 통해 csrf의 공격에 방어할 수 있다 해서 secure, sameSite를 사용해 accessToken을 쿠키에 저장하는게 더 좋은 방법이라 생각 했는데 어떤 방식을 주로 사용하나요?

안녕하세요. 새로 올려주신 강의를 흥미롭게 듣고 있습니다. 저는 아이폰을 이용해서 테스트 중인데, 안드로이드와는 좀 다른 움직임이 있어서 질의드립니다. 권한 설정화면 Link되면 저희가 구성한 하이브리드 앱이 웹뷰로 더 이상 연결되지 않는것처럼 보입니다. 이 부분 어떻게 해결할수 있을까요?그리고 권한 설정화면으로 이동하여 권한을 수정한 후 제거하고 ( 해당 화면은 권한을 설정한다고 해서 사라지거나 하지 않습니다 ) expo로 돌아오면 active가 들어와야 하는데 그렇지 않습니다. 코드에 setInterval을 줬으니 뭔가 주기적으로 수행하지 않을까 싶어서 로그를 줘봤으나 전혀 구동하지 않았습니다. 여러가지 테스트를 해보았는데, 앱권한 설정페이지로 이동하는 쿼리인 openDeviceSystemForSettingSet을 호출하면 앱의 권한 화면이 Link되고, 그러면서 기존의 하이브리드 앱이 웹뷰로 연결되지 않는것 같습니다. 제 코드가 잘못되었나 싶어서 setInterval을 없애고 fetch의 순서를 바꿔봤습니다. openDeviceSystemForSettingSet을 맨뒤에 배치해봤을때는 모든 결과가 잘 들어왔습니다. 그러나 6-2와 같이 openDeviceSystemForSettingSet를 먼저 호출하고 이후에 fetchDeviceLocationforPermissionSet이나 fetchDeviceSystemForAppStateSet의 fetch를 수행하려 하면 작동하지 않습니다. 인공지능에게 문의하니 상태 구독을 하라고 하여 아래와 같이 구독을 mobile의 index.tsx에 추가하였습니다. React.useEffect(() => { const subscription = AppState.addEventListener("change", (nextAppState) => { if (nextAppState === "active") { console.log("✅ 앱이 다시 활성화됨. WebView에 메시지 전송!"); webviewRef.current?.postMessage("APP_ACTIVE"); } }); 그리고 page.tsx에는 app이 active가 되면 이를 받아올수 있도록 함수를 구성하고 그 안에서 fetchDeviceLocationforPermissionSet이나 fetchDeviceSystemForAppStateSet를 받아오도록 변경했습니다.  useEffect(() => { const handleMessage = (event) => { if (event.data === "APP_ACTIVE") { console.log( "🔄 WebView에서 APP_ACTIVE 메시지 수신! fetchApp 다시 실행" ); checkPermissions(); } }; window.addEventListener("message", handleMessage); return () => { window.removeEventListener("message", handleMessage); }; }, []); const checkPermissions = async () => { try { console.log("📡 위치 권한 상태 확인 요청"); const result = await fetchApp({ query: "fetchDeviceLocationforPermissionSet", }); const status = result.data.fetchDeviceLocationforPermissionSet.status; webviewlog(` 위치 권한 상태: ${status}`); const appStateResult = await fetchApp({ query: "fetchDeviceSystemForAppStateSet", }); const isForeground = appStateResult.data.fetchDeviceSystemForAppStateSet.isForeground; webviewlog(` 앱 활성화 상태: ${isForeground}`); } catch (error) { console.error(" fetch 요청 실패:", error); } }; 이렇게 하니 앱이 활성화되면 이벤트 리스너를 통해 결과가 전달되어져 오기는 합니다.강의에서 해주셨던 setInterval설정이 훨씬 간편하지라 아이폰에서 구성하려면 어떻게 해야할지 어떤 이유로 이렇게 되는지 궁금하여 질의드립니다. 2. 그리고, 원두님이 안드로이드를 통해 보여주신 것과 같이 허용함을 다시 묻지 않는데 이런 설정을 별도로 추가해야 하는걸까요? 제가 뭔가 누락한 건지 모르겠습니다. 원두님은 관련코드를 구성하지 않으셔도 사용에 대한 질의가 나타나는데, 저의 경우는 권한 설정기능이 바로 띄워집니다. 일반적인 앱들을 사용하다보면 권한 허용 질의 이후(모달창??)에 허용을 누르고 , 권한설정을 한 후 지도로 들어가고 그렇게 구성되는데 그런 구성이 누락되어 , 웹뷰 연동이 안되는것일까

개발 20년차, 원론적으로 제대로 구조를 배워보고 싶어 영상강의를 듣는데, 정말 오랜만에 제대로 된 강의를 듣는것 같군요. 정말 강의 퀄리티 좋습니다.  잡설이 길었는데~~다름이 아니라, 현재 강이 백엔드API 서버를 NEST.JS 프레임웍을 이용해서 개발하신것 같은데, 다음번 강의는 NEST.JS 어떤 지요? 기다리겠습니다. ㅎ

6:08에 랜더링 이후에 작업을 하기 위해서 after 라는 훅이 추가되었다구 해주시는데 기본적으로 훅 네이밍은 use~~로 시작하는게 권장사항이라고 알고있어서용물론 훅도 그냥 함수긴한데 개념적인 차이가 조금 있다고 생각해서 질문 드립니다!

onclick이벤트 처리는 SCR이라 상단에 'use client";라고 정의해줘야 하는게 아닌지요? 자동으로 CSR로 처리되나요?

Vercel signup이 안되요,, 계속 제 깃허브 계정은 추가 인증이 필요하다며 registration@vercel.com에 문의를 하라고 하네요,,, 이럴땐 진행을 어찌해야할까요,,,