묻고 답해요
143만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨Node.js로 웹 크롤링하기
2-4 csv 출력하기에서 오류 발생
안녕하세요.. 최근에 강의를 수강하고 있습니다.2-4강을 따라서 테스트하고 있습니다.그런데 총 10개의 링크를 가져와서 puppeteer를 이용해서 평점값을 가져오는데, 중간에 하나의 결과를 저장하지 않는 오류가 발생합니다. 왜 그럴까요? 처음에는 인덱스 번호 2번이 undefined 되더니, 이번에는 인덱스 7번이 생성이 안되어서 cs 파일 생성시 오류가 발생합니다. 이런 현상은 왜 발생할까요?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
useRef와 useState의 사용 기준
어떨 때 useRef를 사용하고 어떨 때 useState를 사용하는지 기준을 모르겠어요. 리렌더링 즉 화면 UI가 변할 때usestate를 사용한다고 생각해도 될까요? Input 값이 비어있으면 폼을 제출 못하고 focus()하는 메서드를 사용할 때 포커스도 화면 UI가 변경된 것일텐데, useref를 사용하는 거 같더라구요 그렇다면 리액트가 변화를 감지해야할 때는 usestate를 사용하고 감지하지 않아도 되는 경우에는 useref를 사용한다고 생각해야할까요?? 마지막으로 keyframe애니메이션을 사용하려면 UI가 변경되었기때문에 usestate로 사용해야하는 걸까요? 아니면 리액트가 그 변화를 감지하지 않아도 되기때문에 useref를 사용해야하는 걸까요?ㅠㅠ 정말 헷갈립니다
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
카운터앱 구현하기에서 커스텀훅으로 관리하는 방법은 어떤가요?
안녕하세요!카운터앱 구현하기를 조금 다르게 코드를 짜보았는데, 커스텀훅을 활용법에 익숙하지 않아서, 이렇게 구현하는 방법이 적절한지 감이 안와요.. 바쁘신데 죄송하지만 아래와 같은 커스텀훅 구현방식의 장단점에 대해서 알려주시면 감사하겠습니다! 먼저 useCount.jsx를 아래와 같이 작성하였구요import { useState } from 'react'; function useCount() { const [num, setNum] = useState(0); const onClinkCount = (e) => { setNum(num + Number(e.target.value)) } return [num, onClinkCount]; } export default useCount; 아래는 넘버 조작 부분인 Controller.jsxconst Controller = ({ onClinkCount }) => { return ( <div> <button onClick={onClinkCount} value="-1">-1</button> <button onClick={onClinkCount} value="-10">-10</button> <button onClick={onClinkCount} value="-100">-100</button> <button onClick={onClinkCount} value="+100">+100</button> <button onClick={onClinkCount} value="+10">+10</button> <button onClick={onClinkCount} value="+1">+1</button> </div> ) } export default Controller카운트 넘버 표시부분인 Viewer.jsxconst Viewer = ({ num }) => { return ( <div> <div>현재 카운트:</div> <h1>{num}</h1> </div> ) } export default Viewer그리고 부모 컴포넌트인 App.jsx 입니다.import "./App.css" import Controller from './components/Controller' import Viewer from './components/Viewer' import useCount from './hooks/useCount' function App() { const [num, onClinkCount] = useCount(); return ( <div className='App'> <h1>Simple Counter</h1> <section> <Viewer num={num} /> </section> <section> <Controller onClinkCount={onClinkCount} /> </section> </div> ) } export default App 🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
혹시 MUI에 대한것도 배우나요?
이 강의에서 MUI에 대한 것도 배우는지 궁금합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
섹션25
이건 무슨 오류 일까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
무한스크롤(React Infinite Scroller)의 pageStart
16-02-infinite-scroller 강의 중에 이해가 가지 않는 코드가 한줄 있어서 질문드립니다! InfiniteScroll에 pageStart 옵션이 걸려있는데, 이게 어디에 영향을 주는건가요? 초기 페이지 번호라기에는 이 옵션을 999999 처럼 의미 없는 값을 줘도 문제 없이 작동하고 그러네요..딱히 의미가 없는 코드 같은데 pageStart라는게 어떤식으로 작동되는건지가 좀 궁금합니다..
-
미해결내 마음대로 되지 않는 백엔드 테스트코드 - 희망편 & 현실편
테스트 데이터 관련 질문입니다.
게시글과 게시글 카테고리가 존재해야만 댓글을 작성할 수 있는 구조에서, 다음과 같은 시나리오를 테스트하고자 합니다.사용자가 댓글을 10개 작성하면 뱃지가 발급되는 시나리오를 테스트하려고 합니다.댓글을 작성하려면 게시글과 게시글 카테고리가 먼저 저장되어 있어야 하며, 댓글에는 post_id가, 게시글에는 post_category_id가 각각 존재합니다.이 상황에서 다음 질문이 있습니다: 댓글에 있는 post_id와 게시글에 있는 post_category_id를 nullable 하게 설정해도 괜찮을까요?
-
미해결[2024] 비전공자도 가능한 React Native 앱 개발 마스터클래스
3-3강 레이아웃 구성하기 강의 오류
3-3강에 레이아웃 구성하기 강의 앞부분이 잘린거같은데 저만 그런가요..? 학습에 관련된 질문만 해주세요.질문은 상세하게 무엇이 궁금한지 작성해주세요.질문은 '마크다운'을 사용하여 할 수 있습니다.유사한 질문이 있었는지 살펴보고 질문 해주세요. 부담갖지 말고 강의에서 궁금하신 점 전부 질문해주세요 :)
-
미해결기획자님 이 정도 웹 개발은 배워보면 어떨까요? [이론+실습]
vue cli 설치 강의 중 오류
질문은 자세하게 적어주실 수록 좋습니다. 2-6 Vue CLI 설치 강의 Node. js 파일까지 설치 완료 -> Vue 설치 진행 과정에서 아래와 같은 오류가 뜹니다. npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.npm warn deprecated @babel/plugin-proposal-nullish-coalescing-operator@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.npm warn deprecated @babel/plugin-proposal-class-properties@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead. npm warn deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecated npm warn deprecated rimraf@2.6.3: Rimraf versions prior to v4 are no longer supportednpm warn deprecated @babel/plugin-proposal-optional-chaining@7.21.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead. npm warn deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecatednpm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supportednpm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supportednpm warn deprecated apollo-datasource@3.3.2: The apollo-datasource package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-errors@3.3.1: The apollo-server-errors package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package's functionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecatednpm warn deprecated apollo-server-types@3.8.0: The apollo-server-types package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package's functionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-plugin-base@3.7.2: The apollo-server-plugin-base package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package's functionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecatednpm warn deprecated shortid@2.2.16: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info. npm warn deprecated apollo-reporting-protobuf@3.4.0: The apollo-reporting-protobuf package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package's functionality is now found in the @apollo/usage-reporting-protobuf package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details. npm warn deprecated apollo-server-env@4.2.1: The apollo-server-env package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package's functionality is now found in the @apollo/utils.fetcher package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated subscriptions-transport-ws@0.11.0: The subscriptions-transport-ws package is no longer maintained. We recommend you use graphql-ws instead. For help migrating Apollo software to graphql-ws, see https://www.apollographql.com/docs/apollo-server/data/subscriptions/#switching-from-subscriptions-transport-ws For general help using graphql-ws, see https://github.com/enisdenjo/graphql-ws/blob/master/README.md npm warn deprecated vue@2.7.16: Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.changed 852 packages in 1m 75 packages are looking for funding run npm fund for details 재설치도 해 봤는데, 안되네요..!도와주세요! 추가로 터미널에 작성할 때 폴더명 뒤에 % 이것도 넣어야 하나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의에 대해 질문있습니다.
안녕하세요 강의를 열심히 보면서 하고 있습니다 궁금한 점이 커리큘럼이 html, css, js를 하고 리액트 강의도 있는 건가요? 아니면 리액트 없이 바로 Next.js 강의인가요?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
onCreate함수를 app컴포넌트가 아닌 editor컴포넌트에서 작성
app 컴포넌트에서 const [todos, setTodos] = useState(mockDate); 를 생성하고 자식 컴포넌트인 editor컴포넌트에서 oncreate 함수를 만들어도 되나요? app 컴포넌트에 state를 생성했으니 리스트 컴포넌트에도 전달이 가능할 거 같아서요. 이렇게 안하는 이유는 App에서 관리하는 것이 더 일관적이며 유지보수가 쉬운 구조라서 그런가요?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
ERROR in ./node_modules/antd/es/version/index.js 2:15-22
비디오 업로드 FORM 만들기 (1)에서 npm run dev를 하고 페이지를 확인하면 이러한 에러가 발생합니다. 어떻게 해결하면 좋을까요? 이외 기타에러 1.[1] WARNING in ./node_modules/mutationobserver-shim/dist/mutationobserver.min.js[1] Module Warning (from ./node_modules/react-scripts/node_modules/source-map-loader/dist/cjs.js):[1] Failed to parse source map from 'C:\Users\iokl3\OneDrive\문서\0. git\John_Ahn\John_Ahn_Youtube_React\1. Dev\boilerplate-mern-stack-master\client\node_modules\mutationobserver-shim\dist\mutationobserver.map' file: Error: ENOENT: no such file or directory, open 'C:\Users\iokl3\OneDrive\문서\0. git\John_Ahn\John_Ahn_Youtube_React\1. Dev\boilerplate-mern-stack-master\client\node_modules\mutationobserver-shim\dist\mutationobserver.map'[1] @ ./node_modules/rc-menu/es/DOMWrap.js 166:2-34 이외 기타에러 2.[1] ERROR in ./node_modules/antd/es/version/index.js 2:15-22[1] Should not import the named export 'version' (imported as 'version') from default-exporting module (only default export is available soon)[1] @ ./node_modules/antd/es/index.js 65:0-47 65:0-47[1] @ ./src/components/views/Footer/Footer.js 5:0-28 18:57-61[1] @ ./src/components/App.js 12:0-43 71:35-41[1] @ ./src/index.js 86:0-35 99:35-38
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
포트원 imp_uid 관련 문의드려요
안녕하십니까.포트원에서 테스트 결제후 받은 imp_uid 값으로 강의 서버의 createPointTransactionOfLoading API에 impUid값을 세팅해서 보내려고 합니다 .테스트 결제후에 받은 imp_uid 값은 결과값 오는거까지는 잘 되는데, 해당 API에 담아서 보내면 자꾸 404 에러가 뜹니다. 왜 이러는 걸까요 ?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
User.findByToken is not a function
안녕하세요 강의보구 실습중인데 이거 완성하고 실행시켜보니까 이런 오류상태인데 TypeError: User.findByToken is not a function at auth 아무리 구글링해봐도 못찾겠어서 혹시 이거 해결하신 분 있을까용 ㅠㅠuser.js 해당 함수 내용입니다ㅠㅠ 모 빼먹은게있을까요 userSchema.statics.findByToKen = function (token, cb) { var user = this; //토큰을 디코드 한다 jwt.verify(token, "token", function (err, decodeTkn) { //클라이언트에서 가져온 토큰과 디비에 보관된 토큰이 일치하는지 확인 user.findOne({ _id: decodeTkn, token: token }, function (err, user) { if (err) return cb(err); cb(null, user); }); }); };
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
chapter13(promise)부터 이해가 잘 안됩니다..ㅠ
설명은 너무나도 잘해주시는데 제가 아직 부족해서 그런지 이해가 잘 되지않습니다..promise를 실제 프로젝트에서 어떻게 적용하는지도 감이 안잡히고, 어떨 때 사용하는지도 잘 모르겠습니다..ㅠㅜ
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
부모에서 자식에게 props 전달할 때
Controller.propTypes = { count: PropTypes.number.isRequired, // count가 숫자형으로 필수 buttonClick: PropTypes.func.isRequired, // buttonClick이 함수형으로 필수 }; 전 위와같은 코드를 작성하지 않으면 props가 missing이라는 오류가 뜹니다. 혹시 이유를 알 수 있을까요?
-
해결됨[2024] 비전공자도 가능한 React Native 앱 개발 마스터클래스
VDM을 몇 번을 다시 했는데 잘 안됩니다.
나머지는 다 잘되는데 마지막 안드로이드 VDM에서 막혀서 연동이 실패가 나고 있습니다 제 나름대로 찾아보고 3번을 다시 했는데 안됩니다. 제가 뭘 놓치고 있는지 모르겠습니다.
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
카운터앱 강의 - state대신 ref
강의 6.3) 기능구현하기카운트 컴포넌트를 state로 만들어야 한다고 하셨는데 state대신 ref를 사용하면 어떻게 되나요?ref는 리렌더링을 유발하지는 않지만 dom에 접근이 가능한 걸로 알고 있습니다. 그렇다면 ref를 사용해도 무방하지 않냐는 것이 저의 생각입니다.ref를 사용한다면 ui변경이 가능하지만 리액트가 그 수정을 감지 못하는 문제가 생겨서 state를 사용하는 것인가요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
삭제 예정 강의는 언제 삭제 되나요? 저것때문에 수강완료를 못하면 회사에서 비용을 청구한다고 합니다~
삭제 예정 강의는 언제 삭제 되나요? 저것 때문에 수강완료를 못하면 회사에서 비용을 청구한다고 합니다~아니면 삭제 예정 강의를 듣지 않아도 수강 완료 할 수 있는 방법이 있을까요?
-
미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
RxJS 디버깅 질문 있습니다.
안녕하세요. 제로초님 제가 좀 질문이 많은 것 같은데, 항상 친절하게 답변해주셔서 감사합니다.다름이 아니라, 개발하면서 IDE의 디버깅 모드를 이용해본적이 거의 없고, 항상 값의 흐름과 변화를 콘솔로 찍어서 디버깅을 하곤 했는데, 디버깅 모드를 사용하면 좀 더 편하게 확인이 가능 한 것 같더라구요.그래서 한번 사용해보려고 했는데, 그냥 일반적인 crud api를 만들어서 중단점 찍고 디버깅을 돌려봤을때는 요청이 가다가 멈추고 값이 잘 나타나는걸 확인 할 수 있었습니다. 하지만, MSA로 구성되어있는 프로젝트에서 디버깅을 실행해보니까 중단점을 설정해놔도 걸리지가 않더라구요. 요청과 응답은 다르지 않을텐데 MSA라서 안되는건가 싶기도 해서 좀 찾아보니까 RxJS에서 디버깅 중단점이 잘 안된다는 글을 발견했습니다. 혹시 제로초님께서도 Observable같은 RxJS를 사용하시면서 디버깅에 어려움을 겪으셨던 경험이 있으신가요? 웹스톰 사용하시는걸로 알고있는데, 디버깅 어떻게 진행하시는지 공유해주시면 정말 도움이 많이 될 것 같습니다! 매번 콘솔로 확인하려니까 생산성이 너무 떨어지네요 ㅠ