안녕하세요 강사님. chapter03을 할때도 있던 문제와 더불어, chapter04를 진행할때도 문제가 생겨 질문드립니다.제가 궁금한 내용은port 3000번이 이미 사용중이라는 메세지가 뜨는이유(초반에 create ~~명령어를 사용해 my-app 폴더를 만들어 cd my-app , npm start를 쓸땐 port 3000번에 강의영상과 같은 화면이 잘 나왔습니다.) 이것 때문에 실행할때마다 포트번호가 3001, 3002, ... 3010 이런식으로 계속 증가합니다chapter3를 실행할땐 나오지 않던 에러페이지가 chapter4를 실행할때 나오는 이유입니다.(2번문제는 해결해서 에러는 확인해서 처리했습니다. 리턴할때 괄호를 붙이고 써서 나온 에러같아서 수정해보니 되더군요)우선 아래는 Clock.jsx파일입니다.import React from "react"; function Clock(props){ return( <div> <h1>안녕, 리액트!</h1> <h2>현재 시간: {new Date().toLocaleDateString()}</h2> </div> ); } export default Clock;그리고 index.js파일입니다.import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import Library from './chapter_03/Library'; import Clock from './chapter_04/Clock'; const root = ReactDOM.createRoot(document.getElementById('root')); setInterval(()=>{ root.render( <React.StrictMode> <Clock /> </React.StrictMode> ); }, 1000) // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals(); 이를 새 터미널을 활용해 실행시켜보면 다음과 같이 뜨는데요,여기서 y를 눌러 실행을 해보면 아래와 같이 에러가 뜹니다.에러가 나는 이유와 해결방안이 궁금합니다 감사합니다.

설치 항목을 전부 설치하고 다시 설치하고 주소도 바꿔서 해봤는데 types.ts 파일이 생성되지 않는 이유를 알려주세요 ㅠㅠ

