안녕하세요. 강의를 보며 코드를 작성하고 있는데, auth.ts 페이지에서 '{ authorize(credentials: Record<string, string> | undefined): Promise<any>; }' 형식의 인수는 'UserCredentialsConfig<Record<string, CredentialInput>>' 형식의 매개 변수에 할당될 수 없습니다. 'credentials' 속성이 '{ authorize(credentials: Record<string, string> | undefined): Promise<any>; }' 형식에 없지만 'Pick<CredentialsConfig<Record<string, CredentialInput>>, "credentials" | "authorize">' 형식에서 필수입니다.ts(2345) credentials.d.ts(12, 5): 여기서는 'credentials'이(가) 선언됩니다. (parameter) credentials: Record<string, string> | undefined 이런 에러가 발생했습니다. credentials 속성을 타입과 함께 추가해주고, body에서 사용되고 있는 credentials에 ?. 연산자를 이용해 에러를 해결했는데도 이러한 에러가 발생합니다. 이때 500 에러가 같이 발생하는데 해당 에러도 하단에 첨부합니다. GET http://localhost:3000/api/auth/signin 500 (Internal Server Error) processMessage @ webpack-internal:///…t-dev-client.js:233 eval @ webpack-internal:///…ot-dev-client.js:55 handleMessage @ webpack-internal:///…lay/websocket.js:52 index.js:591 Uncaught TypeError: Cannot read properties of undefined (reading 'GET') at eval (webpack-internal:///(rsc)/./src/auth.ts:14:21) at (rsc)/./src/auth.ts (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:182:1) at __webpack_require__ (file:///Users/goorm/Documents/next/y-com/.next/server/webpack-runtime.js:33:43) at eval (webpack-internal:///(rsc)/./src/app/api/auth/[...nextauth]/route.ts:6:63) at (rsc)/./src/app/api/auth/[...nextauth]/route.ts (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:172:1) at __webpack_require__ (file:///Users/goorm/Documents/next/y-com/.next/server/webpack-runtime.js:33:43) at eval (webpack-internal:///(rsc)/./node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapi%2Fauth%2F%5B...nextauth%5D%2Froute&page=%2Fapi%2Fauth%2F%5B...nextauth%5D%2Froute&appPaths=&pagePath=private-next-app-dir%2Fapi%2Fauth%2F%5B...nextauth%5D%2Froute.ts&appDir=%2FUsers%2Fgoorm%2FDocuments%2Fnext%2Fy-com%2Fsrc%2Fapp&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&rootDir=%2FUsers%2Fgoorm%2FDocuments%2Fnext%2Fy-com&isDev=true&tsconfigPath=tsconfig.json&basePath=&assetPrefix=&nextConfigOutput=&preferredRegion=&middlewareConfig=e30%3D!:17:126) at (rsc)/./node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapi%2Fauth%2F%5B...nextauth%5D%2Froute&page=%2Fapi%2Fauth%2F%5B...nextauth%5D%2Froute&appPaths=&pagePath=private-next-app-dir%2Fapi%2Fauth%2F%5B...nextauth%5D%2Froute.ts&appDir=%2FUsers%2Fgoorm%2FDocuments%2Fnext%2Fy-com%2Fsrc%2Fapp&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&rootDir=%2FUsers%2Fgoorm%2FDocuments%2Fnext%2Fy-com&isDev=true&tsconfigPath=tsconfig.json&basePath=&assetPrefix=&nextConfigOutput=&preferredRegion=&middlewareConfig=e30%3D! (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:162:1) at __webpack_require__ (file:///Users/goorm/Documents/next/y-com/.next/server/webpack-runtime.js:33:43) at __webpack_exec__ (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:192:39) at <unknown> (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:193:424) at __webpack_require__.X (file:///Users/goorm/Documents/next/y-com/.next/server/webpack-runtime.js:163:21) at <unknown> (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:193:47) at Object.<anonymous> (file:///Users/goorm/Documents/next/y-com/.next/server/app/api/auth/[...nextauth]/route.js:196:3) at Module._compile (node:internal/modules/cjs/loader:1256:14) at Module._extensions..js (node:internal/modules/cjs/loader:1310:10) at Module.load (node:internal/modules/cjs/loader:1119:32) at Module._load (node:internal/modules/cjs/loader:960:12) at Module.require (node:internal/modules/cjs/loader:1143:19) at mod.require (file:///Users/goorm/Documents/next/y-com/node_modules/next/dist/server/require-hook.js:65:28) at require (node:internal/modules/cjs/helpers:121:18) at requirePage (file:///Users/goorm/Documents/next/y-com/node_modules/next/dist/server/require.js:109:84) at <unknown> (file:///Users/goorm/Documents/next/y-com/node_modules/next/dist/server/load-components.js:59:84) at async loadComponentsImpl (file:///Users/goorm/Documents/next/y-com/node_modules/next/dist/server/load-components.js:59:26) at async DevServer.findPageComponentsImpl (file:///Users/goorm/Documents/next/y-com/node_modules/next/dist/server/next-server.js:671:36) getServerError @ client.js:417 eval @ index.js:591 setTimeout (async) hydrate @ index.js:579 await in hydrate (async) pageBootrap @ page-bootstrap.js:24 eval @ next-dev.js:25 Promise.then (async) eval @ next-dev.js:23 ./node_modules/next/dist/client/next-dev.js @ main.js?ts=1704985593164:192 options.factory @ webpack.js?ts=1704985593164:716 __webpack_require__ @ webpack.js?ts=1704985593164:37 __webpack_exec__ @ main.js?ts=1704985593164:1259 (anonymous) @ main.js?ts=1704985593164:1260 webpackJsonpCallback @ webpack.js?ts=1704985593164:1388 (anonymous) @ main.js?ts=1704985593164:9 Show 6 more frames Show less websocket.js:46 [HMR] connected 확인하시기 쉽게 같은 내용의 사진과 함께 올려드립니다. 그리고 강의 내용 이외의 credentials 관련 코드를 추가하기 전인 auth.ts 파일의 코드도 첨부드립니다. import NextAuth from "next-auth"; import CredentialsProvider from "next-auth/providers/credentials"; export const { handlers: { GET, POST }, auth, signIn, } = NextAuth({ pages: { signIn: "/i/flow/login", newUser: "/i/flow/signup", }, providers: [ CredentialsProvider({ async authorize(credentials) { const authResponse = await fetch(`${process.env.AUTH_URL}/api/login`, { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ id: credentials.username, password: credentials.password, }), }); if (!authResponse.ok) { return null; } const user = await authResponse.json(); return user; }, }), ], }); chap3-1의 auth.ts 코드를 복붙해도 에러가 해결되지 않아 무엇이 원인인지 모르겠습니다. 도움을 주신다면 정말 감사하겠습니다...
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. findPay 메서드가 static이면 이 안에서 호출되는 메서드는 static이어야 하는것 아닌가요? equals 메서드는 String 메서드로 단지 option에만 쓰여서 해당되지 않는 건가용
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] implementation 'com.github.gavlyukovskiy:p6spy-spring-boot-starter:1.9.0' 1.9.0으로 바꾸시면 나올겁니다!
병렬 라우팅과 인터셉팅 라우트를 이용하여 작업중에 있습니다. 예를 들어 /product 라는 페이지에서 생성이라는 버튼을 눌렀을때 /product/write/[id] 로 경로는 이동하며, 병렬 라우팅과 모달이 생성되는것까지는 적용이되었고, 모달을 닫을시에는 closeButton에 router.back()으로 /product로 이동이 되는데 확인라는 버튼을 누를때 원하는것은 /product/[id] 로 경로이동 후 모달이 닫히는걸 예상하였는데 현재는 /product/[id] 로 경로 이동만하고 모달은 그대로 남아있습니다. 이럴경우에는 모달을 boolean 으로 따로 경로 이동후 닫히게 작업을 해줘야할까요? 더 좋은방법이나 제공하는 기능이 있을까해서 질문드립니다.
cd class 이후 react 버전 변경 시 아래와 같은 오류가 진행됩니다. 어떻게 해결해야할까요..ㅠㅠ Usage Error: The nearest package directory (C:\Users\user\Desktop\CodeCamp_Frontend_j\class) doesn't seem to be part of the project declared in C:\Users\user. - If C:\Users\user isn't intended to be a project, remove any yarn.lock and/or package.json file there. - If C:\Users\user is intended to be a project, it might be that you forgot to list Desktop/CodeCamp_Frontend_j/class in its workspace configuration. - Finally, if C:\Users\user is fine and you intend Desktop/CodeCamp_Frontend_j/class to be treated as a completely separate project (not e
상황 : router a-> b-> c-> d-> c 로 이동 했을 때 c에서 뒤로가기 이벤트가 발생하면 (혹은 뒤로가기를 누르면) b 로 이동 하도록 구현하고자 합니다. 다만 d에서 뒤로가기 시에는 c로 이동하길 원합니다. 현재 구현 상태는 c : router.push(d) d : router.replace(c) 이 방법은 c 에서 뒤로가기를 눌러도 c로 가버리는 한계가 있습니다. 따라서, replace(c) 이전에 history에서 직접 c를 제거해 주는 방법을 생각 중인데, (앱 개발할 때 가능했던 기억이 있어서) 검색을 해도 답을 찾지 못하고 있습니다. 답변 주시면 감사하겠습니다 !
안녕하세요 강사님 productAdminEx 문제에 관련해서 질문이 있습니다. productNames[productCount] = scanner.nextLine(); 이게 원래 배우던 형식으로는 두번째 사진처럼 for문 안에서 productNames[i] = scanner.nextLine(); 이런식이어서 예를들어 i = 0인경우 productNames 배열의 0번째 인덱스에 scanner.nextLine();으로 사용자가 입력한 값이 들어가는건 이해가 가는데 productNames[productCount] = scanner.nextLine(); 면 productNames배열 안에 있는 productCount에 scanner.nextLine();로 사용자가 입력한 값을 넣는건가요..? 그리고 그 사용자가 입력한 값이 들어가있는 productCount를 productNames배열이 위치를 참조하고 있는걸까요?? 이해가 잘 안가서 질문드립니다. (첫번째 사진) (두번째 사진) productNames[productCount] = scanner.nextLine(); 이게 productNames의 배열 자리에 productCount의 값을 넣는다는 의미인가요? 이해가 안갑니다..ㅜ
[질문 내용] 강의 내용 중 "외래키를 꼭 사용해야할까?" 에 대한 물음에 두 가지 방안을 주셨는데요. 빠른 처리가 중요하며 실시간 트래픽이 많은 시스템인 경우 -> "외래키를 사용하지 않는 쪽도 고려해볼만 함" 돈이 왔다갔다 하는 등의 reliablity가 중요한 시스템인 경우 -> "외래키를 꼭 사용하라" 그렇다면 질문이 있습니다.질문 1. 만약 외래키 제약조건이 관계형 DB에 이미 걸려있는 상태라면 Java 코드상에서는 아무런 설정 없이 비즈니스 로직을 개발해도 되나요?질문 2. 만약 외래키 제약조건이 관계형 DB에 걸려있지 않고 관계형 DB의 성능상의 이슈로 외래키 제약 조건을 애플리케이션에서 해결해야 한다면 해당 로직 또한 개발해야 하나요? 즉, JPA가 외래키 제약 조건을 체크해주는 기능이 있는지 궁금합니다.
========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 주소창에 입력할 때static 폴더에 있는 hello-static과 index는 확장자 (.html)을 붙여야 하고templates 폴더에 있는 hello는 .html을 붙이면 안되는? 걸로 알고 있는데 이유가 궁금합니다! hello는 th: 문법을 사용해서 그런건가요? 확실하게 이유를 알고 싶습니다 ㅎㅎ
디렉토리를 만들고 그 안에 layout.tsx 파일이나 page.tsx 파일을 만들 때 이름을 layout, page로 다 통일하는 것이 일반적인가요? 아니면 내가 만드려는 layout, page 별로 이름을 다르게 하는지 궁금합니다. (예를 들어 explore-page.tsx 이렇게요!)
안녕하세요 현재 MacBook Air 2022( macOS Sonoma | version 14 | Apple M1)으로 수강 중 입니다 yarn 설치시 오류가 발생합니다 ✔ Would you like to use TypeScript? … No / Yes ✔ Would you like to use ESLint? … No / Yes ✔ Would you like to use Tailwind CSS? … No / Yes ✔ Would you like to use src/ directory? … No / Yes ✔ Would you like to use App Router? (recommended) … No / Yes ✔ Would you like to customize the default import alias (@/*)? … No / Yes Creating a new Next.js app in /Users/namgyukim/Desktop/codecamp-frontend-NGK/class. Using npm. Initializing project with template: default Installing dependencies: - react - react-dom - next added 22 packages, and audited 23 packages in 8s 3 packages are looking for funding run npm fund for details found 0 vulnerabilities Initialized a git repository. Success! Created class at /Users/namgyukim/Desktop/codecamp-frontend-NGK/class npm notice npm notice New patch version of npm available! 10.2.3 -> 10.2.5 npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.2.5 npm notice Run npm install -g npm@10.2.5 to update! npm notice namgyukim@NAMui-MacBookAir codecamp-frontend-NGK % cd class namgyukim@NAMui-MacBookAir class % yarn add next@12.1.0 react@17.0.2 react-dom@17.0.2 --exact zsh: command not found: yarn namgyukim@NAMui-MacBookAir class % npm install -g yarn npm ERR! code EACCES npm ERR! syscall mkdir npm ERR! path /usr/local/lib/node_modules/yarn npm ERR! errno -13 npm ERR! Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/yarn' npm ERR! [Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/yarn'] { npm ERR! errno: -13, npm ERR! code: 'EACCES', npm ERR! syscall: 'mkdir', npm ERR! path: '/usr/local/lib/node_modules/yarn' npm ERR! } npm ERR! npm ERR! The operation was rejected by your operating system. npm ERR! It is likely you do not have the permissions to access this file as the current user npm ERR! npm ERR! If you believe this might be a permissions issue, please double-check the npm ERR! permissions of the file and its containing directories, or try running npm ERR! the command again as root/Administrator. npm ERR! A complete log of this run can be found in: /Users/namgyukim/.npm/_logs/2024-01-08T14_45_08_725Z-debug-0.log 어떻게 해야 다음 단계로 넘어갈 수 있을까요?
안녕하세요 ! APIs 생성하기 섹션을 들으며 연습하고 있는데요. 사용자 ID 값이 10 보다 큰 경우에는 404 에러를 출력하고 나머지 경우에는 사용자 정보를 반환하도록 작성해주신 GET 메서드 코드를 따라 작성했고, 포스트맨에서 정상 작동함을 확인하였습니다. 강사님 코드 import { NextRequest, NextResponse } from "next/server"; export function GET( request: NextRequest, { params }: { params: { id: number } } ) { // 사용자 ID 값이 10보다 큰 경우 404 오류 출력 if (params.id > 10) { return NextResponse.json({ error: "USER NOT FOUND" }, { status: 404 }); } // 사용자 정보를 응답으로 전달 return NextResponse.json([ { id: 1, name: "Jieun" }, { id: 2, name: "Hansol" }, ]); } 따라하다가 문득, 전체 사용자 정보가 아니라 해당 id 에 해당하는 사용자 정보를 출력하고 싶어, 아래와 같이 코드를 수정하였습니다. 코드에 문제가 없다 생각했는데 에러를 출력하더라구요 ㅠㅠ 에러 코드 import { NextRequest, NextResponse } from "next/server"; export function GET( request: NextRequest, { params }: { params: { id: number } } ) { const userData = [ { id: 1, name: "Jieun" }, { id: 2, name: "Hansol" }, ]; const user = userData.find((user) => user.id === params.id); if (!user) { return NextResponse.json( { error: "사용자를 찾을 수 없습니다" }, { status: 404 } ); } return NextResponse.json(user); } `user` 를 잘 찾지 못하는 것 같아서 혹시 id 타입 문제인가 해서 params.id 의 타입을 바꾸고 실행하였더니 정상 작동 하였습니다. 정상 작동했던 코드 1 import { NextRequest, NextResponse } from "next/server"; export function GET( request: NextRequest, { params }: { params: { id: string } } ) { const userData = [ { id: 1, name: "Jieun" }, { id: 2, name: "Hansol" }, ]; const requestedId = parseInt(params.id); const user = userData.find((user) => user.id === requestedId); if (!user) { return NextResponse.json( { error: "사용자를 찾을 수 없습니다" }, { status: 404 } ); } return NextResponse.json(user); } 정상 작동했던 코드 2 import { NextRequest, NextResponse } from "next/server"; export function GET( request: NextRequest, { params }: { params: { id: number } } ) { // Mock user data const userData = [ { id: 1, name: "Jieun" }, { id: 2, name: "Hansol" }, ]; const requestedId = typeof params.id === "string" ? parseInt(params.id, 10) : params.id; const user = userData.find((user) => user.id === requestedId); if (!user) { return NextResponse.json( { error: "사용자를 찾을 수 없습니다" }, { status: 404 } ); } // Return the user information return NextResponse.json(user); } 질문입니다! API 호출 시 전달되는 매개변수 params.id 의 타입은 GET 메소드 매개변수 선언시 지정해주는 타입으로 정해지는건가요? string 타입인거라면 강사님 코드가 실행되지 않았어야 하고, number 타입이라면 저의 에러코드 또한 실행되었어야 하는데 왜 정상적으로 작동하지 않았는지 궁금합니다.
