안녕하세요! 섹터 52이후 수업을 진행하는데자꾸 비쥬얼 스튜디오 터미널에 jwt must be provided: {"response":{"errors":[{"message":"jwt must be provided","locations":[{"line":3,"column":9}],"path":["restoreAccessToken"],"extensions":{"code":"INTERNAL_SERVER_ERROR","exception":{"name":"JsonWebTokenError","message":"jwt must be provided","stacktrace":["JsonWebTokenError: jwt must be provided"," at Object.module.exports [as verify] (/codecamp_backend_api/node_modules/jsonwebtoken/verify.js:53:17)"," at RestoreAccessTokenService.createAccessToken (/codecamp_backend_api/dist/api/token/services/mutation/restoreAccessToken.service.js:38:31)"," at runMicrotasks (<anonymous>)"," at processTicksAndRejections (internal/process/task_queues.js:93:5)"]}}}],"data":null,"status":200,"headers":{}},"request":{"query":"\n mutation {\n restoreAccessToken {\n accessToken\n }\n }\n"}}라는 오류가 뜹니다 getAccessToken.ts 부문 뮤테이션에서 오류 나는거 같은데 혹시 왜이러는지 알 수 있을까요?

안녕하세요 선생님 이번에 쇼핑몰 강의가 업데이트가 되었길래 강의를 들어보려고 합니다그런데 제가 도커 강의도 한번 들어보고 싶은데 도커에 도자도 모르는 상태인데 수업을 따라갈만 할까요?? 항상 좋은 강의 감사합니다

안녕하세요 제로초님 저는 폴더 구조를 한 폴더안에 프론트 백엔드 담겨있지않고 다 따로 두고 있는데 그럴경우에 람다도 따로 보관해도 되는지 궁금합니다 아니면 지금 임시로 백엔드 폴더 안에 두고 진행하고있는데 괜찮은지 궁금합니다!

공식문서에 vscode 디버깅 셋팅은 나와잇지만모노레포인 경우의 디버깅 셋팅은 알려주지 않고잇습니다.모노레포인 경우 공식문서대로 셋팅하면 안되더라고요이 문제를 해결하기 위해vscode 공식문서 - 없음next.js 공식문서 - 없음github에서 next.js 프로젝트 찾아서 디버깅 셋팅되잇는지 하나하나 살펴봄 - 20개 정도 찾아봣지만 못찾음오픈채팅방 - 답변받지 못함stack overflow - 못찾음몇몇 외국인에게 직접적인 도움 요청- 본인도 모르니 알게되면 알려달라는 답변모노레포에서 디버깅 셋팅이 가능한지 알고싶습니다또 webstorm에서는 모노레포 next.js 사용시풀스택 디버깅이 가능한지 알고싶습니다.

커뮤니티 리스트 ui생성 강의 부분에서 맨앞 내용에서 상위 커뮤니티 데이터를 가져오는 부분이const {data: topsubs} = useSWR<Sub[]>(address,fetcher) 부분 undefined가 나오네요 ㅠ 소스코드가 확인해서 오타도 확인해봤는데 원인을 찾지못했습니다. 혹시 짐작가는 부분이 있으시나요?

안녕하세요, 강의 잘 듣고 있습니다.18강에서 궁금한 점이 있어 질문드립니다. useStores 함수에서 return 값에 다음과 같이 괄호가 들어가 있는 이유가 무엇인가요?return { initializeStores, } 답변 주시면 감사하겠습니다.

