inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

input type="hidden"으로 설정 시, 오류 미발생

해결됨

한 입 크기로 잘라먹는 Next.js

7.2) 리뷰 추가 기능 구현하기 > 15:05~ 두 방식 모두 동일하게 입력 필드를 숨김 처리하지만 1번처럼 input의 type을 hidden으로 설정하게 되면 Next.js에서 오류를 발생시키지 않네요. // 1번 방식 <input type="hidden" name="bookId" value={bookId} /> // 2번 방식 <input hidden name="bookId" value={bookId} />

  • react
  • typescript
  • next.js
Next 댓글 2 좋아요 1 조회수 311

싸이월드 만들기 1탄

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

코드를 아래와 같이 작성하였는데, 이렇게 표시가 됩니다. (사진 참고) 레퍼런스도 참고하여 적었는데 해결이 안 되어서 질문 납깁니다. 또한 fontawesome도 강의 내용대로 연동시키려 하였는데 이모티콘이 보이지 않습니다. 어떻게 해야 할까요? <!DOCTYPE html> <html lang="ko"> <head> <title>홍길동 님의 미니홈피 :: 사이좋은 사람들, 싸이월드</title> <link href="./styles/index.css" rel="stylesheet" /> <script src="https://kit.fontawesome.com/e3aa47cdec.js" crossorigin="anonymous" ></script> </head> <body> <div class="background"> <div class="outerbox"> <div class="wrapper"> <div class="wrapper__left"> <div class="wrapper__left__header"> <!-- TODAY 0 | TOTAL 12345 --> <div class="today"> <span>TODAY</span> <span>0</span> <span> | TOTAL</span> <span>12345</span> </div> </div> <div class="wrapper__left__body"> <div class="left__body__header"> <div class="left__body__header__gray"></div> <div class="left__body__header__line"></div> </div> <div class="left__body__profile"> <div class="profile__detail"> <i class="fa-regular fa-face-grin"></i>이름</div> <div class="profile__detail"> <i class="fa-solid fa-phone"></i>Phone</div> <div class="profile__detail"> <i class="fa-regular fa-envelope"></i>E-mail</div> <div class="profile__detail"> <i class="fa-brands fa-instagram"></i>인스타그램</div> </div> <div class="left__body__footer"> <div class="wrapper__feel"> <div class="feel__title">오늘의 기분</div> <select class="feel__select"> <option>기쁨 😊</option> <option>슬픔 🥲</option> <option>화남 😑</option> <option>분노 🤬</option> </select> </div> </div> </div> <div class="wrapper__right"></div> </div> </div> </div> </body> </html> ------------- css ------------- * { box-sizing: border-box; margin: 0px; } .background { width: 1024px; height: 600px; background-image: url("../images/background.png"); padding: 20px 0px 0px 20px; } .outerbox { width: 808px; height: 544px; background-image: url("../images/outerbox.png"); } .wrapper { display: flex; flex-direction: row; padding: 32px 0 0 32px; } .wrapper__left { width: 208px; height: 472px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; margin-left: 3px; margin-right: 7px; } .wrapper__left__header { width: 100%; height: 30px; display: flex; flex-direction: row; justify-content: center; align-items: center; } .today { padding-top: 10px; font-size: 9px; } .wrapper__left__body { display: flex; flex-direction: column; align-items: center; width: 100%; height: 100%; padding: 20px 30px 0px 30px; border: 1px solid gray; border-radius: 15px; background-color: white; } .left__body__header { width: 100%; display: flex; flex-direction: column; } .left__body__header__gray { width: 148px; height: 133px; background-color: gray; } .left__body__header__line { border-top: 1px dotted black; margin: 12px 0px; } .left__body__profile { font-style: normal; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: flex-start; } .profile__detail { color: #999999; font-size: 10px; margin-bottom: 10px; display: flex; flex-direction: row; } .fas { color: black; margin-right: 10px; width: 5px; height: 5px; } .left__body__footer { width: 100%; margin-bottom: 30px; } .wrapper__feel { display: flex; flex-direction: column; justify-content: center; width: 100%; } .feel__title { font-size: 11px; margin-bottom: 5px; color: gray; } .wrapper__right { width: 524px; height: 472px; background-color: violet; display: flex; flex-direction: column; justify-content: flex-end; padding-left: 5px; }

  • react
  • node.js
  • seo
  • graphql
  • next.js
이세은 댓글 2 좋아요 0 조회수 222

새로운 강의 쿠폰 질문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

개인적인 사정으로 오늘에서야 공지사항을 확인했습니다. 기존의 프론트엔드 고농축 코스를 수강중인데 혹시 쿠폰을 다시 발급 받을 수 있을까요? 답변 부탁드립니다. 좋은 강의 제공해주셔서 감사합니다. (+쿠폰함을 확인해보았지만 제공받은 쿠폰이 없었습니다. )

  • react
  • node.js
  • seo
  • graphql
  • next.js
Jinsol Kim 댓글 2 좋아요 0 조회수 202

브랜치 실제 모양 #HEAD 7분 30초 쯤

해결됨

Git & GitHub, 원리부터 차근차근 - 근본깃

git checkout HEAD^를 통해 현재 가리키는 HEAD가 한 칸 앞으로 이동 했을 때 *분리된 HEAD 라고 표시되던데 *분리된 HEAD 라고 표시되는 이유가 HEAD와 Main(브랜치)가 가리키는 commit이 달라져서 인가요?

  • git
  • github
Lucas 댓글 2 좋아요 0 조회수 180

git diff후 차이 내역을 보는데 저는 내용에 -(마이너스)가 붙어 나옵니다.

해결됨

Git & GitHub, 원리부터 차근차근 - 근본깃

파일 존재 상태 circle (staging area): red, green, blue circle (tracked file) : red, green, blue, white git diff로 비교해 보면 마지막 줄이 -blue 로 붉은 글씨로 표시 되는데, 왜 이러는걸까요? 그리고 아래에 +blue 가 초록색으로 표시됩니다. 이미 추가가 되어 있는데 왜 빼고 더하는지 이해가 잘 안됩니다.

  • git
  • github
Lucas 댓글 2 좋아요 0 조회수 266

git init을 치고 나서 hint라는게 나오는데 무슨 의미인지 잘 이해가 안됩니다.

해결됨

Git & GitHub, 원리부터 차근차근 - 근본깃

안녕하세요 처음 git에 대해 입문하고 있습니다. git init으로 명령어를 입력해서 ls -a 명령어로 .git이 잘 만들어 진 것을 확인 했는데, 만들면서 위 스크린 샷처럼 hint가 나오더라고요. 힌트를 읽어보니 브랜치(?) 이름이 뭔가 중요한거 같은데 어떤 역할을 하는지 궁금합니다.

  • git
  • github
Lucas 댓글 1 좋아요 0 조회수 224

이 강좌를 수강 하면 게시판을 만들수 있나요?

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

강좌 목록에는 페이징 게시글 관련사항이 있는데 Db와 연결해서게시판을 만들 수 있나요

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
nonori123 댓글 1 좋아요 1 조회수 168

docker-compose up 에러 공유 드립니다

미해결

따라하며 배우는 도커와 CI환경 [2023.11 업데이트]

docker-compose.yml version: "3.9" services: redis-server: image: 'redis' container_name: redis-container restart: unless-stopped ports: - "6379:6379" healthcheck: test: ["CMD", "redis-cli", "ping"] interval: 5s timeout: 5s retries: 5 node-app: depends_on: redis-server: condition: service_healthy build: context: . dockerfile: Dockerfile container_name: node-app restart: on-failure ports: - "5000:8080" environment: - REDIS_URL=redis://redis-server:6379 server.js const express = require('express'); const redis = require('redis'); // Redis 클라이언트 생성 const client = redis.createClient({ url: process.env.REDIS_URL }); // Redis 연결 (async () => { try { await client.connect(); // 클라이언트 연결 console.log('Connected to Redis'); } catch (err) { console.error('Redis connection error:', err); } })(); const app = express(); // 초기값 설정 (async () => { try { await client.set('number', 0); } catch (err) { console.error('Failed to initialize Redis key:', err); } })(); app.get('/', async (req, res) => { try { // Redis 값 읽기 및 증가 const number = await client.get('number'); await client.set('number', parseInt(number) + 1); res.send(`숫자가 1씩 올라갑니다. ${number}`); } catch (err) { console.error('Error handling Redis operations:', err); res.status(500).send('Server error'); } }); app.listen(8080, () => { console.log('Server is running on port 8080'); }); node는 18버전 레디스 클라이언트 모듈은 4.7.0 입니다

  • aws
  • docker
  • github
  • ci/cd
  • travis-ci
  • 데이터-엔지니어링
lim3617 댓글 1 좋아요 0 조회수 325

7.6 createReviewAction 서버 액션 컴포넌트에 state 값을 넘기는 것에 관한 질문입니다.

해결됨

한 입 크기로 잘라먹는 Next.js

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

  • react
  • typescript
  • next.js
wldls317 댓글 2 좋아요 0 조회수 170

7.3) 리뷰 조회 기능 구현하기 any type관련 질문입니다.

