묻고 답해요
130만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Nuxt.js 시작하기
SSG 배포가 현재 상품,장바구니에는 맞지 않는 배포방식인거죠?
SSG 방식은 말그대로 데이터를 주고받지 않는 static한 사이트에 맞는거라 저희가 만든 사이트에는 안맞는 배포방식인거죠?예시를 봐도 /404.html 같은데 쓰는거 같은데..맞게 이해한걸까요?
-
미해결탄탄한 백엔드 NestJS, 기초부터 심화까지
뭐가 문제인지 모르겠습니다.
구글링을 하고 이래저래 강의를 다시 보면서 수정을 거쳐봣는데 왜 오류가 나는지모르겠어요 분명 보충강의전까지는 잘 동작하고 중반까지는 잘됫었는데
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
페이지에 site맵 존재시 next Link는 csr 처럼 싹가져오게 되나요?
next Link를 이용하게 되면 해당 페이지에서 링크 페이지의 js를 미리 불러온다는 내용이 강의에 존재하였는데헤더나 푸터등 모든페이지에 공용으로 들어가는 영역에 site맵 존재하고 모든 링크를 걸어 놓게 된다면 모든 페이지가 미리 js 형태로 불러와 지게 되는건가요?해당 경우에는 next의 강점이 많이 무뎌질거 같아 질문합니다.
-
미해결탄탄한 백엔드 NestJS, 기초부터 심화까지
어디서부터 잘못됫는지 모르겠는데 여기까지 저장된 파일이나 혹시 제 파일을 보내드려볼테니 확인이 가능한가요?
수강생분들의 질문을 기다립니다! - 에러에 해당하는 질문은 "에러가 발생한 상황에 대한 충분한 설명", "에러 메세지", "에러가 난 코드 스크린샷"을 함께 첨부해주세요. - 언어에 해당하는 질문은 구글링 및 서치 후에 구체적으로 질문해주시면 좋습니다. - 간단한 진로 및 방향성에 대한 질문은 메일로 보내주세요.- 패키지 버전 관리은 실무 환경과 트랜드에 맞추어 강의를 업데이트 하고 있습니다. 강의를 그대로 따라갔는데 에러가 발생한다면 패키지 버전을 강의에서 사용하는 버전과 동일하게 맞춰주세요!- 강의 노트, QA 목록, 공지 사항을 먼저 확인해주세요.- 논리적이고 구체적인 질문은 학습 효과를 올립니다 :)
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
Failed to load resource: the server responded with a status of 404 ()
안녕하세요! nextjs 실습중입니다. next/Image를 사용해서 이미지를 띄웠는데, dev 환경에서는 이미지가 잘 떴는데, 실제로 배포하니까 에러가 나면서 이미지가 안뜨네요 아무리 구글링 해봐도 모르겠어서 질문 드립니다ㅜㅜ
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
VSCode 익스텐션 궁금합니다.
수업 잘듣고 있습니다. 수업 외적으로 VSCode 에서 코딩 중에 회색으로 코드 힌트가 들어가 있던데요. 어떤 익스텐션인지 알려 주실 수 있을까요?검색 중인데 못찾겠네요.죄송하지만 도움을 주셨으면 감사하겠습니다.좋은 주말되세요
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
상태관리 질문 있습니다!
안녕하세요 용주님swr 대신에 React-query랑 Recoil로 상태관리를 하고 있는데, map에 대한 data를 setMapInfo에 저장하고 있고, Markers에서 mapInfo에 대한 값을 useRecoilValue로 가져오고 있는 상황입니다. const [mapInfo, setMapInfo] = useRecoilState(mapState) const initializeMap = () => { const mapOptions = { center: new window.naver.maps.LatLng(...initialCenter), zoom: initialZoom, minZoom: 9, scaleContorl: false, mapDataControl: false, logoControlOptions: { position: naver.maps.Position.BOTTOM_LEFT, }, } let map = new window.naver.maps.Map(mapId, mapOptions) mapRef.current = map setMapInfo(map) } 그런데 계속 아래와 같이 Type error가 발생하고 있는 상황입니다. 어떤 문제 때문에 발생하는지 알 수 있을까요? 수업과 무관한 질문이여서 죄송합니다! ㅜ참고로 @types/navermaps : 3.6.5 버전입니다.
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
swr에 대한 질문입니다. (용어 관련)
안녕하세요용어에 대한 이해 차원에서 질문드립니다.useMap이나 useStore 훅에서 map이나 store에 대한 정보를 전역상태로 관리한다라고 표현하시는데요. 이 부분에 대한 질문입니다.제가 알고 이해하고 있는 바를 먼저 말씀드리면, SWR은 같은 키값로 받아온 값은 다시 요청하지않고 기존의 캐싱된 값을 반환하는 것으로 알고 있습니다. 그래서 같은 키값으로 요청을 하게 되면 결국 캐싱된 값을 사용하게 되는 것이구요. 이러한 과정을 전역상태로 관리한다라고 표현하시는 것으로 이해했는데 맞을까요??[참고] SWR은 데이터의 효율적인 로딩과 캐싱을 위한 라이브러리로서 주로 서버 상태 관리와 데이터 동기화 측면에서 활용되는것이기에 전역상태 관리라고 하면 약간의 혼란을 야기하는 면이 없지 않아 있는 것 같습니다.(redux나 기타 다른 client side에 대한 전역상태 관리와 비교하여...) → 이 부분은 개인적인 생각이기에 참고만 해주셔도 괜찮을거 같습니다. 😅좋은 강의 감사합니다. 🙇🏻
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
swr 질문입니다!
4:25 쯤 설명하시는 부분인데요새로운 매장 데이터가 들어왔을때 아래 사진의 20번째 줄이 실행되고, 20번째 줄이 실행되므로써, 아래 사진인 useStores.ts 의 8번째 줄이 실행되어 새로운 매장 데이터가 전역으로 저장되는거라고 이해를 했는데 제가 이해한게 맞는지 궁금합니다!
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
안녕하세요. span 태그의 부모에 display: flex 를 적용하는데 왜 적용되는지 아무리 생각해도 이해가 되지 않아 질문드립니다.
<li className={styles.menu} key={menu.name}> <span className={styles.name}>{menu.name}</span> <span className={styles.price}>{menu.price}</span> </li>위 코드는 DetailContent.tsx 코드의 일부입니다.위 코드에서 span 태그의 경우 inline 태그이기 때문에 부모 태그인 li 태그에 display: flex 속성을 적용해도 의미가 없는 것이 당연하다고 생각했습니다.그런데 위 코드에서는 inline 태그인 span 태그가 display: flex에 영향을 받고 있더라구요.혹시 제가 잘못 이해하는 걸까요? 혹은 다른 이유가 있는걸까요??(Next.js 관련 질문이 아니라 너무 지엽적인 질문이라 죄송합니다...!)
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
naver로고 important 값 주는 이유
안녕하세요. 강의 잘 듣고 있습니다. css가 중요한 것은 아니지만 important가 없으면 안되는 이유가 궁금해서 질문드립니다.naver 로고에 important 값을 주는 이유는 naver 에서 자체적으로 주는 css 값 때문이라고 생각했는데, 제가 생각한 게 맞을까요?
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
useEffect clean up function 내부 코드의 역할
return () => { marker?.setMap(null) }해당 코드는 어떤 역할을 하는건가요??
-
미해결Nuxt.js 시작하기
db.json 에 제공되는 imgUrl 서비스가 종료된듯하네요
img 가 안떠서 해당 url 검색해보니 placeIMG stopped serving i ages on June 30, 2023 이라고 합니다..비슷한 서비스로 url 수정해서 실습은 계속하긴하는데 git 소스코드 업데이트가 필요할것 같아서 말씀드려봅니다~
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
useRef 사용이유
강의에 useRef 사용 이유에 대해선 안나오는거 같은데 아래 두 코드는 왜 사용된건지 설명해주실 수 있나요?? const mapRef = useRef<NaverMap | null>(null) mapRef.current = map
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
시작 할때 0-2 branch 에서 시작 하는게 맞나요?
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.빈 폴더에서 npx create-next-app@latest --typescript 로 시작 해야 하는지 아니면 받은 소스의 0-2 브랜치 에서 npx create-next-app@latest --typescript 로 시작 하는게 맞는지 어떤건가요?
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
useEffect의 clean up 함수를 실행해야 하는 이유가 무엇일까요??
안녕하세요 강사님! 유익한 강의 아주 잘 듣고 있습니다.혹시 컴포넌트 unmount 시 맵 객체를 destroy 해야 하는 이유를 알 수 있을까요?destroy를 하지 않아도 코드 동작에는 큰 문제가 없는 것 같습니다. 혹시 메모리 상의 문제나 다른 문제가 있어서 이 코드를 작성해야 하는걸까요??next/script로 네이버 지도 불러오기 강의 (8:40)useEffect(() => { return () => { mapRef.current?.destroy(); } }) 예를 들면, setInterval의 경우 Unmount시 clearInterval을 하지 않을 경우 계속 백그라운드에서 실행되기 때문에 clearInterval을 해줘야한다고 바로 이해가 됐습니다. 하지만 위의 경우 꼭 맵 객체를 destroy 해야하는걸까요??
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
<div id="__next"> 질문
제가 따로 하고 있는 next.js 프로젝트에는 이런 div가 없는데 혹시 없다면 문제가 있는건가요?
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
강의파일 열면 왜 전부 다 빨간줄이 뜰까요???
강의 파일을 열면 에러가 뜨는데 어떻게 해결하나요? ㅠㅠ
-
미해결탄탄한 백엔드 NestJS, 기초부터 심화까지
exception filter에 잡히질 않습니다
import { ExceptionFilter, Catch, ArgumentsHost, HttpException, } from '@nestjs/common'; import { Request, Response } from 'express'; @Catch(HttpException) export class HttpExceptionFilter implements ExceptionFilter { catch(exception: HttpException, host: ArgumentsHost) { const ctx = host.switchToHttp(); const response = ctx.getResponse<Response>(); const request = ctx.getRequest<Request>(); const status = exception.getStatus(); const error = exception.getResponse() as | string | { error: string; statusCode: number; message: string | string[] }; if (typeof error === 'string') { response.status(status).json({ statusCode: status, timestamp: new Date().toISOString(), path: request.url, message: error, }); } else { response.status(status).json({ statusCode: status, timestamp: new Date().toISOString(), path: request.url, message: error, }); } } }안녕하세요 ! 위와 같이 필터 작성이후main.ts 에서app.useGlobalFilter(new HttpExceptionFilter());를 통해 예외가 잘 잡히는것을 확인을 했었습니다.왜인지는 모르겠으나 cat의 모델 내부 필드중에 imgUrl 부분을 null 을 허용해주기 위해@IsOptional() 을 붙여주고난 뒤에 중복 회원가입을 진행하려 할 경우 예외에 잡히게끔 하려 HttpException 을 발생 시키게끔 했습니다.async signUp(body: CatRequestDTO): Promise<Cat> { const email = body.email; const checkExist = await this.catRepository.findOne({ where: { email } }); if (!checkExist) { const createdCat = this.catRepository.create(body); this.catRepository.save(createdCat); return createdCat; } else { throw new HttpException( 'Already exist Email in DB', HttpStatus.BAD_REQUEST, ); } }콘솔창에 에러 메세지와 함께 출력되는것은 확인되나Filter에서 exception @Catch 로 묶어준것에 잡히지를 않습니다. 도통 이유를 못찾겠어서 app.useGlobalFilter(...) 를 catController 쪽에 @UseFilters(new HttpExceptionFilter()) 로도 바꿔보고메서드에다가 직접적으로도 붙여보았으나 계속 똑같은 현상을 보이는데왜 인지를 못잡겠습니다. 조언을 좀 주시면 감사하겠습니다.
-
미해결탄탄한 백엔드 NestJS, 기초부터 심화까지
npm run start:dev 에러
터미널에 npm run start:dev 를 입력하면 자꾸 Error: Cannot find module 라는 에러가 뜹니다;;npm를 지웠다 깔기도 하고, node module 폴더를 삭제하기도하고, lock.json 파일을 삭제해보기도 했는데 여전히 계속 에러가 뜨는데 왜 이런건가요?.....