inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

안녕하세요 용주님 질문이 있습니다~

해결됨

Next.js 시작하기(feat. 지도 서비스 개발)

server state 관리를 swr 말고 react-query를 사용하려고 합니다. 아래와 같이 해당 queryKey를 가지고 stores에 대한 data를 전역으로 관리하고 싶었는데, fetchFunction 자리에 stores props가 들어갈 수 없어서 처음에 어떻게 initialdata를 가져올 수 있을지 잘 모르겠습니다.. react-query는 수업때 배우진 않지만 혹시 아시는 부분이 있다면 알려주시면 감사하겠습니다 !! const { data } = useQuery([queryKey], fetchFun)

  • seo
  • next.js
  • vercel
  • csr
  • ssg
  • ssr
bj2525 댓글 1 좋아요 1 조회수 436

git 업데이트

해결됨

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

> git push -u origin master To https://github.com/eunpse/preCamp.git ! [rejected] master -> master (non-fast-forward) error: failed to push some refs to 'https://github.com/eunpse/preCamp.git' hint: Updates were rejected because the tip of your current branch is behind hint: its remote counterpart. Integrate the remote changes (e.g. hint: 'git pull ...') before pushing again. hint: See the 'Note about fast-forwards' in 'git push --help' for details. 과제에 알려주신 방법으로 깃에 먼저 파일을 올렸다가, 내용을 수정하고 다시 깃에 올리려고 하는데 오류가 발생합니다. git pull을 해라 이런 말이 있는 것 같은데 어떻게 해야하나요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
박세은 댓글 1 좋아요 0 조회수 473

'result' is of type 'unknown'. ts(18046)

해결됨

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

강의 화면과 달리 result 타입이 unknown이라고 뜹니다 소스를 비교했을 땐 동일한 것 같은데, 어떤 부분이 잘못 된걸까요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
cm-lee 댓글 2 좋아요 0 조회수 900

Final signup 과제에서

해결됨

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

let phone1 = document.getElementById('phone1').value; function ph1() { if (phone1.length === 3) { document.getElementById('phone2').focus(); } } function ph1() { let phone1 = document.getElementById('phone1').value; if (phone1.length === 3) { document.getElementById('phone2').focus(); } } 안녕하세요. 섹션1 final 과제 sign up 진행 중입니다. 핸드폰 번호를 입력하면 포커스를 이동 중에 첫번째 코드블럭 같이 정의한 후 포커스를 이동하려 했더니 되지 않더라고요! 혹시 위의 두 코드 블럭은 다른 코드로 정의되는 것인가요 ? 저는 {} 밖에서 정의를 해 주면 전체 코드에 적용된다고 해서 한번에 phone1,phone2,phone3 을 정의하려고 했거든요!

  • react
  • node.js
  • seo
  • graphql
  • next.js
매력적인 토끼 댓글 2 좋아요 0 조회수 428

final signup 과제

해결됨

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

let phone1 = document.getElementById('phone1').value; function ph1() { if (phone1.length === 3) { document.getElementById('phone2').focus(); } } let phone1 을 상위에 정의 하면 왜 null 값으로 읽히는 걸까요 ?

  • react
  • node.js
  • seo
  • graphql
  • next.js
매력적인 토끼 댓글 1 좋아요 0 조회수 192

git 배포!!!!!!

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

동일한 질문이 있는데 답변을 이해하지 못해서 질문합니다. 저는 [깃허브아이디]/상위폴더/하위폴더/ 하위폴더2 에 지금까지 만든 넷플릭스 파일들이 있습니다. 이 경우에 package.json의 homepage 부분과 index.js의 basename은 어떻게 설정해야 하는 것인지요? 아까까지 전체 주소(하위폴더2까지) homepage, basename을 작성하여 배포했는데 완성된 주소는 상위폴더까지만 적혀 있습니다. 지금은 [깃허브아이디]. github.io/[상위폴더]/로 다시 배포했는데 상위폴더 안의 Read.me만 나오고 있습니다. (캐시 삭제 및 20분 정도 기다림) ㅠㅠ 왜 이러는지 알고 싶습니다.

  • react
  • redux
  • tdd
  • typescript
  • next.js
  • 소프트웨어-테스트
갈길toofar 댓글 1 좋아요 0 조회수 581

search에 있는 refetch 질문이요.

해결됨

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

중고마켓을 만들고 있습니다. 이부분인데 여기서 판매중상품 판매된상품 두개로 나눠서 searchbar(검색)을 만들었습니다. useSerach 파일로 밑에 코드로 따로 빼놨고 (useSearch) container 이부분에서 onChangeSearch안에 있는 refetch를 어떻게 가져와야 하나요 refetch: SoldOutTrueRefetch || SoldOutFalseRefetch 이렇게 처음에 가져오려고 했지만 실패했습니다.. presenter 코드가 조금 지저분하지만 완성이 목표라서 현재 짜는 코드는 조금 지저분해도 이런식으로 두개를 가져오고 싶습니다. refetch 부분 어떤식으로 가져와야할지 알려주세요.

  • react
  • node.js
  • seo
  • graphql
  • next.js
