inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

graphql query가 안돼요

해결됨

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

import {Bigframe, ResultWrapper, UserBox, UserInfo, Boundary } from "@/styles/emotion"; import { gql,useQuery } from "@apollo/client" import { useRouter } from "next/router" import{useState} from 'react' const FETCH_PRODUCT = gql` query fetchBoard($boardId: ID!){ fetchBoard(boardId:$boardId){ writer title contents createdAt } } ` export default function BulletinBoardFetch() { const router = useRouter() const[writer,setWriter]=useState("") const[creatDt,setCreatDt]=useState("") console.log(router.query.qqq) const{data}=useQuery(FETCH_PRODUCT,{ variables:{ boardId: `${router.query.qqq}` } }) console.log(data) setCreatDt(data.fetchBoard.createdAt) setWriter(data.fetchBoard.writer) return( <div> <Bigframe> <div> banner1 </div> <div> banner2 </div> <ResultWrapper> <UserBox> <img src="../../../public/userpic.png" alt=""/> <UserInfo> <Writer>{writer}</Writer> <CreateDate>{createDt}</CreateDate> </UserInfo> <img src="../../../public/clip.png" alt=""/> <img src="../../../public/location.png" alt=""/> <Boundary></Boundary> </UserBox> </ResultWrapper> </Bigframe> </div> ) } 뭐가 문제인걸까요...ㅠㅠ

  • react
  • node.js
  • seo
  • graphql
  • next.js
웹서퍼 댓글 1 좋아요 0 조회수 550

노션페이지에 예전에 있었던 section 1,2,3이 없네요

해결됨

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

일부러 삭제하신 건가요? 오랜만에 복습하러 왔는데 안보이네요

  • react
  • node.js
  • seo
  • graphql
  • next.js
Jun 댓글 2 좋아요 0 조회수 664

타입에러 해결에 도움이 필요합니다.

미해결

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

필요한 정보를 넣어주고 회원가입 버튼을 누르면 saga 의 user.js 에서 signUp 에서 에러가 발생하는데 이유를 모르겠습니다.

  • react
  • redux
  • node.js
  • express
  • next.js
댓글 1 좋아요 0 조회수 393

조언 부탁드립니다.

해결됨

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

안녕하세요. 혼자서는 결론을 내리지 못해 더 많은 경험과 고민을 한 제로초님께 조언을 구하고 싶습니다. 제가 기존 코드에 Menu가 있었습니다. 그리고 이번에 타입스크립트로 마이그레이션 했는데 네이밍 컨벤션에 고민이 있습니다. 이 이름을 쓰는 곳은 총 4곳 입니다. menu - 데이터로 불러오는 menu Menu - 타입으로서 Menu Menu - 페이지(메뉴 상세 페이지) Menu - 메뉴 아이템(메뉴 리스트 안에 각각 뿌려지는 메뉴 아이템) 사실 타입이 없을 때는 아래 2개의 파스칼 케이스의 Menu가 이름으로 겹칠 일이 없었습니다. 그러다가 타입을 도입 했는데, 타입인 Menu 같은 경우 제로초님이 요즘은 앞에 헝가리안 표기법으로 타입인지 인터페이스인지를 표기 안하는 추세라고 하시기도 했고, 프로그래밍에서 가장 중요한게 데이터라 생각해서 그 데이터의 타입은 그대로 쓰는게 좋다고 생각했습니다. 페이지 같은 경우에는 파일 명과 반드시 같은 필요가 없다 해서 라우팅할때 menu.tsx를 쓰더라도 파일 내부에서는 MenuPage로 명명했습니다. 그리고 남은 컴포넌트가 문제인데 다른 강의를 봐도 MenuComponent 같은 이름 보단 다른 강의에서 List를 붙이시는거 보고 MenuItem으로 컴포넌트 명을 지으려고 하는데 괜찮을까요?? 감사합니다!!

  • react
  • redux
  • node.js
  • express
  • next.js
Milkyway 댓글 1 좋아요 0 조회수 343

수강기간 관련하여 질문 드립니다.

미해결

만들면서 배우는 프론트엔드 DO IT 코딩 (Next.js, Typescript)

안녕하세요 강사님! 수강을 완료하고 개인적으로 플젝을 진행하며 복습을 하고있습니다. 많은 도움이 되었고, 강의 내에 코드 짤 때의 깨알 꿀팁도 많아서 코드 짜는 실력이 많이 늘었습니다. 다시 한 번 감사합니다. 지금 강의를 다시 들으며 머릿속을 정리하고 싶은데 기간이 3주도 채 안남아있어서 혹시 연장이 가능할지 여쭤봅니다😥😥 감사합니다.

  • next.js