선생님 안녕하세요 수업 잘듣고있습니다!freebord 폴더로docker-compose up 했는데 오류가 났어요혼자해볼려했지만 잘안되서 올려요../boards/[boardId]/index.tsximport { gql, useQuery } from "@apollo/client"; import { useRouter } from "next/router"; import { IQuery, IQueryFetchBoardArgs, } from "../../../../src/commons/types/generated/types"; import BoardWrite from "../../../../src/components/units/board/write/BoardWrite.container"; const FETCH_BOARD = gql` query fetchBoard($boardId: ID!) { fetchBoard(boardId: $boardId) { writer title contents youtubeUrl boardAddress { zipcode address addressDetail } images } } `; export default function BoardsEditPage() { const router = useRouter(); if (typeof router.query.boardId !== "string") { alert("올바르지 않은 게시글 아이디입니다."); void router.push("/"); return <></>; } const { data } = useQuery<Pick<IQuery, "fetchBoard">, IQueryFetchBoardArgs>( FETCH_BOARD, { variables: { boardId: router.query.boardId } } ); return <BoardWrite isEdit={true} data={data} />; } #0 95.00 Error occurred prerendering page "/boards/[boardId]". Read more: https://nextjs.org/docs/messages/prerender-error #0 95.00 ReferenceError: alert is not defined #0 95.00 at BoardDetail (/freeBoard_/.next/server/pages/boards/[boardId].js:308:9) #0 95.00 at d (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:33:498) #0 95.00 at bb (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:16) #0 95.00 at a.b.render (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:42:43) #0 95.00 at a.b.read (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:41:83) #0 95.00 at Object.exports.renderToString (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:52:138) #0 95.00 at Object.renderPage (/freeBoard_/node_modules/next/dist/server/render.js:751:45) #0 95.00 at Object.defaultGetInitialProps (/freeBoard_/node_modules/next/dist/server/render.js:389:51) #0 95.00 at Function.getInitialProps (/freeBoard_/.next/server/pages/_document.js:530:20) #0 95.00 at Object.loadGetInitialProps (/freeBoard_/node_modules/next/dist/shared/lib/utils.js:69:29) #0 95.00 #0 95.00 Error occurred prerendering page "/boards/[boardId]/edit". Read more: https://nextjs.org/docs/messages/prerender-error #0 95.00 ReferenceError: alert is not defined #0 95.00 at BoardsEditPage (/freeBoard_/.next/server/pages/boards/[boardId]/edit.js:48:9) #0 95.00 at d (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:33:498) #0 95.00 at bb (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:16) #0 95.00 at a.b.render (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:42:43) #0 95.00 at a.b.read (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:41:83) #0 95.00 at Object.exports.renderToString (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:52:138) #0 95.00 at Object.renderPage (/freeBoard_/node_modules/next/dist/server/render.js:751:45) #0 95.00 at Object.defaultGetInitialProps (/freeBoard_/node_modules/next/dist/server/render.js:389:51) #0 95.00 at Function.getInitialProps (/freeBoard_/.next/server/pages/_document.js:530:20) #0 95.00 at Object.loadGetInitialProps (/freeBoard_/node_modules/next/dist/shared/lib/utils.js:69:29) #0 95.00 info - Generating static pages (2/8) #0 95.04 info - Generating static pages (4/8) #0 95.04 [] #0 95.05 info - Generating static pages (6/8) #0 96.43 info - Generating static pages (8/8) #0 96.43 #0 96.43 > Build error occurred #0 96.43 Error: Export encountered errors on following paths: #0 96.43 /boards/[boardId] #0 96.43 /boards/[boardId]/edit #0 96.43 at /freeBoard_/node_modules/next/dist/export/index.js:498:19 #0 96.43 at runMicrotasks (<anonymous>) #0 96.43 at processTicksAndRejections (internal/process/task_queues.js:95:5) #0 96.43 at async Span.traceAsyncFn (/freeBoard_/node_modules/next/dist/trace/trace.js:75:20) #0 96.43 at async /freeBoard_/node_modules/next/dist/build/index.js:1024:17 #0 96.43 at async Span.traceAsyncFn (/freeBoard_/node_modules/next/dist/trace/trace.js:75:20) #0 96.43 at async /freeBoard_/node_modules/next/dist/build/index.js:898:13 #0 96.43 at async Span.traceAsyncFn (/freeBoard_/node_modules/next/dist/trace/trace.js:75:20) #0 96.43 at async Object.build [as default] (/freeBoard_/node_modules/next/dist/build/index.js:82:25) #0 96.55 error Command failed with exit code 1. #0 96.55 info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. ------ failed to solve: executor failed running [/bin/sh -c yarn build]: exit code: 1

 @layer base { #__next { display: contents; } }#__next를 레이어 두어 스타일링 명시도를 낮춘 것에 대한 이유가 궁금합니다.혹시 next.js 내부에서 (프레임워크 내부에서) id : __next 를 스타일링하면 내가 작성한 코드보다 우선시 되도록 하기 위함인가요??

안녕하세요 선생님,yarn을 사용중이었는데, Ubuntu에서 npm이 아니라 yarn을 설치하면 되겠죠?

안녕하세요 강의 감사합니다. 잘듣고잇습니다.헤더에서 처음보는 값이 잇는데x-nextjs-cache:STALEhit는 알겟습니다. stale이 라고 표기되는 기준이 무엇인가요?서버의 최신 값이 아닌걸 어떻게 알죠?revalidate 되기 전에는 hit 로 표기되고revalidate 되는 동안에는 stale 표기가 되는 건가요?그리고 추측이 맞다면 revalidate 되는 동안이라는건 서버에 다시 요청보내고 응답받을때 까지를 말하는게 맞을까요?(* 여기는 읽으실 필요 없습니다. 질문이랑 같이 메모한거에요그리고 revalidate 되었는데 값이 안바뀌면 캐시는 stale이라하더라도 e-tag로 2차 검증하고 태그 값이 같아서 그래도 사용한다 (강의 내용 그대로)값이 바뀌면 hit 되고 e-tag값도 갱신한다. )

ssr인데 해당 html에 연결된 js 파일이 있어서 js파일로 동적으로 렌더링하면 ssr로 내려진 html 자체는 캐시가 가능한가요?*ex) ssr로 받아온 infren.html 안에 user.js 파일 있고user.js에서 ajax로 사용자 이름만 json으로 받아와 렌더링하면 infren.html과 user.js은 캐시할 수 있나요???