임프런 댓글 1 좋아요 0 조회수 349

graphql useditem 질문입니다!

해결됨

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

게시판 페이지 카운트는 있는데 혹시 중고아이템은 페이지카운트 쿼리가 없는건가요? ㅠㅜ 찾아봐도 없는거 같아서 무한스크롤로 했는데 혹시나해서 글 남깁니다!!

  • react
  • node.js
  • seo
  • graphql
  • next.js
호겸 댓글 2 좋아요 0 조회수 309

Node 18 버전 강의

해결됨

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

안녕하세요, 회사에서, 신규 프로젝트에서 'react 18 버전'을 사용 한다고 하였는데요. node 18 버전, 타입스크립트, ant 디자인 등등 관련해서, 프로젝트 작업 시 조언, 작업 방식..등 과 관련한 내용 있으시면 혹시 공유 가능할까요..?

  • react
  • node.js
  • seo
  • graphql
  • next.js
김진영Jinny 댓글 1 좋아요 0 조회수 547

(질문X 제보O) antd 최신버전에서 리스트 문법이 변경된듯 합니다

해결됨

[리뉴얼] React로 NodeBird SNS 만들기

PostCard 컴포넌트에서 댓글목록 부분을 강의에 나와있는 대로 작성하면 파라미터가 undefined라고 에러가 뜨더군요 코드는 아무리 살펴봐도 틀린 부분이 없어서 package.json 보고 하나하나 지웠다 깔았다 하면서 검사했는데 antd를 강의랑 같은 버전으로 깔면 에러가 안 나오더군요. (대신 디자인이 하나도 적용이 안됩니다)

  • react
  • redux
  • node.js
  • express
  • next.js
닉네임 댓글 1 좋아요 0 조회수 341

d-day 코드오류

해결됨

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

강의보면서 그대로 작성했는데 targetDate 부분이 오류가 납니다. 여기서 안되니까 remaining 에서도 오류나고.. 콘솔 찍으면 NaN 만 출력이 되네요ㅠㅠ 왜그럴까요? <script> const dateFormMaker = function () { const inputYear = document.querySelector("#target-year-input").value; const inputMonth = document.querySelector("#target-month-input").value; const inputDate = document.querySelector("#target-date-input").value; const dateFormat = `${inputYear}-${inputMonth}-${inputDate}`; return dateFormat; }; const counterMaker = function () { const targetDateInput = dateFormMaker(); const nowDate = new Date(); const targetDate = new Date(targetDateInput).setHours(0,0,0,0); /* error */ const remaining = (targetDate - nowDate) / 1000; const remainingDate = Math.floor(remaining / 3600 / 24); const remainingHours = Math.floor(remaining / 3600) % 24; const remainingMin = Math.floor(remaining / 60) % 60; const remainingSec = Math.floor(remaining) % 60; console.log(remainingDate, remainingHours, remainingMin, remainingSec); console.log(targetDate); }; </script>

  • react
  • node.js
  • seo
  • graphql
  • next.js
댓글 1 좋아요 0 조회수 280

배너 Iframe 디자인 시 가상 요소

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

여기서 &를 써서 스타일을 추가하는 이유가 무엇인가요? 그냥 위에 있는 Iframe에 적용하면 안되는 건가요? 이 부분을 Iframe에 포함시키니 오류가 나서 왜인지 궁금합니다. const Iframe = styled.iframe` width: 100%; height: 100%; z-index: -1; opacity: 0.65; border: none; &: :after { content: ""; position: absolute; top: 0; left: 0; width: 100% height: 100% } `;

  • react
  • redux
  • tdd
  • typescript
  • next.js
  • 소프트웨어-테스트
갈길toofar 댓글 1 좋아요 0 조회수 573

Can't resolve '@/styles/Home.module.css' 에러

해결됨

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

안녕하세요, Section 23 부분중 localhost :3000으로 접속하는 부분에서, 첨부한 사진과 같은 컴파일 에러가 계속 발생합니다. 이전에 다른 분이 올리신 global.css 관련 질문에서 강사님이 답변하신 것처럼 index.js 파일에서 @를 ..로도 바꿔봤고, 해당 줄을 주석처리도 해봤는데 문제 해결이 안되고 다른 에러가 계속 발생합니다. 어떻게 하면 좋을까요? 첫번째 사진은 @/styles~로 그대로 실행했을때 나는 에러화면, 두번째 사진은 ../styles~로 고쳤을때 발생하는 에러 화면입니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
권서준 댓글 1 좋아요 0 조회수 360

초기설정 중인데 문제가 한두가지가 아닙니다..

해결됨

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