해결됨

한 입 크기로 잘라먹는 Next.js

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

  • react
  • typescript
  • next.js
wldls317 댓글 2 좋아요 0 조회수 145

Type error: Type '{ params: { id: string | string[]; }; }' does not satisfy the constraint 'PageProps'. 오류 해결

해결됨

한 입 크기로 잘라먹는 Next.js

npm run build 했을 때, 북 상세 페이지에서 오류 발생하시는 분들은 아래와 같이 수정해보시길 바랍니다. 3.6)네비게이팅 진행 중, npm run build를 통해 빌드 시, 아래와 같이 타입 오류가 발생 src/app/book/[id]/page.tsx Type error: Type '{ params: { id: string | string[]; }; }' does not satisfy the constraint 'PageProps'. Types of property 'params' are incompatible. Type '{ id: string | string[]; }' is missing the following properties from type 'Promise<any>': then, catch, finally, [Symbol.toStringTag] 이유: nextjs 최신 버전에서 params가 promise 형태로 바뀌게 되면서 타입 오류가 발생하는 것으로 추정 아래와 같이 타입을 정의 import ClientComponent from "@/app/components/ClientComponent"; type PageParams = Promise<{ id: string }>; const Page = async ({ params }: { params: PageParams }) => { const { id } = await params; return ( <div> Page {id} <ClientComponent> <></> </ClientComponent> </div> ); }; export default Page;

  • react
  • typescript
  • next.js