state 끌어올리기 수업부분에서 계속 이런 오류가 나서 문의드립니다. 혹시나 해서 다른 서버들은 종료를 해놓고 이것만 다시 실행을 했는데도 계속 오류가 발생하네요. 어떤부분이 잘못된 것인가요?

이미지를 업로드 후 받아오는 url을 통해, 이미지를 로딩해오는 과정에서 오류가 발생해서 질문드립니다.data는 uploadFile mutation 후 받아온 result에 대한 출력 결과이고, 여기서 받아온 url을 https://storage.googleapis.com/. 뒤에 붙여서 이미지를 불러오려고 하면 오류가 발생합니다. 이 부분에 대한 에러를 해결할 수가 없어서 질문드립니다.

안녕하세요 강사님. 먼저 강의 감사히 잘 듣고 있습니다.다름이 아니라 API Routes로 프로젝트를 변경한 이후 아래와 같은 에러가 발생합니다.아래 자막에 달아 두신 것과 같이 .env파일도 정상적으로 배포한 사이트로 바꿔 두었고 혹시몰라 JSON파일에 대한 파싱문제가 있는것인지 확인하고 싶습니다.https://github.com/eugene028/NextJsMapgithub주소도 남깁니다. 잘 되다가 API Routes로 변경하니까 이런 에러가 뜨네요!! ㅜㅜ

안녕하세요. 로그인 버튼 클릭시 콘솔창에 다음과 같은 에러가 발생합니다.rebaseError: Firebase: Error (auth/auth-domain-config-required). at createErrorInternal (index-16e22603.js:497:1) at _assert (index-16e22603.js:503:1) at getIframeUrl (index-16e22603.js:9318:1) at _openIframe (index-16e22603.js:9343:1) at async BrowserPopupRedirectResolver.initAndGetManager (index-16e22603.js:9609:1) w https://firebase.google.com/docs/reference/js/v8/firebase.auth.Auth공식 문서를 보니 authDomain configuration is not provided 일때 발생하는 에러라고 합니다.auth/auth-domain-config-requiredThrown if authDomain configuration is not provided when calling firebase.initializeApp(). Check Firebase Console for instructions on determining and passing that field.아래는 로그인버튼 컴포넌트에 onClick입니다.코드상에는 에러가 발생하지 않았습니다.<GoogleLoginButton onClick={() => { signInWithPopup(FirebaseClient.getInstance().Auth, provider) .then((result) => { console.info(result.user); }) .catch((error) => { console.error(error); }); }} />루트 폴더에 .env 파일도 잘 있구요 ㅜㅜ아래는 루트 폴더에 next.config.js 파일입니다.module.exports = { reactStrictMode: true, publicRuntimeConfig: { publicApiKey: process.env.publicApiKey || '', authDomain: process.env.FIREBASE_AUTH_HOST || '', projectId: process.env.projectId || '', }, }; 로그인 버튼 컴포넌트도 강사님 코드와 일치합니다..아래는 models/firebase_client.ts 입니다.원인이 뭘까요!?import { initializeApp, getApps } from 'firebase/app'; import { Auth, getAuth } from 'firebase/auth'; import getConfig from 'next/config'; const { publicRuntimeConfig } = getConfig(); /** 환경변수는 node.js이기 때문에 서버에서 사용할 수 있고, 클라이언트에서 바로 접근할 수 없기 때문에 config 설정을 해주고 * 아래처럼 가져와서 쓸 수 있도록 해준다. */ const FirebaseCredentials = { apiKey: publicRuntimeConfig.apiKey, authDomain: publicRuntimeConfig.authDomain, projectId: publicRuntimeConfig.projectId, }; /** Firebase의 Authentication 모듈을 사용하기 위해 FirebaseClient 클래스를 정의하는 코드 */ export default class FirebaseClient { private static instance: FirebaseClient; private auth: Auth; /** 이미 초기화된 Firebase 애플리케이션이 있는지 검사하고, 없다면 FirebaseCredentials를 사용하여 Firebase 애플리케이션을 초기화 */ public constructor() { /** 앱이 몇 개 있는지 찾는 것 */ const apps = getApps(); /** 앱이 한 번도 초기화되지 않았다면 초기화를 시작 */ if (apps.length === 0) { console.info('firebase client init start'); initializeApp(FirebaseCredentials); } /** 초기화가 되었으면 Auth를 가져와서 할당 */ this.auth = getAuth(); console.info('firebase auth'); } /** 인스턴스를 가져옴 */ public static getInstance(): FirebaseClient { if (FirebaseClient.instance === undefined || FirebaseClient.instance === null) { FirebaseClient.instance = new FirebaseClient(); } return FirebaseClient.instance; } /** auth를 반환 */ public get Auth(): Auth { return this.auth; } }