은선 댓글 1 좋아요 0 조회수 439

서버 터진건가요..

해결됨

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

http://practice.codebootcamp.co.kr/graphql 요청 보내면 502 에러 뜨네요ㅜㅜ 확인 한번만 해주시면 감사하겠습니다...

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

비회원 장바구니 구현 리뷰

해결됨

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

노션에 비회원 장바구니 구현 리뷰 코드 그대로 복붙해서 실행하면 에러400에 화면이 안뜹니다!

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

pgadmin4 질문입니다

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

현재 올려주신 pgadmin4 설정과 동일하게 값을 넣어도 Undable to connect to server localhost failed: 치명적오류: 사용자 "postgres"의 password인증을 실패했습니다 라는 에러가 떠서 register server에서 방법을 인터넷을 보고 제 ip주소도 넣어보고, pg_hba.conf에서 서버 확인하고 locahost, 127.0.0.1 두가지 모두 입력이 먹히지 않네요

  • react
  • node.js
  • postgresql
  • docker
  • typescript
  • 클론코딩
  • next.js
댓글 1 좋아요 0 조회수 354

Duplicate entry '2-349' for key 'posthashtag.PRIMARY'

미해결

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

음 .. 게시글 하나에 중복으로 된 해시태그를 2개 등록시 ex) #노드#노드 #익스프레스 DB Posts 테이블에는 데이터가 잘 등록되지만 해시태그 아래와 같은 에러가 발생됩니다. Hashtags 테이블에는 등록되지 않습니다. primary key 가 중복이라고 오류 나는 것 같은데 .. findOrCreate 는 DB상에 중복이 안되는거고 .. 생각나는 방법은 Set, filter, split, match, ... 등으로 중복 제거인데 .. findOrCreate 전에 중복제거 해줘야하는 부분일까요? Error at Query.run (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/dialects/mysql/query.js:52:25) at /Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/sequelize.js:314:28 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async MySQLQueryInterface.bulkInsert (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/dialects/abstract/query-interface.js:346:21) at async recursiveBulkCreate (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/model.js:1663:25) at async PostHashtag.bulkCreate (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/model.js:1752:12) at async Promise.all (index 0) at async BelongsToMany.add (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/associations/belongs-to-many.js:516:30) at async /Users/jeondaewon/WebstormProjects/nodebird/prepare/back/routes/post.js:40:13 { name: 'SequelizeUniqueConstraintError', errors: [ ValidationErrorItem { message: 'PRIMARY must be unique', type: 'unique violation', path: 'PRIMARY', value: '2-358', origin: 'DB', instance: null, validatorKey: 'not_unique', validatorName: null, validatorArgs: [] } ], parent: Error: Duplicate entry '2-358' for key 'posthashtag.PRIMARY' at Packet.asError (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/packets/packet.js:728:17) at Query.execute (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/commands/command.js:29:26) at Connection.handlePacket (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/connection.js:488:32) at PacketParser.onPacket (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/connection.js:94:12) at PacketParser.executeStart (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/packet_parser.js:75:16) at Socket.<anonymous> (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/connection.js:101:25) at Socket.emit (node:events:513:28) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Readable.push (node:internal/streams/readable:234:10) { code: 'ER_DUP_ENTRY', errno: 1062, sqlState: '23000', sqlMessage: "Duplicate entry '2-358' for key 'posthashtag.PRIMARY'", sql: "INSERT INTO `PostHashtag` (`createdAt`,`updatedAt`,`HashtagId`,`PostId`) VALUES ('2023-03-07 05:57:36','2023-03-07 05:57:36',3,358),('2023-03-07 05:57:36','2023-03-07 05:57:36',2,358),('2023-03-07 05:57:36','2023-03-07 05:57:36',2,358);", parameters: undefined }, original: Error: Duplicate entry '2-358' for key 'posthashtag.PRIMARY' at Packet.asError (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/packets/packet.js:728:17) at Query.execute (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/commands/command.js:29:26) at Connection.handlePacket (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/connection.js:488:32) at PacketParser.onPacket (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/connection.js:94:12) at PacketParser.executeStart (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/packet_parser.js:75:16) at Socket.<anonymous> (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/mysql2/lib/connection.js:101:25) at Socket.emit (node:events:513:28) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Readable.push (node:internal/streams/readable:234:10) { code: 'ER_DUP_ENTRY', errno: 1062, sqlState: '23000', sqlMessage: "Duplicate entry '2-358' for key 'posthashtag.PRIMARY'", sql: "INSERT INTO `PostHashtag` (`createdAt`,`updatedAt`,`HashtagId`,`PostId`) VALUES ('2023-03-07 05:57:36','2023-03-07 05:57:36',3,358),('2023-03-07 05:57:36','2023-03-07 05:57:36',2,358),('2023-03-07 05:57:36','2023-03-07 05:57:36',2,358);", parameters: undefined }, fields: { PRIMARY: '2-358' }, sql: "INSERT INTO `PostHashtag` (`createdAt`,`updatedAt`,`HashtagId`,`PostId`) VALUES ('2023-03-07 05:57:36','2023-03-07 05:57:36',3,358),('2023-03-07 05:57:36','2023-03-07 05:57:36',2,358),('2023-03-07 05:57:36','2023-03-07 05:57:36',2,358);" } Error at Query.run (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/dialects/mysql/query.js:52:25) at /Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/sequelize.js:314:28 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async MySQLQueryInterface.bulkInsert (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/dialects/abstract/query-interface.js:346:21) at async recursiveBulkCreate (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/model.js:1663:25) at async PostHashtag.bulkCreate (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/model.js:1752:12) at async Promise.all (index 0) at async BelongsToMany.add (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/node_modules/sequelize/lib/associations/belongs-to-many.js:516:30) at async /Users/jeondaewon/WebstormProjects/nodebird/prepare/back/routes/post.js:40:13 POST /post 500 40.883 ms - 1306

  • react
  • redux
  • node.js
  • express
  • next.js