Next 댓글 2 좋아요 2 조회수 851

npm run build 시 에러가 발생합니다.

해결됨

한 입 크기로 잘라먹는 Next.js

npm run dev로 실행 시 정상 실행되고있고 npm run build 시 아래와 같이 에러가 발생하고있습니다. 제 소스코드는 아래에서 확인가능합니다 https://github.com/redinbluesky/section02 =========npm run build 시 에러 메시지======== D:\01_Study\01_REACT\02_ONE_BITE_NEXT_JS\02_VsCode_WorkSpace\section02>npm run build > section02@0.1.0 build > next build ▲ Next.js 14.2.18 ./src/components/book-item.tsx ....................................................... ✓ Linting and checking validity of types Creating an optimized production build ... ✓ Compiled successfully ✓ Collecting page data Generating static pages (0/7) [ ]인덱스 페이지 Generating static pages (2/7) [= ]Error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=%5Bobject%20Promise%5D for the full message or use the non-minified dev environment for full errors and additional helpful warnings. at Z (D:\01_Study\01_REACT\02_ONE_BITE_NEXT_JS\02_VsCode_WorkSpace\section02\node_modules\react-dom\cjs\react-dom-server.browser.production.min.js:76:490) ........................................................ Error occurred prerendering page "/lib/fetch-bo............................. Error occurred prerendering page "/lib/fetch-rendom-books". Read more: https://nextjs.org/docs/messages/prerender-error ....................................... Error occurred prerendering page "/lib/fetch-one-book". Read more: https://nextjs.org/docs/messages/prerender-error .......................................... ✓ Generating static pages (7/7) > Export encountered errors on following paths: /lib/fetch-books /lib/fetch-one-book /lib/fetch-rendom-books

  • react
  • typescript
  • next.js