강사님 안녕하세요. 이 전 질문에 대한 답변으로 get 요청에 대한 문제는 해결했습니다 감사합니다^^그런데 이후 다음과 같은 문제가 발생하였습니다. package-lock.json 삭제하고, node_modules 폴더도 삭제한 뒤 yarn 으로 패키지 재설치하였고,yarn dev, yarn build 등 명령어를 입력하면 다음과 같은 에러 메시지가 출력되면서 localhost:3000에 진입할 수 없습니다.@types/react를 최신버전으로 다시 설치해봤고, 강의에서 사용중인 버전인 ^17.0.37으로도 다시 설치해봤고, vscode 종료 후 재실행하여도 동일한 에러메시지가 계속 출력됩니다.해당 에러 메시지는 npm run dev 명령어를 입력해도 @types/react를 설치하라는 에러가 발생합니다.자체 해결https://stackoverflow.com/questions/71843307/next-js-is-not-recognizing-types-react위 스택오버플로우 답변을 보고 @types/react 버전을 18.0.1 버전으로 변경했습니다. 결과적으로 문제는 해결되었습니다.그러나 의문점은, 강의에서 사용하는 버전은 ^17.0.37인데 저의 경우만 18.0.1버전으로 변경해야 작동하는 것인지?아니면 다른 분들도 작동하지 않으시는지? 저만 그런것이라면 원인이 무엇일지 궁금합니다. ready - started server on 0.0.0.0:3000, url: http://localhost:3000 info  - Loaded env from /Users/hanair/dev/blahx2/.env It looks like you're trying to use TypeScript but do not have the required package(s) installed. Please install @types/react by running:         yarn add --dev @types/react If you are not trying to use TypeScript, please remove the tsconfig.json file from your package root (and any TypeScript files in your pages directory). error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.  package.json 파일은 다음과 같습니다.{   "name": "blahx2",   "private": true,   "scripts": {     "dev": "next dev",     "build": "next build",     "start": "next start",     "lint": "next lint"   },   "dependencies": {     "@chakra-ui/react": "1.8",     "@emotion/react": "^11.10.6",     "@emotion/styled": "^11.10.6",     "firebase": "^9.20.0",     "firebase-admin": "^11.7.0",     "framer-motion": "^6.5.1",     "next": "12.0.7",     "react": "17.0.2",     "react-dom": "17.0.2",     "styled-components": "^5.3.3"   },   "devDependencies": {     "@types/node": "^16.11.13",     "@types/react": "^17.0.58",     "@types/styled-components": "^5.1.18",     "@typescript-eslint/eslint-plugin": "^5.8.0",     "@typescript-eslint/parser": "^5.8.0",     "babel-eslint": "^10.1.0",     "babel-plugin-styled-components": "^2.0.2",     "eslint": "8.4.1",     "eslint-config-airbnb": "^19.0.2",     "eslint-config-airbnb-base": "^15.0.0",     "eslint-config-airbnb-typescript": "^16.1.0",     "eslint-config-next": "12.0.7",     "eslint-config-prettier": "^8.3.0",     "eslint-plugin-babel": "^5.3.1",     "eslint-plugin-import": "^2.25.3",     "eslint-plugin-jsx-a11y": "^6.5.1",     "eslint-plugin-prettier": "^4.0.0",     "eslint-plugin-react": "^7.27.1",     "eslint-plugin-react-hooks": "^4.3.0",     "prettier": "^2.5.1",     "typescript": "^4.5.4"   } }