대원 댓글 1 좋아요 0 조회수 387

수정등록페이지

해결됨

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

Unhandled Runtime Error ApolloError: Failed to fetch 수정등록페이지 들어가면서 갑자기 이게 뜨는데 코드는 봐도 다 똑같은거 같은데 아니면 혹시 수업내용 코드만 따로 깃 이나 확인할 수 있나요? http://practice.codebootcamp.co.kr/graphql 해당주소로 들어가니 Error: Server Error The server encountered a temporary error and could not complete your request.Please try again in 30 seconds. 라고 뜨고 있습니다.

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

formData 대신 객체로 보낼때

미해결

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

백엔드에 게시글 등록시 const upload = multer({...}) router 에서 upload.none() 를 사용하였습니다. 작성된 코드에서는 이미지 업로드 버튼을 누르고 이미지 선택 확인 누르는 순간 로컬에 저장되고 반환되어 프론트에서 imagePaths 에 담겨있습니다. 그 후 강의에선 imagePaths를 FormData에 담아서 보내고있는데 imagePaths는 텍스트만 들어있어서 객체로 보내보려고합니다. 배열을 그대로 담으면 될 것 같아 dispatch({ type: ADD_POST_REQUEST, data: { imagePaths, content: text }, }); 이렇게 작성하여 보냈는데 Network에서도 성공이고 프론트에서도 오류나는것 없이 다 SUCCESS입니다. 게시글에는 사진이 나타나지 않습니다. 경로가 잘못된 것 같지는 않고 .. 어떤 문제가 있는걸까요? [등록 전] [등록 후]

  • react
  • redux
  • node.js
  • express
  • next.js
대원 댓글 1 좋아요 0 조회수 462

[공유] next 13 버전 Link 태그 속 a 링크 오류

미해결

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

Error: Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior>. Learn more: https://nextjs.org/docs/messages/invalid-new-link-with-extra-anchor next 13 버전 이후로부터는 Link 태그 속에 a 태그 넣지 않아야 정상 작동 합니다. 만약 꼭 Link 속에 a 태그를 넣어야 한다 (예시, 이전 버전 코드를 13으로 변경하는데 class 속성 등이 a 태그에 있다) link 에 legacyBehavior 넣으면 됩니다. <Link href="/" legacyBehavior> <a className="... code"> </a> </Link>

  • react
  • redux
  • node.js
  • express
  • next.js
alvinlog 댓글 1 좋아요 14 조회수 4310

선생님 Props내려줄때

미해결

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

data 프롭의 경우는 이미 id ,title, completed 같은 정보들이 다 들어있는거니까 data프롭만 내려받아서 List.js에서 .id, .title, .completed로 써도 문제가 없는거죠?

  • react
  • redux
  • tdd
  • typescript
  • next.js