댓글 3 좋아요 0 조회수 647

서버 컴포넌트 실행 시, 브라우저에서도 콘솔을 확인할 수 있도록 변경된 것 같아요!

해결됨

한 입 크기로 잘라먹는 Next.js

next.js 15.1.3 (24.12.30) 기준으로 서버 컴포넌트 실행 시, 아래와 같이 브라우저에서도 콘솔을 확인할 수 있도록 변경된 것 같아요! 단 서버 측에서만 실행되기 때문에 앞에 Server 라벨이 붙어서 나오는 것 같습니다!

  • react
  • typescript
  • next.js
Next 댓글 1 좋아요 3 조회수 221

next-auth 로그인/회원가입 에러(middleware)

해결됨

Next + React Query로 SNS 서비스 만들기

강사님 안녕하세요, 로그인/회원가입 시 middleware export 되지않는 이슈로 질문남깁니다..! 터미널에서 middleware가 export가 되지않는다고 뜨는데 import하는 방식이 잘못된건지 여쭙니다. // middleware.ts import { auth as middleware } from "./auth" export const config = { matcher: ['/compose/tweet', '/home', '/explore', '/messages', '/search'], } //auth.ts import NextAuth, {CredentialsSignin} 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.NEXT_PUBLIC_BASE_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 { email: user.id, name: user.nickname, image: user.image, ...user, }; }, }), ] }); // package.json { "name": "x-com", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@auth/core": "^0.27.0", "@vanilla-extract/css": "^1.16.1", "@vanilla-extract/recipes": "^0.5.5", "@vanilla-extract/sprinkles": "^1.6.3", "classnames": "^2.5.1", "clsx": "^2.1.1", "dayjs": "^1.11.13", "next": "^15.0.4", "next-auth": "^5.0.0-beta.25", "react": "^19.0.0", "react-dom": "^19.0.0", "react-textarea-autosize": "^8.5.6", }, "devDependencies": { "@faker-js/faker": "^9.3.0", "@types/node": "^20", "@types/react": "^19", "@types/react-dom": "^19", "@vanilla-extract/next-plugin": "^2.4.7", "@vanilla-extract/webpack-plugin": "^2.3.15", "msw": "^2.6.8", "typescript": "^5" }, "msw": { "workerDirectory": [ "public" ] } } <터미널 오류내용> ⨯ Error: The Middleware "/src/middleware" must export a `middleware` or a `default` function at <unknown> (webpack-internal:\(middleware)\node_modules\next\dist\build\webpack\loaders\next-middleware-loader.js:12) at eval (webpack-internal:\(middleware)\node_modules\next\dist\build\webpack\loaders\next-middleware-loader.js?absolutePagePath=C%3A%5CUsers%5Calsdu%5CDocuments%5CGitHub%5Canimals_forest%5Csrc%5Cmiddleware.ts&page=%2Fsrc%2Fmiddleware&rootDir=C%3A%5CUsers%5Calsdu%5CDocuments%5CGitHub%5Canimals_forest&matchers=&preferredRegion=&middlewareConfig=e30%3D!:12:0) at (middleware)/./node_modules/next/dist/build/webpack/loaders/next-middleware-loader.js?absolutePagePath=C%3A%5CUsers%5Calsdu%5CDocuments%5CGitHub%5Canimals_forest%5Csrc%5Cmiddleware.ts&page=%2Fsrc%2Fmiddleware&rootDir=C%3A%5CUsers%5Calsdu%5CDocuments%5CGitHub%5Canimals_forest&matchers=&preferredRegion=&middlewareConfig=e30%3D! (.next\server\src\middleware.js:642:1) at __webpack_require__ (.next\server\edge-runtime-webpack.js:37:33) at __webpack_exec__ (.next\server\src\middleware.js:681:48) at <unknown> (.next\server\src\middleware.js:682:37) at webpackJsonpCallback (.next\server\edge-runtime-webpack.js:1219:39) at <unknown> (.next\server\src\middleware.js:9:61) at evaluateInContext (node_modules\next\dist\server\web\sandbox\context.js:420:38) GET /home 404 in 4ms Failed to get source map: Error: Failed to read file contents of C:\Users\alsdu\Documents\GitHub\animals_forest\webpack-internal:\(middleware)\node_modules\next\dist\build\webpack\loaders\next-middleware-loader.js. at getSourceMapFromFile (node_modules\next\src\client\components\react-dev-overlay\internal\helpers\get-source-map-from-file.ts:20:10) at async getSource (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:228:22) at async (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:319:17) at async HotReloaderWebpack.run (node_modules\next\src\server\dev\hot-reloader-webpack.ts:392:6) at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-server.ts:576:6) at async Server.requestListener (node_modules\next\src\server\lib\start-server.ts:146:6) { [cause]: Error: ENOENT: no such file or directory, open 'C:\Users\alsdu\Documents\GitHub\animals_forest\webpack-internal:\(middleware)\node_modules\next\dist\build\webpack\loaders\next-middleware-loader.js' at async getSourceMapFromFile (node_modules\next\src\client\components\react-dev-overlay\internal\helpers\get-source-map-from-file.ts:18:19) at async getSource (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:228:22) at async (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:319:17) at async HotReloaderWebpack.run (node_modules\next\src\server\dev\hot-reloader-webpack.ts:392:6) at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-s at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-server.ts:576:6) at async Server.requestListener (node_modules\next\src\server\lib\start-server.ts:146:6) { [cause]: Error: ENOENT: no such file or directory, open 'C:\Users\alsdu\Documents\GitHub\animals_forest\webpack-internal:\(middleware)\node_modules\next\dist\build\webpack\loaders\next-middleware-loader.js' at async getSourceMapFromFile (node_modules\next\src\client\components\react-dev-overlay\internal\helpers\get-source-map-from-file.ts:18:19) at async getSource (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:228:22) at async (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:319:17) at async HotReloaderWebpack.run (node_modules\next\src\server\dev\hot-reloader-webpack.ts:392:6) at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-sserver.ts:146:6) { [cause]: Error: ENOENT: no such file or directory, open 'C:\Users\alsdu\Documents\GitHub\animals_forest\webpack-internal:\(middleware)\node_modules\next\dist\build\webpack\loaders\next-middleware-loader.js' at async getSourceMapFromFile (node_modules\next\src\client\components\react-dev-overlay\internal\helpers\get-source-map-from-file.ts:18:19) at async getSource (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:228:22) at async (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:319:17) at async HotReloaderWebpack.run (node_modules\next\src\server\dev\hot-reloader-webpack.ts:392:6) at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-soverlay\server\middleware.ts:228:22) at async (node_modules\next\src\client\components\react-dev-overlay\server\middleware.ts:319:17) at async HotReloaderWebpack.run (node_modules\next\src\server\dev\hot-reloader-webpack.ts:392:6) at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-sreloader-webpack.ts:392:6) at async handleRequest (node_modules\next\src\server\lib\router-server.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-s.ts:319:34) at async requestHandlerImpl (node_modules\next\src\server\lib\router-server.ts:576:6) at async Server.requestListener (node_modules\next\src\server\lib\start-server.ts:146:6) { errno: -4058, code: 'ENOENT', syscall: 'open', path: 'C:\\Users\\alss\\Documents\\GitHub\\x-com\\webpack-internal:\\(middleware)\\node_modules\\next\\dist\\build\\webpack\\loaders\\next-middleware-loader.js' } }

  • react
  • next.js
  • react-query
  • next-auth
  • msw