안녕하세요 제로초님 늦은 밤에 죄송합니다현재 이미지 업로드하고 미리보기까지 나오는거 확인하고 올렸는데 성공했다고만 뜨고 정작 이미지 파일만 빼고 post성공한거같습니다 그리고 게시글은 올려 지긴 하나 사진 빼고 내용만 나옵니다 지금까지 콘솔내용을 보고 Images에 어떻게 넣을까 고민하다가 postform하고 백에서 routes/post.js부분을 건드려봤지만 아무런 성과가 없었습니다 에러도 안나와서 어딜봐야할지 잘모르겠습니다 ㅠㅠ

Nextjs 버전을 내리고 강의 버전과 똑같이 맞춰서 사용할 지, 아니면 문법을 수정하여 학습해야 할 지 모르겠습니다.. index.tsx 구조 다른거부터 머리아프네요 ㅜㅜ... 강의에서 사용하신 버전도 알려주세요!

안녕하세요. 강의를 듣고 있는 수강생 입니다. 강의 관련 기본 지식이 부족하다 보니, 여러 번 듣게 되는데요. 섹션 1에 대한 강의노트가 없는 것 같습니다. (draw.io diagram file)혹시 받을 수 있는지 문의 드립니다. 감사합니다.

vim env 까지 진행 해서 password까지는 문제 없이 실행이 되어서, dialect: "mysql" 여기까지 실행이 되다가 에러가 뜬 거 같거든요..ubuntu@ip-172-31-15-69:~$ cd serverjs-nextproject/ ubuntu@ip-172-31-15-69:~/serverjs-nextproject$ npx sequelize db:create Sequelize CLI [Node: 14.21.3, CLI: 6.6.0, ORM: 6.28.0] Loaded configuration file "config/config.js". ERROR: Dialect undefined does not support db:create / db:drop commands ubuntu@ip-172-31-15-69:~/serverjs-nextproject$ ls app.js controllers models node_modules package.json routes config index.js mysql-apt-config_0.8.13-1_all.deb package-lock.json passport uploads ubuntu@ip-172-31-15-69:~/serverjs-nextproject$ cd node_modules/ ubuntu@ip-172-31-15-69:~/serverjs-nextproject/node_modules$ ls @mapbox encodeurl memoizee safe-buffer @types es5-ext merge-descriptors safer-buffer abbrev es6-iterator methods semver accepts es6-symbol mime send agent-base es6-weak-map mime-db seq-queue ansi-regex escalade mime-types sequelize ansi-styles escape-html minimatch sequelize-cli anymatch etag minimist sequelize-pool append-field event-emitter minipass serve-static aproba express minizlib set-blocking are-we-there-yet express-session mkdirp setprototypeof array-flatten ext moment side-channel at-least-node fill-range moment-timezone sigmund balanced-match finalhandler morgan signal-exit basic-auth forwarded ms simple-update-notifier bcrypt fresh multer sqlstring bignumber.js fs-extra mysql statuses binary-extensions fs-minipass mysql2 streamsearch bluebird fs.realpath named-placeholders string-width body-parser function-bind negotiator string_decoder brace-expansion gauge next-tick strip-ansi braces generate-function node-addon-api supports-color buffer-from get-caller-file node-fetch supports-preserve-symlinks-flag busboy get-intrinsic nodemon tar bytes glob nopt timers-ext call-bind glob-parent normalize-path to-regex-range chokidar graceful-fs npmlog toidentifier chownr has object-assign toposort-class cli-color has-flag object-inspect touch cliui has-symbols on-finished tr46 color-convert has-unicode on-headers type color-name http-errors once type-is color-support https-proxy-agent parseurl typedarray commander iconv-lite passport uid-safe concat-map ignore-by-default passport-local umzug concat-stream inflection passport-strategy undefsafe config-chain inflight path-is-absolute universalify console-control-strings inherits path-parse unpipe content-disposition ini path-to-regexp util-deprecate content-type ipaddr.js pause utils-merge cookie is-binary-path pg-connection-string uuid cookie-parser is-core-module picomatch validator cookie-signature is-extglob process-nextick-args vary core-util-is is-fullwidth-code-point proto-list webidl-conversions cors is-glob proxy-addr whatwg-url d is-number pseudomap wide-align debug is-promise pstree.remy wkx delegates is-property qs wrap-ansi denque isarray random-bytes wrappy depd js-beautify range-parser xtend destroy jsonfile raw-body y18n detect-libc lodash readable-stream yallist dotenv long readdirp yargs dottie lru-cache require-directory yargs-parser editorconfig lru-queue resolve ee-first make-dir retry-as-promised emoji-regex media-typer rimraf ubuntu@ip-172-31-15-69:~/serverjs-nextproject/node_modules$ mysql-apt-config_0.8.13-1_all.deb, mysql, mysql2 다 잘 깔려 있는데 도대체 모가 문제일까요...ㅠㅠ