Section 23 Notion 문서 보면서 설정하고 있는데요, next.js로 프로젝트 만들었는데 문서와는 달리 Typescript 쓸건지 등등 여러 질문이 떠서 No 하려고 해도 타이핑이 안돼서 Yes 밖에 되지 않습니다 일단 되는대로 class랑 자유게시판 만들었는데 이번에는 pages 디렉토리가 설치가 안되어있습니다 그러다보니 그 다음 yarn dev 부분에서도 pages 디렉토리가 없다는 에러가 나고, 임의로 mkdir 통해서 pages만들고 실행하니까 Detected next.config.js, no exported configuration found. 뜨면서 URL을 브라우저에서 열어도 404 error 메세지만 뜹니다 그런 과정을 거치고 나니까 다른 부수적인 에러들도 나타나는데, ../같은 기본적인 명령어에서도 not found 같은 에러가 나는등등 있습니다 시작부터 막히니까 답답하네요...

  • react
  • node.js
  • seo
  • graphql
  • next.js
권서준 댓글 2 좋아요 0 조회수 633

axios 401 오류

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

axios 코드입니다. import axios from "axios"; const instance = axios.create({ baseURL: "https://api.themoviedb.org/3", params: { api_key: "895e2a24f997d16a2490bcfddde450c28", language: "ko-kr", }, }); export default instance; requests 코드입니다. const requests = { fetchNowPlaying: "movie/now_playing", fetchNetflixOriginals: "/discover/tv?with_networks=213", fetchTrending: "/trending/all/week", fetchTopRated: "/movie/top_rated", fetchActionMoives: "/discover/movie?with_genres=28", fetchComedyMovies: "/discover/movies?with_genres=35", fetchHorrorMovies: "/discover/movies?with_genres=27", fetchRomanceMovies: "/discover/movies?with_genres=10749", fetchDocumentarues: "/discover/movies?with_genres=99", }; export default requests; App 코드입니다. import "./App.css"; import Nav from "./components/Nav"; import Banner from "./components/Banner"; function App() { return ( <div className="App"> <Nav /> <Banner /> </div> ); } export default App; Banner 코드입니다. import axios from "../api/axios"; import React, { useState, useEffect } from "react"; import requests from "../api/requests"; function Banner() { const [movie, setMovie] = useState([]); useEffect(() => { fetchData(); }, []); const fetchData = async () => { // 현재 상영중인 여러 편의 영화 정보 가져오기 const request = await axios.get(requests.fetchNowPlaying); // 여러 편의 영화 중 하나의 영화 ID 가져오기 const movieId = request.data.results[ Math.floor(Math.random() * request.data.results.length) ].id; // 특정 영화의 상세 정보 가져오기 const results = await axios.get(`movie/${movieId}`, { params: { append_to_response: "videos" }, }); console.log("results", results); console.log(movieId); }; return <div></div>; } export default Banner; 확인해봤을 때는 틀린 부분이 없는데 아래와 같은 오류가 발생합니다. ㅠㅠ 어디 잘못 작성한 게 있을까요?

  • react
  • redux
  • tdd
  • typescript
  • next.js
  • 소프트웨어-테스트
갈길toofar 댓글 1 좋아요 0 조회수 690

_app.tsx 빨간줄

해결됨

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

실행도 되고 app.tsx파일도 제대로 반영이 되는데 아래 jsx부분의 Component부분의 빨간 밑줄이 계속 남아 있습니다 ㅠㅠ

  • react
  • node.js
  • seo
  • graphql
  • next.js
김무연 댓글 1 좋아요 0 조회수 730

현재 서버 문제있나요?

해결됨

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

http://practice.codebootcamp.co.kr/graphql <-- 해당 사이트 접속이 불가하고 위 사이트의 mutation 코드도 어제까지는 됐는데 오늘은 실행이 안되네요

  • react
  • node.js
  • seo
  • graphql
  • next.js
dasd 댓글 1 좋아요 0 조회수 423

updateUseditem 에러 "Cannot read property '_id' of undefined"

해결됨

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

안녕하세요. 강사님께서 직접 답글 주셨으면 좋겠습니다,, updateUseditem api 요청 시 useditemAddress를 제외하고 아래와 같이 테스트하면 정상동작하는데 useditemAddress를 붙인 후 요청 시 아래와 같이 에러가 발생합니다. 며칠 째 해결이 안되어 강사님께서 직접 봐 주셨으면 좋겠습니다. 감사합니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
용준 댓글 1 좋아요 0 조회수 253

강의 듣는 방법에 대한 질문이 있습니다.

해결됨

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

안녕하세요. ver2가 있는줄 모르고 현재 섹션 12까지 들었습니다. 지금부터라도 복습 겸 바로 ver2로 넘어가서 강의를 들어보려 했는데 괜찮을까요? 아직 한 것 보다 할게 더 많이 남은거 같아 질문 드립니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
Milkyway 댓글 1 좋아요 0 조회수 388

인기 태그

인프런 TOP Writers

주간 인기글