인생꿀잼 댓글 2 좋아요 0 조회수 148

이미지

미해결

깃헙 블로그(Github blog)로 차별화 된 나만의 홈페이지 만들기!

안녕하세요. 해당 강의 후 이미지를 http://localhost:4000/_posts/_images/2024-12-29/2024_12_29_image_163224.png 경로로 하여 했는데, 못 불러와서 문의 드립니다. 이미지의 경로는 /_posts/_images/2024-12-29/2024_12_29_image_163224.png 입니다.

  • 블로그
  • github
정말로 공부를 하자 댓글 1 좋아요 0 조회수 115

netflix clone 할 때 recoil을 하는 순간 에러가 없어지지 않아요

해결됨

[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)

✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다. 💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡 평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 깃허브에 올라온 선생님 코드를 모두 복붙해봐도 없어지지 않는데 무엇이 문제일까요? 선생님 코드와 같은데..

  • firebase
  • next.js
  • tailwindcss
  • react-query
  • supabase
  • recoil
김지유 댓글 3 좋아요 2 조회수 343

ThemeProvider에 대해 질문드리겠습니다.

해결됨

[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)

컴포넌트 클라이언트인 ThemeProvider를 최상위 layout의 children을 감싸면 정적인 서버 컴포넌트를 더 이상 활용할 수 없는 제약이 생기지 않나요?? nextjs에서 지향하는 방법인지 잘 모르겠습니다. 이렇게 사용해도 되는것인가요? 아니면 단순 빠른 예제실습을 위해 그렇게 하신건가요?

  • firebase
  • next.js
  • tailwindcss
  • react-query
  • supabase
