묻고 답해요
150만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자"로
template.tsx 가 SEO 에 주는 이점에 대한 질문
template.tsx는 페이지 전환 시 새로운 인스턴스를 생성하여 상태가 초기화되는데,이러한 특성을 활용해 SEO 메타데이터 처리의 정확성과 일관성을 높이기 위한 목적으로 사용하는 것인가요?즉, 전역 상태나 클라이언트 캐시 등으로 인해 예외적으로 SEO 메타데이터가 적용되지 않는 문제를 방지하기 위한 보완적 수단으로 보면 될까요?
-
미해결Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자"로
자동화 스크립트 관련하여 질문있습니다.
스크립트를 수정해 동적 라우팅이나, Route Group 같은 폴더도 고려해서 pathname.ts를 구성해야 될까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
서버 502 error
백엔드 서버 키니 이렇게 나오는데 왜이런가요?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
리액트 1강
선생님 수업 내용 똑같이 따라쳤는데 (바벨도 다운로드 코드도 쳤는데)라이브서버로 실행시켰을때 (>)신택스 에러뜨면서안녕하세요 안떠요 ㅠㅠ리액트나 바벨 설치가 안된거 아닌가요?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
Vs code 코드 저장하면 정렬 이상하게 되요!
이런 코드가 ctrl+s 눌러서 저장하면이렇게 바뀌는데 가독성이 안좋아서 저장해도 가독성좋게 1줄로 하고싶은데해결방법이 있을까요ㅠㅠ?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
input text 빈 공간 ""
왜 빈 공간을 " " 이렇게 나타내지 않고"" 로 붙여서 나타내나요?선생님께서 저번 수업때 ex) 1 산청딸기표현할때console.log(1+" "+산청딸기) 이런식으로 띄어쓰기는(빈공간)은 " " 가 맞지 않나요?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
function 형식
let time=10setInterval(function(){console.log(time)},1000)강의 중setInterval에 익명함수를 집어넣는다고 하셨는데let time=10setInterval(let aa=function(){console.log(time)},1000)이 코드가 맞지 않나요?그니까 먼저 익명함수 이름부터 선언해야하지 않나요?그리고 여기서도위에 함수는 change라고 이름을 붙여줬는데밑에 함수는 이름도 없이 쓰는것이 왜 그런거인지 궁금합니다!
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
판매, 구매 목록등 판매자, 구매자 데이터를 불러오지 못합니다.
마이페이지에서 구매내역에서 seller, buyer의 _id, name 등 가져오지 못합니다.query { fetchPointTransactionsOfBuying(page: 1, search: "") { amount status statusDetail travelproduct { name seller { name } } } }graphQl 페이지에서 직접 header에 토큰 넣어도 불러오지 못하는데 어떻게 피그마에 있는 구매내역의 판매자 값을 불러올 수 있을까요?seller, buyer를 포함하면 API 요청은 되는데 에러가 떠 데이터 사용하지 못하고 제외하고 요청을 하면 정상적으로 사용할 수 있습니다.
-
해결됨웹 개발자의 연봉을 올려주는 하이브리드앱 with Expo 프레임워크
인스펙터가 웹뷰 내부의 웹을 못잡습니다.
안녕하세요 시뮬레이터 실습하고 있는 수강생입니다.아래 사진처럼 시뮬레이터로 사파리에 접속하면 맥북의 사파리 인스펙터에서 시뮬레이터 속 웹을 인지하는데요, 엑스포 앱을 통해 웹뷰 내부의 앱은 읽지 못하는 것 같아요 따로 설정해야하는 것이 있을까요 ?
-
미해결한 입 크기로 잘라먹는 Next.js(v15)
풀 라우트 캐시 관련 Dynamic Page 조건에 대해 궁금한 점 있습니다.
풀 라우트 캐시 조건에 http 요청에서 쿠키나, 헤더값등을 얻어오는 동적함수를 사용하거나props에서 searchParams를 꺼내오는 등의 조건들이 동적 페이지로 선정되는 기준이라고 하셨는데요. components/searchbar.tsx에서 useSearchParams() 훅 사용도 같은 맥락인것 같은데, 이친구는 왜 빌드시에 체크된걸까요? 빌드 과정 중 정적 코드 분석을 통한 경고성 오류일까요?(with-searchbar)/page.tsx가 static page로 선정되어, 그 내부에 포함되어 있는 컴포넌트이기 때문에 components/searchbar.tsx까지 빌드하려다가 발생한 오류일까요?useSearchParams() 훅은 dynamic page 선정조건에 포함되지 않은걸까요? 궁금합니다! 만약 수업 내용 중 있었는데, 제가 놓친거라면 죄송합니다~
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
document.getElementById("aa")
여기에서 document.getElementById("aa")말고document.getElementById(aa) 라고 적으면 안되나요?aa는 id설정이 끝난 변수 아닌가요?
-
미해결한 입 크기로 잘라먹는 Next.js(v15)
리퀘스트 메모이제이션을 끄려면?
🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요강의 듣다가 궁금해진게리퀘스트 메모이제이션이 자동으로 작동하는데 특정 요청만 끄려면 어떻게 해야 하나요?예제 프로젝트에서 추천 도서를 랜덤으로 가져오는데 동일 컴포넌트를 여러개 호출 해보니 메모이제이션이 작동해서 모두 똑같이 나오더라고요일반적이진 않지만 이런 랜덤성(?)있는 데이터는 메모이제이션을 적용하고 싶지 않을 수도 있을 것 같은데 이런 경우는 어떻게 하나요
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
CSR 방식 관련 문의 사항
CSR 방식과 관련하여 궁금한 점이 있습니다.CSR 방식에서, 서버에서 처음부터 번들링된 JavaScript 파일을 보내주지 않고, 빈 껍데기 HTML 파일을 먼저 보내는지 이유가 궁금합니다. 빈 껍데기 HTML 파일이라 Next.js에서처럼 Hydration도 이루어지지 않을 텐데, 빈 껍데기 HTML 파일을 왜 보내는지 아무리 생각해 봐도 용도를 모르겠습니다.
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
수업내용에 궁금한 점
지금 섹션 [입 중급] CSS&JS 마스터 섹션 01 강의는 다 듣고 섹션 02 강의를 들어야 합니다.그런데 강의 순서대로 듣는게 맞는건지 아니면 css 부분 부터 다 듣고 다시 올라와서 js 강의를 듣는건지 알고 싶습니다.
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
궁금한 점이 있어서 여쭈어봅니다!
안녕하세요, 강사님! 강의 잘 보고 있습니다!이번 강의를 들은 뒤에 다른 수강생분들의 질문도 보면서 따로 정리를 하며 문득 든 궁금점이 있어 여쭈어봅니다.각 페이지 별로 최초 접속할 때에 사전 렌더링이 진행되는 건가요? ex.) index페이지, search 페이지(/search), book 페이지(/book) 등 각각 처음 접속할 때 사전렌더링이 진행되는지1번이 맞다면 프리페칭과 부딪히는 게 아닌지 궁금합니다! ex.) index 페이지에 최초 접속할 때, index 페이지에서 이동할 가능성이 있는 페이지의 JS Bundle을 미리 불러오니까 처음 search 페이지로 이동한다면 사전 렌더링 방식으로 해야 되는데(1번이 맞다면), 이미 JS Bundle을 불러와 준비해두었기 때문에 CSR 방식으로 렌더링이 되지 않나요?프리페칭이 진행되어서 index 페이지가 렌더링될 때 search 페이지의 JS Bundle이 같이 렌더링되어 CSR 방식으로 search 페이지를 요청 받았는데, 만약 search 페이지에서 미리 렌더링되지 않은 페이지로 이동하게 되면 다시 사전 렌더링 방식을 거쳐 이동하게 되는 건가요? 혹은 search 페이지로 이동할 때 CSR 방식으로 브라우저에서 바로 화면에 노출되게 하고, 내부에서 따로 브라우저-서버 사이에 렌더링되지 않았던 페이지의 JS 코드를 렌더링하는 건가요?
-
미해결Next.js App router 기반 Chat GPT 만들기
Streaming 관련 질문
Loading UI & Streaming 강의 수강 중 강의 내용대로 따라 했는데 잘 안되는 부분이 있어서 질의드립니다!dashboard/page 에서의 page loading...은 정상적으로 나오는데 Card 컴포넌트 각각의 loading도 page loading 이후 한번에 로드되면서 각각의 loading이 나오지 않습니다. 혹시 어떤 문제가 있는지 알려주실 수 있으실까요? 아래에는 해당 깃허브 링크와 이미지 첨부했습니다!https://github.com/holdn2/NextJS-Inflearn-Chatgpt
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
궁금한 점 질문 드립니다!
안녕하세요. 질문 있습니다.userAgent에 있는 값을 사용하고 싶습니다. 서버 측에서는 next/header 함수를 통해서 클라이언트 측에서는 네비게이터의 userAgent 객체를 사용하면 될 것 같은데 이 값을 사용하는 함수는 클라이언트, 서버 양쪽에서 실행됩니다.서버인지 클라이언트인지 분기 처리 후 값을 가져오고 싶었는데 next/header를 사용하는 파일을 import 하기만 해도 클라이언트 측에서는 에러가 나더라고요.이런 상황에서는 어떻게 해결해 나가는게 좋을까요? 감사합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
travel seller가 캐싱되지 않습니다.
fetchTravelproducts에서 클릭으로 상세 페이지로 들어가면 fetchTravelproduct 의 data 값을 보여주는데API 요청에서 data 값을 확인하면 seller 값이 들어있는데 data.fetchTravelproduct.seller를 콘솔에 찍으면 null 이 뜹니다. (다른 데이터는 정상적으로 불러옵니다.) fetchTravelproducts에서는 판매자 이름이 잘 출력이 되는데 상세페이지에 들어가면 해당 fetchTravelproduct API 요청으로 가져와도 판매자 데이터가 없는 상태로 뜨는데 문제가 뭘까요?여기서 상세페이지에서 새로고침을 하면 정상적으로 판매자가 보여집니다. fetchTravelproducts에서 캐싱하는 과정에 문제가 있는 걸 까요? // 상세 페이지 import { Query } from "@/entities/api/graphql"; import { gql, useQuery } from "@apollo/client"; export const TRAVEL_PRODUCT = gql` query fetchTravelproduct($travelproductId: ID!) { fetchTravelproduct(travelproductId: $travelproductId) { _id name remarks contents price tags images pickedCount travelproductAddress { zipcode address addressDetail lat lng } seller { _id name picture } createdAt } } `; export const useFetchTravelProduct = ({ travelId }: { travelId: string }) => { const result = useQuery<Pick<Query, "fetchTravelproduct">>(TRAVEL_PRODUCT, { variables: { travelproductId: travelId }, }); return result; };// 목록 페이지 import { Query } from "@/entities/api/graphql"; import { gql, useQuery } from "@apollo/client"; const TRAVEL_PRODUCTS = gql` query fetchTravelproducts($isSoldout: Boolean, $search: String, $page: Int) { fetchTravelproducts(isSoldout: $isSoldout, search: $search, page: $page) { _id name remarks contents price tags images pickedCount travelproductAddress { zipcode address addressDetail lat lng } buyer { _id name picture } seller { _id name picture } createdAt } } `; interface UseFetchTravelProductsArgs { isSoldout: boolean; search: string | null; page: number; } export const useFetchTravelProducts = ({ isSoldout, search, page, }: UseFetchTravelProductsArgs) => { const result = useQuery<Pick<Query, "fetchTravelproducts">>(TRAVEL_PRODUCTS, { variables: { isSoldout, search, page, }, }); return result; };
-
미해결Next.js 완벽 마스터 (v15): Notion 기반 개발자 블로그 만들기 (with Cursor AI)
Docs 추가한 게 자꾸 사라져요
안녕하세요 선생님! 친절한 설명과 함께 강의 잘 듣고 있습니다. 강의교안에 링크로 남겨주신 것들 Cursor AI 설정에 Docs로 추가시에 add 한 것들이 자꾸만 사라지는 오류가 있습니다. 이전 강의에서도 사라지는 오류가 있을 때 재시도 하면 괜찮다고 하셔서 여러 번 시도했는데, 자꾸만 사라지네요 ㅠㅠ 뭔가 설정상의 문제가 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
js 핸드폰 인증번호 구현
여기서 time=time-1 붙였는데시간1초씩줄어드는거 적용이 안되요 도와주세요 ㅠㅠ