setting/ts 를 복사해 사용중 이고, pages/SignUp/index.tsx는 기존 repository 를 복사해서 사용하는게 맞나요? run dev 실행시 ERROR in ./pages/Login/index.tsx:10:24 TS2339: Property 'revalidate' does not exist on type 'SWRResponse<any, any, any>'. 8 | 9 | const LogIn = () => { > 10 | const { data, error, revalidate, mutate } = useSWR('/api/users', fetcher); | ^^^^^^^^^^ 11 | 12 | const [logInError, setLogInError] = useState(false); 13 | const [email, onChangeEmail] = useInput(''); ERROR in ./pages/Login/index.tsx:16:6 TS7006: Parameter 'e' implicitly has an 'any' type. 14 | const [password, onChangePassword] = useInput(''); 15 | const onSubmit = useCallback( > 16 | (e) => { | ^ 17 | e.preventDefault(); 18 | setLogInError(false); 19 | axios ERROR in ./pages/SignUp/index.tsx:10:24 TS2339: Property 'revalidate' does not exist on type 'SWRResponse<any, any, any>'. 8 | 9 | const SignUp = () => { > 10 | const { data, error, revalidate } = useSWR('/api/users', fetcher); | ^^^^^^^^^^ 11 | 12 | const [email, onChangeEmail] = useInput(''); 13 | const [nickname, onChangeNickname] = useInput(''); ^ 에러 로그 가 뜹니다

Vercel로 배포한 사이트에서 캐시 비우기가 잘 안되는거 같아요. Next.js 앱 단 외에 Vercel쪽에서도 캐싱이 되는건가요? 만약 그렇다면 "캐시 비우기" 버튼 구현을 어떻게 하면 될까요? 강의 너무 유익하고 잘 들었습니다 😊

안녕하세요 typescript 설치과정에서 말씀주신대로 다 따라했는데 안되네요 ㅜㅜ제가 따라한 부분은 일단 node_modules 지우고, yarn.lock 파일 지우고 말씀주신대로 17.0.2 버전으로 변경다했습니다.그리고 난후에 tsconfig.json 빈파일로 만들고 yarn install 후yarn dev 하면 다음과 같이 yarn add --dev @types/react 명령어 입력하라고 나오는데 어떻게 해야할지 모르겠네요.. ㅜㅜpackage.json.lcok 파일도 지워봤는데 똑같습니다tsconfig.json파일을 지우면 괜찮은데 tsconfig.json만 빈파일로 만들면 에러가 나오네요

최적화 완성까지 코드를 작성하고, 테스트를 해보면, 최초 로딩에서 DiarayEditor가 계속 두번 렌더링 됩니다. 새로운 react프로젝트를 만든 후 App에 userEffect를 적용후 확인해보니까, App자체가 두번 렌더링(Mount) 되는것 같았습니다. 그 이유를 알 수 있을까요?코드는 아래처럼 간단하게 App.js에 포함하여 확인하였습니다. useEffect(()=> { console.log("App Mount!!"); }, []); 또한 App이 두번 렌더링 되다보니, getData()가 두번씩 수행되는 문제가 있습니다. react의 버전차이인가요?

수정 버튼을 클릭하면 기존 값의 작성자와 내용이 작성되어 있는데 별점도 똑같이 유지 시키고 싶어서 다음과 같이 작성 했습니다.<S.Star onChange={props.setStar} value={props.star !== 0 ? props.star : props.el?.rating ?? 0} />별점을 선택하고 댓글 등록하기 클릭하면 함수를 통해 setStar(0) 초기화도 해주었고수정 아이콘을 클릭했을 때 기존 등록한 별점도 유지되게 했는데 수정하기 버튼을 클릭하면 별점이 0으로 수정이 됩니다.여기서 어느 부분을 건들어야 할지 모르겠어요.

강의 프로젝트를 제로초님 깃헙 코드 참고해서  리액트 쿼리로 다시 만들어 보는중인데요 회원가입 페이지에 SSR 적용하는 과정에서 다음과 같은 에러가 납니다.  코드를 보면//pages/signup.tsx export const getServerSideProps = async (context: GetServerSidePropsContext) => { const cookie = context.req ? context.req.headers.cookie : ''; axios.defaults.headers.Cookie = ''; if (context.req && cookie) { axios.defaults.headers.Cookie = cookie; } const response = await loadMyInfoAPI(); if (response.data) { return { redirect: { destination: '/', permanent: false, }, }; } return { props: {}, }; }; // api/user.ts export function loadMyInfoAPI() { return axios.get('/user').then((response) => response.data); } // routes/user.js router.get('/', async (req, res, next) => { try { if (req.user) { const fullUwerWithoutPassword = await User.findOne({ where: { id: req.user.id }, attributes: { exclude: ['password'] }, include: [ { model: Post, attributes: ['id'] }, { model: User, as: 'Followings', attributes: ['id'] }, { model: User, as: 'Followers', attributes: ['id'] }, ], }); res.status(200).json(fullUwerWithoutPassword); } else { res.status(200).json(null); } 로그인안한 상태에서 유저 정보를 불러오면 null이 반환되서 에러가  나는거 같은데요   const response = await loadMyInfoAPI(); if (response.data) { return { redirect: { destination: '/', permanent: false, }, }; } 이부분을 지우고 다음과 같이 바꿔주면export const getServerSideProps = async (context: GetServerSidePropsContext) => { const cookie = context.req ? context.req.headers.cookie : ''; axios.defaults.headers.Cookie = ''; if (context.req && cookie) { axios.defaults.headers.Cookie = cookie; } return { props: {}, }; };  에러가 사라지는데 지워도 상관없는건가요??  

.env 생성하고 axios.js에서 process.env.REACT_APP_MOVIE_DB_API_KEY를 찾지 못하고 있어요process.env.REACT_APP_MOVIE_DB_API_KEY=00000000

설명보고 따라하였는데 시계가 아닌 오류문구만 뜹니다..무엇이 문제일까요?ㅠㅠ

게시글 상세 화면에서 삭제하기 기능을 구현해주세요.이부분에 대한 레퍼런스 코드가 깃허브에 등록된 내용에는 나오지 않는데 알고 싶습니다

npx-create 시 에러나서user/Appdata/Roaming 경로 아래 npm폴더를 생성하고 재수행했더니 작동했는데 이유가 궁금합니다. 그리고 강사님께서 하시는 방법으로 바꿀수 있는 방법은 없을까요...? 매번 appdata로 가서 폴더 선택하는것이 번잡스러워서요...

props를 사용해 전달 받을 때 어떤 상황에서 중괄호를 사용하고 특히 함수를 전달 받을 때 왜 중괄호가 필요한지 궁금합니다.const DiaryEditor = ({onCreate}) => {return} const DiaryList = ({diaryList}) => {return} const DiaryItem = ({author, content, create_date, emotion, id}) => {return}

안녕하세요! 현재 리액트 초반부 강의 수강중에 있습니다.포트폴리오 코딩중에 있는데 css in js 에서 일반적인 css에서 처럼 전체선택자 *를 사용하여box-sizing: border-box; 로 하고싶은데 검색하봐도 방법이 나오지 않습니다.. css in js 에서 전체선택자는 어떤식으로 사용할 수 있을까요?MDN 처럼 css in js 관련 아카이브가 따로 있을까요?

아래 코드에서 ${emotion} 으로 쓰는것과 그냥 {strDate}랑 하나는 $를 쓰고 하나는 안쓰는거같은데 이거 어떨떄 차이가 나는지좀 알수있을까요??import { useEffect, useState, useContext } from "react"; import MyButton from "./MyButton"; import { useNavigate } from "react-router-dom"; const DiaryItem = ({ id, emotion, content, date }) => { console.log(process.env.PUBLIC_URL + `/assets/emotion${emotion}.png`); const strDate = new Date(parseInt(date)).toLocaleDateString(); const goDetail = () => { Navigate(`/diary${id}`); }; const goEdit = () => { Navigate(`/edit${id}`); }; return ( <div className="DiaryItem"> <div onClick={goDetail} className={[ "emotion_img_wrapper", `emotion_img_wrapper_${emotion}`, ].join(" ")} > <img src={process.env.PUBLIC_URL + `assets/emotion${emotion}.png`} /> </div> <div className="info_wrapper"> <div className="diary_date">{strDate}</div> <div className="diary_content_preview">${content.slice(0, 25)}</div> </div> <div className="btn_wrapper"> <MyButton onClick={goEdit} text={"수정하기"} /> </div> </div> ); }; export default DiaryItem;

WorkspaceLoginif(data == undefind)는 데이터를 받아오기 전에 undefinde여서 무한 로딩중이 떠서 주석처리해주었고 로그인 후 새로고침시 로그인이 풀려버리는데 강의내용의 실습에서는 로그인이 풀리지않는데 고쳐야 될 부분이 있을까요..?

등록 시 화면 페이지는 바뀌는데 바뀌자마자 위와 같은 오류가 떠서 계속 찾아보는데 혼자는 해결하기 어려워 여쭤봅니다 ㅠㅠ 어디가 틀린 걸까요? mutation은 제대로 된 걸 확인했는데 fetch가 안 되네요.폴더 구조는05/boards/new index.js05/boards/products/[productId] index.jsimport { useState } from "react"; import { useMutation, gql } from "@apollo/client"; import { useRouter } from "next/router"; const CREATE_PRODUCT = gql` mutation createProduct( $seller: String $createProductInput: CreateProductInput! ) { createProduct(seller: $seller, createProductInput: $createProductInput) { _id number message } } `; export default function ProductRegPage() { const router = useRouter(); const [seller, setSeller] = useState(); const [name, setName] = useState(); const [detail, setDetail] = useState(); const [price, setPrice] = useState(); const [createProduct] = useMutation(CREATE_PRODUCT); const onClickRegister = async () => { try { const result = await createProduct({ variables: { seller, createProductInput: { name, detail, price, }, }, }); console.log(result); router.push(`/05/boards/products/${result.data.createProduct._id}`); } catch (error) { alert(error.message); } }; const onChangeSeller = (event) => { setSeller(event.target.value); }; const onChangeName = (event) => { setName(event.target.value); }; const onChangeDetail = (event) => { setDetail(event.target.value); }; const onChangePrice = (event) => { setPrice(parseInt(event.target.value)); }; return ( <div> 판매자: <input type="text" onChange={onChangeSeller} /> 상품명: <input type="text" onChange={onChangeName} /> 상품내용: <input type="text" onChange={onChangeDetail} /> 상품가격: <input type="text" onChange={onChangePrice} /> <button onClick={onClickRegister}>상품 등록</button> </div> ); } import { useQuery, gql } from "@apollo/client"; import { useRouter } from "next/router"; const FETCH_PRODUCT = gql` query fetchProduct($productId: ID) { fetchProduct(productId: $productId) { seller name detail price } } `; export default function ProductDetailPage() { const router = useRouter(); console.log(router); const { data } = useQuery(FETCH_PRODUCT, { variables: { productId: router.query.productId }, }); console.log(data); return ( <div> <div>판매자:{data ? fetchProduct?.seller : "loading..."}</div> <div>상품명:{data ? fetchProduct?.name : "loading..."}</div> <div>상품내용:{data ? fetchProduct?.detail : "loading..."}</div> <div>상품가격:{data ? fetchProduct?.price : "loading..."}</div> </div> ); }

위와 같은 에러가 생기는데 규칙을 검사하는 건 문제가 없긴합니다. 에러 내용을 번역해서 봤는데도 무슨 말인지 잘 모르겠고 어떻게 해결해야하는지 감도 안옵니다..

npm ERR! code 1npm ERR! path C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpcnpm ERR! command failednpm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-pre-gyp install --fallback-to-build --library=static_librarynpm ERR! Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --library=static_library --module=C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpc\src\node\extension_binary\node-v115-win32-x64-unknown\grpc_node.node --module_name=grpc_node --module_path=C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpc\src\node\extension_binary\node-v115-win32-x64-unknown --napi_version=9 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v115' (1)npm ERR! node-pre-gyp info it worked if it ends with oknpm ERR! node-pre-gyp info using node-pre-gyp@0.12.0npm ERR! node-pre-gyp info using node@20.4.0 | win32 | x64npm ERR! node-pre-gyp WARN Using needle for node-pre-gyp https downloadnpm ERR! node-pre-gyp info check checked for "C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpc\src\node\extension_binary\node-v115-win32-x64-unknown\grpc_node.node" (not found)npm ERR! node-pre-gyp http GET https://node-precompiled-binaries.grpc.io/grpc/v1.19.0/node-v115-win32-x64-unknown.tar.gznpm ERR! node-pre-gyp http 404 https://node-precompiled-binaries.grpc.io/grpc/v1.19.0/node-v115-win32-x64-unknown.tar.gznpm ERR! node-pre-gyp WARN Tried to download(404): https://node-precompiled-binaries.grpc.io/grpc/v1.19.0/node-v115-win32-x64-unknown.tar.gznpm ERR! node-pre-gyp WARN Pre-built binaries not found for grpc@1.19.0 and node@20.4.0 (node-v115 ABI, unknown) (falling back to source compile with node-gyp) npm ERR! node-pre-gyp http 404 status code downloading tarball https://node-precompiled-binaries.grpc.io/grpc/v1.19.0/node-v115-win32-x64-unknown.tar.gznpm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.4.0npm ERR! gyp info using node@20.4.0 | win32 | x64npm ERR! gyp info oknpm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.4.0npm ERR! gyp info using node@20.4.0 | win32 | x64npm ERR! gyp ERR! find Pythonnpm ERR! gyp ERR! find Python Python is not set from command line or npm configurationnpm ERR! gyp ERR! find Python Python is not set from environment variable PYTHONnpm ERR! gyp ERR! find Python checking if "python3" can be usednpm ERR! gyp ERR! find Python - "python3" is not in PATH or produced an errornpm ERR! gyp ERR! find Python checking if "python" can be usednpm ERR! gyp ERR! find Python - "python" is not in PATH or produced an errornpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python39\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python39\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python39\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python39-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python39-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python39-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python39-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python39-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python38\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python38\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python38\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python38-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python38-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python38-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python38-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python38-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python37\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python37\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python37\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python37-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python37-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python37-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python37-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python37-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python36\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python36\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python36\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\gjaischool\AppData\Local\Programs\Python\Python36-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\gjaischool\AppData\Local\Programs\Python\Python36-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python36-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python36-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python36-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if the py launcher can be used to find Python 3npm ERR! gyp ERR! find Python - "py.exe" is not in PATH or produced an errornpm ERR! gyp ERR! find Pythonnpm ERR! gyp ERR! find Python **********************************************************npm ERR! gyp ERR! find Python You need to install the latest version of Python.npm ERR! gyp ERR! find Python Node-gyp should be able to find and use Python. If not,npm ERR! gyp ERR! find Python you can try one of the following options:npm ERR! gyp ERR! find Python - Use the switch --python="C:\Path\To\python.exe"npm ERR! gyp ERR! find Python (accepted by both node-gyp and npm)npm ERR! gyp ERR! find Python - Set the environment variable PYTHONnpm ERR! gyp ERR! find Python - Set the npm configuration variable python:npm ERR! gyp ERR! find Python npm config set python "C:\Path\To\python.exe"npm ERR! gyp ERR! find Python For more information consult the documentation at:npm ERR! gyp ERR! find Python https://github.com/nodejs/node-gyp#installationnpm ERR! gyp ERR! find Python **********************************************************npm ERR! gyp ERR! find Pythonnpm ERR! gyp ERR! configure errornpm ERR! gyp ERR! stack Error: Could not find any Python installation to usenpm ERR! gyp ERR! stack at PythonFinder.fail (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:330:47)npm ERR! gyp ERR! stack at PythonFinder.runChecks (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:159:21)npm ERR! gyp ERR! stack at PythonFinder.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:228:18)npm ERR! gyp ERR! stack at PythonFinder.execFileCallback (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:294:16)npm ERR! gyp ERR! stack at exithandler (node:child_process:427:5)npm ERR! gyp ERR! stack at ChildProcess.errorhandler (node:child_process:439:5)npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:512:28)npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:291:12)npm ERR! gyp ERR! stack at onErrorNT (node:internal/child_process:483:16)npm ERR! gyp ERR! stack at process.processTicksAndRejections (node:internal/process/task_queues:82:21)npm ERR! gyp ERR! System Windows_NT 10.0.22621npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "configure" "--fallback-to-build" "--library=static_library" "--module=C:\\Users\\gjaischool\\Desktop\\x_test\\chatbot-app-master\\node_modules\\grpc\\src\\node\\extension_binary\\node-v115-win32-x64-unknown\\grpc_node.node" "--module_name=grpc_node" "--module_path=C:\\Users\\gjaischool\\Desktop\\x_test\\chatbot-app-master\\node_modules\\grpc\\src\\node\\extension_binary\\node-v115-win32-x64-unknown" "--napi_version=9" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v115"npm ERR! gyp ERR! cwd C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpcnpm ERR! gyp ERR! node -v v20.4.0npm ERR! gyp ERR! node-gyp -v v9.4.0npm ERR! gyp ERR! not oknpm ERR! node-pre-gyp ERR! build errornpm ERR! node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --library=static_library --module=C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpc\src\node\extension_binary\node-v115-win32-x64-unknown\grpc_node.node --module_name=grpc_node --module_path=C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpc\src\node\extension_binary\node-v115-win32-x64-unknown --napi_version=9 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v115' (1)npm ERR! node-pre-gyp ERR! stack at ChildProcess.<anonymous> (C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpc\node_modules\node-pre-gyp\lib\util\compile.js:83:29)npm ERR! node-pre-gyp ERR! stack at ChildProcess.emit (node:events:512:28)npm ERR! node-pre-gyp ERR! stack at maybeClose (node:internal/child_process:1098:16)npm ERR! node-pre-gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:304:5)npm ERR! node-pre-gyp ERR! System Windows_NT 10.0.22621npm ERR! node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\gjaischool\\Desktop\\x_test\\chatbot-app-master\\node_modules\\grpc\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build" "--library=static_library"npm ERR! node-pre-gyp ERR! cwd C:\Users\gjaischool\Desktop\x_test\chatbot-app-master\node_modules\grpcnpm ERR! node-pre-gyp ERR! node -v v20.4.0npm ERR! node-pre-gyp ERR! node-pre-gyp -v v0.12.0npm ERR! node-pre-gyp ERR! not oknpm ERR! A complete log of this run can be found in: C:\Users\gjaischool\AppData\Local\npm-cache\_logs\2023-10-05T05_36_46_355Z-debug-0.log 이런식으로 오류가 계속납니다 .. 버전을 다운해서 받아도 나고 업그레이드 해도 나고 제발 알려주세요 ㅠㅠ

노트북에서 보면 프로젝트 디렉토리 폴더/파일들이 너무 작아서 안보이네요.