묻고 답해요
140만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
안녕하세요! 환경세팅을 깃허브에서 그대로 따라 쳤는데 이상하게 에러가 발생합니다.
안녕하세요! 에러가 발생해서 여쭤보겠습니다. 환경세팅을 한 후에 yarn run client를 실행하면 아래와 같은 에러코드가 발생하는데 어떠한 이유에서 발생하는지 모르겠습니다... 코드는 그대로 똑같이 치고 강사님의 git파일들과도 비교했는데 에러가 발생합니다 ㅠㅠ PS C:\Users\Desktop\Toy Projects> yarn run client yarn run v1.22.11 $ yarn workspace client start internal/modules/cjs/loader.js:888 throw err; ^ Error: Cannot find module 'C:\Users\諛뺣???AppData\Roaming\npm\node_modules\yarn\bin\yarn.js' at Function.Module._resolveFilename ㅂ(internal/modules/cjs/loader.js:885:15) at Function.Module._load (internal/modules/cjs/loader.js:730:27) at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12) at internal/main/run_main_module.js:17:47 { code: 'MODULE_NOT_FOUND', requireStack: [] } error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
msgs.map is not a function
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. import { useState, useEffect, useRef } from "react"; import { useRouter } from "next/router"; import MsgItem from "./MsgItem"; import MsgInput from "./MsgInput"; import fetcher from "../fetcher"; import useInfiniteScroll from "../hooks/useInfiniteScroll"; const MsgList = (smsgs, users) => { const { query: { userId = "" }, } = useRouter(); const [msgs, setMsgs] = useState(smsgs); const [editingId, setEditingId] = useState(null); const [hasNext, setHasNext] = useState(true); const fetchMoreEl = useRef(null); const intersecting = useInfiniteScroll(fetchMoreEl); const onCreate = async (text) => { const newMsg = await fetcher("post", "/messages", { text, userId }); if (!newMsg) throw Error("something wrong"); setMsgs((msgs) => [newMsg, ...msgs]); }; const onUpdate = async (text, id) => { const newMsg = await fetcher("put", `/messages/${id}`, { text, userId }); if (!newMsg) throw Error("something wrong"); setMsgs((msgs) => { const targetIndex = msgs.findIndex((msg) => msg.id === id); if (targetIndex < 0) return msgs; const newMsgs = [...msgs]; newMsgs.splice(targetIndex, 1, newMsg); return newMsgs; }); doneEdit(); }; const onDelete = async (id) => { const receivedId = await fetcher("delete", `/messages/${id}`, { params: { userId }, }); setMsgs((msgs) => { const targetIndex = msgs.findIndex((msg) => msg.id === receivedId + ""); if (targetIndex < 0) return msgs; const newMsgs = [...msgs]; newMsgs.splice(targetIndex, 1); return newMsg; }); }; const doneEdit = () => setEditingId(null); const getMessages = async () => { const newMsgs = await fetcher("get", "/messages", { params: { cursor: msgs[msgs.length - 1]?.id || "" }, }); if (newMsgs.length === 0) { setHasNext(false); return; } setMsgs((msgs) => [...msgs, ...newMsgs]); }; useEffect(() => { if (intersecting && hasNext) getMessages(); }, [intersecting]); return ( <> <MsgInput mutate={onCreate} /> {userId && <MsgInput mutate={onCreate} />} <ul className="messages"> {msgs.map(x => ( <MsgItem key={x.id} {...x} onUpdate={onUpdate} onDelete={() => onDelete(x.id)} startEdit={() => setEditingId(x.id)} isEditing={editingId === x.id} myId={userId} user={users[x.userId]} /> ))} </ul> <div ref={fetchMoreEl} /> </> ); }; export default MsgList; -------- 에러 error - components/MsgList.js (72:14) @ MsgList TypeError: msgs.map is not a function 이유가 뭘까요 대체...
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
확장 프로그램
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 데이터의 값이 예쁘게 보이지 않아 질문을 올리게 되었습니다. 7 : 22에 교수님의 data는 펼쳐볼수도 있고 예쁘게 정리가 되어 있는데 저의 data는 그냥 나열만 되어 있어서 브라우저에서 보는 확장 프로그램에 대한 문제가 아닌가 라는 생각을 하게 되어서 질문을 하게 되었습니다.
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
TypeError: Cannot read property 'nickname' of undefined
저도 똑같은 에러가 발생하여 MsgItem이나 MsgList 전부 깃허브에 올려주신 코드 그대로 복붙도 해보았는데, 그래도 안됩니다. MacOS 사용중입니다. 왜 안되는지 모르겠습니다..
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
onupdate 매개변수
onupdate 함수의 매개변수를 (id, text) 로 넣어주었더니! 수정 버튼을 클릭 했을 때 내용이 바뀌지 않더라구요 그래서 혹시나해서 매개변수를 (text, id) 로 변경했더니 수정 기능이 제대로 작동 했습니다. 매개변수 순서가 바뀌면 문제가 있는걸까요??
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
yarn add를 했을 때 node_modules가 2개가 한꺼번에 생성이 되었는데 파일 경로가 잘못되어있었습니다!
해결했습니다!
-
해결됨얄팍한 GraphQL과 Apollo
csv 데이터에 대해서 질문 드립니다.
강사님 안녕하세요, 반갑습니다. 저는 얄코의 구독자이며 영상은 매우 잘 챙겨보고 있습니다. csv를 데이터베이스로 이용한 하신것에 대해서 깜짝 놀랐고, " 이걸로 다 CRUD를 구현을 하셨단 말이야?? ,, 하고 매우 기뻤습니다. " 그러나 강의에서 POST 로 localhost:3000/api/team >> 통해서 데이터를 넣어주면~ post man에서 들어간 데이터가 잘 확인이 되고, 브라우저에서도 확인을 해도 데이터가 잘 들어간 것이 확인이 됩니다. 근데 서버를 내렸다가 다시 올리면... 데이터가 없어져 있더라구요?? CSV데이터에 실제로 CRUD를 해보고 싶다는 생각이 듭니다. 1. csv 데이터베이스에 CRUD를 배워서 할 바에는 몽고디비를 쓰는 것이 좋을까요? 2. 구글에 검색을 해보니 하는 방법에 대한 글이 많더라구요, 추천하시는 글이 있으시면 추천이 가능하실까요? ps. 바쁘시면 답글 안다셔도 감사합니다. ㅋㅋㅋ
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
에러가 뜨는데 다 고쳐도 원인을 모르겠어요.
깃헙에있는 강사님 소스 내용으로 다 덮어씌어도 똑같은 에러가 뜹니다 ㅠㅠ..
-
해결됨풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
id 넘겨주는 부분 bind
아이디를 넘겨주는 곳에서 bind로 id 값을 바인딩 해주면 어떨까요? {isEditing ? <MsgInput mutate={onUpdate.bind(null, id)} text={text} /> : text} <button onClick={startEdit.bind(null, id)}>Fix</button>
-
미해결React 기반 Gatsby로 기술 블로그 개발하기
Error: Cannot find module 'graphql/polyfills/objectValues'
config 파일을 수정하고 나서 develop 을 실행하면 에러가 발생합니다. Error: Cannot find module 'graphql/polyfills/objectValues' google 에서는 답을 찾을 수 없는데 node module 삭제 후 graphql을 다시 깔아 보기도 했는데 해결이 안되네요... 도움부탁드려요~!~
-
미해결얄팍한 GraphQL과 Apollo
apollo관련 질문
좋은강의 감사드립니다! 다름이 아니라 실무에서 springboot + graphQL을 사용해야 하는데 스프링부트 환경에서는 apollo를 사용할 수 없는건가요? 사용할 수 없다면 apollo 같은 기능을 제공하는 라이브러리 또는 프레임워크가 있을까요??