호기쿤 댓글 2 좋아요 2 조회수 250

domains는 deprecated 되었습니다.

해결됨

한 입 크기로 잘라먹는 Next.js

next configuration에서 images.domains는 deprecated 되었음으로 remotePatterns를 사용하시길 권장드립니다. images : { remotePatterns: [ { protocol: 'https', hostname: 'shopping-phinf.pstatic.net', pathname: '**', } ] } https://nextjs.org/docs/app/api-reference/components/image#remotepatterns

  • react
  • typescript
  • next.js
Kua 댓글 1 좋아요 9 조회수 278

Page Route와 App Route의 빌드 질문

해결됨

한 입 크기로 잘라먹는 Next.js

안녕하세요. 강사님 좋은 강의 감사드립니다. 빌드 기호에 관해 질문있습니다. 영상 19:05초에 App Router의 Static은 Page Router의 SSG와 같다고 하셨는데요. Page Router의 기호 App Router의 기호 보시는 바와 같이 Page Router의 Static과 App Router의 Static 문구가 같습니다. (prerendered as static content) 궁금한것은 1 App Router의 Static이 Page Router의 SSG와 같다면 왜 App Router Static 설명이 Page Router SSG인 (prerendered as static HTML) 설명이 아닌 Page Router의 Static과 동일한걸까요? (prerendered as static content) 즉 App Router의 (Static): prerendered as static HTML이어야 맞는 거 아닌가요? (Static) prerendered as static content 왜 인 걸까요? 헷갈리네요 ㅜㅜ 2. 기존 Page Route의 Static은 어떤 식으로 동작한 건가요? 그냥 정적인 페이지인건가요? 감사합니다!

  • react
  • typescript
  • next.js
김건희 댓글 2 좋아요 0 조회수 218

인기 태그

인프런 TOP Writers

주간 인기글