바퀴Roach 댓글 1 좋아요 0 조회수 348

[공유] 개인 서버에서 reverse-proxy 적용시 next dev 설정

미해결

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

제목 내용 그대로 서버에서 reverse-proxy 적용시 next dev 실행에 관한 내용입니다. 아래 링크 참고 하시면 됩니다. ( https://itnext.io/one-domain-multiple-next-js-apps-5e39b0ffa1bf ) package.json이 있는 위치에 next.config.js 파일 만들고 module.exports = { assetPrefix: "/npm", }; +) 추가 사항 : 혹시 개인 서버에서 https 적용 중이시면, hmr에서 "WebSocket is closed before the connection is established" 오류 발생합니다. ( https://github.com/vercel/next.js/issues/31139 ) 에서 해답을 찾기는 했는데... 네트워크 탭 보면 이미 wws:// 로 요청이 가서 왜 해결이 되는지는 모르겠지만, hmr 잘 작동됩니다. module.exports = { assetPrefix: "https://{서버 도메인 주소}/npm", } 참고로 nginx reverse-proxy 설정 입니다 location /npm/ { proxy_pass http://localhost:8084/; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Host $server_name; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection upgrade; proxy_set_header Accept-Encoding gzip; }

  • react
  • redux
  • node.js
  • express
  • next.js
alvinlog 댓글 1 좋아요 1 조회수 1111

useSWR 사용시 타입 지정

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 커뮤니티 정보가져오는 useSWR에서는 다른 곳처럼 타입지정을 따로안했는데 원래는 [slug].tsx 에서 사용한 useSWR처럼 타입지정을 해줘야하나요??

  • react
  • node.js
  • postgresql
  • docker
  • typescript
  • 클론코딩
  • next.js
oridori2705 댓글 1 좋아요 0 조회수 322

cookie 완전히 제거 하는법

미해결

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

로그아웃을 했을때 브라우저에서 쿠키를 완전히 제거하는 코드를 구현했습니다 그런데 페이지 이동을 하는게 아니면 같은 페이지에선 새로고침을 하면 계속 connect.sid에 쿠키가 남아있는데 완전히 없애는 방법 없는지 여쭤보고 싶습니다

  • react
  • redux
  • node.js
  • express
  • next.js
bs44108 댓글 1 좋아요 0 조회수 2558

백엔드 수업 부분

해결됨

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

안녕하세요 백엔드 수업 부분은 실습이 불가하다고 하는데, 따로 vscode 사용없이 강의만 수강해도 괜찮은건가요?

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

스크롤때문에 데이터 불러오는거

미해결

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

스크롤때문에 무한으로 데이터 요청 보내는거 작업, 게시글 좋아요 강의 편에서 한다고 했는데 돌려봐도 스크롤 데이터 요청막는거 안보여서요 아직 구현 안한건가요?

  • react
  • redux
  • node.js
  • express
  • next.js
오일중 댓글 1 좋아요 0 조회수 283

run dev 오류

해결됨

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

notion에 있는 '수업 프로젝트 설치할 것' 이후 yarn dev를 해보면 다음과 같이 Can't resolve '@styles.Home.module.css'가 뜹니다. _app.js에 있는 import문도 삭제하였는데, 해당 문제가 해결되지 않아 qqq폴더 안에 index.js도 실행이 되지 않습니다..! 혹시 어떻게 해결 가능할까요? 실행 위치는 codecamp, class, qqq 모두 해보았는데 같은 오류가 발생합니다! ㅠㅠ + import styles from ~~부분을 주석처리하고, return 안의 내용을 삭제시키니 동작하는데 삭제시켜둔 상태로 강의를 진행해도 괜찮나요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
설기 댓글 1 좋아요 1 조회수 445

apollo-client의 사용 및 _app.js 작동원리

해결됨

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

example 주소 : http://practice.codebootcamp.co.kr/graphql 이 주소가 이렇게 떠서 포트폴리오용 주소 : http://backendonline.codebootcamp.co.kr/graphql 이주소를 uri에 넣었고 이렇게 실행해봤더니 이렇게 뜨네요 버튼을 눌러도 네트워크에 뜨지 않습니다 뭐가 문제일까요?..

  • react
  • node.js
  • seo
  • graphql
  • next.js
웹서퍼 댓글 1 좋아요 0 조회수 451

인기 태그

인프런 TOP Writers

주간 인기글