inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

네트워크창에서 API Key를 감추고 싶습니다.

해결됨

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

안녕하세요 튜터님, 일전에 마커 클러스터링에 관해 질문했던 수강생입니다. 먼저 튜터님의 강의로 제 사이드 프로젝트가 잘 마무리 됬다는 것을 알려드리고 싶어 아래 도메인도 공유 드리고 싶습니다. https://www.by-zip.com/ 튜터님이 가르쳐 주신 내용을 적극 활용했으니 피드백도 주시면 더욱 감사드리겠습니다 ! https://forms.gle/rKAjAws43XLUAJsA9 (사실 8,9,10 까지 피드백 주시면 스타벅스 기프티콘도 1장씩 드리고 있습니다ㅋㅋ) 아무튼... 본론으로 들어가서 .. 현재 저의 문제 상황은 네트워크 창에서 아래 이미지와 같이 키값이 노출된다는 문제 입니다. 저희는 실제 서비스를 목표로 하고 있어서 키값이 노출되는건 반갑지 않은 상황이라서요 .. 그래서 제가 시도했던 방법은 next.config.js 에서 rewrite() 를 적용해보는 것이였습니다. 위 그림과 같이 시도해보았으나. API 인증에 실패했습니다. encode url component 로 시도해 보았지만 결과는 실패였습니다.. 어떻게하면 좋을지 답을 찾기가 힘들어 문의드립니다.. 좋은 강의 만들어주시어 감사드립니다.

  • seo
  • next.js
  • vercel
  • csr
  • ssg
  • ssr
윌럄 댓글 1 좋아요 1 조회수 3137

Graphql fetBoard 재질문

해결됨

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

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("") const{data}=useQuery(FETCH_PRODUCT,{ variables:{ boardId: router.query.qqq } }) console.log(data?.fetchBoard?.createdAt) 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 조회수 289

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

서버 터진건가요..

해결됨

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

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

수정등록페이지

해결됨

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

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

백엔드 수업 부분

해결됨

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

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

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

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

질문좀 드릴께요 지도

해결됨

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

안녕하세요 선생님 혹시 지도는 구글지도를 이용해서 하는 방법은 없을까요? 수강신청했습니다

  • seo
  • next.js
  • vercel
  • csr
  • ssg
  • ssr
나만죽을순없지 댓글 1 좋아요 1 조회수 533

Section Quiz7 에서 질문이 있습니다.

해결됨

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

퀴즈7에 있는 소주제 : 컴포넌트 재사용성과 수정 프로세스 에서 질문이 있습니다. updateProduct로 수정하는 부분인데요. 페이지 모두 만들었는데. 여기서 수정이 완료 됐다고 하는데 데이터가 null값으로 들어가네요.. 밑에는 container페이지와 queries페이지 입니다. 어느 부분이 잘못됏는지 모르겠어서 질문드립니다. http://practice.codebootcamp.co.kr/graphql 에서 create부분에선 seller를 바로 받아오는데 밑에서는 productId로 받아옵니다. 이렇게 된다면 수정페이지 에서는 seller 는 수정 못하게 되는건가요?

  • graphql
  • seo
  • nodejs
  • react
  • Next.js
임프런 댓글 2 좋아요 0 조회수 525

Use 'import type' 에러 및 eslintrc.json

해결됨

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

1. 강의를 똑같이 따라했는데 위와같은 메시지가 뜹니다! import 말고 import type을 쓰라는데 멘토님과 다르게 왜 이런 에러가 일어나는건가요? 2. 저는 class파일에 eslintrc.json파일이 없어서 화면보고 그냥 따라 적기만 했는데 문제가 없을까요?

  • Next.js
  • graphql
  • seo
  • nodejs
  • react
ju han 댓글 3 좋아요 0 조회수 590

BoardWrite.presenter의 작성자 input 값의 defaultValue

해결됨

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

BoardWrite부분의 presenter의 작성자 부분에 defaultValue값에 자꾸 오류가 떠서 문의드립니다. 비밀번호나 내용부분과 같이 다른 input창의 defaultValue에는 문제가 생기지 않는데 왜 유독 작성자 부분에만 에러가 뜨는지 모르겠습니다. 그런데 멘토님 파일에는 이전시간에 배우지 않았던 readOnly부분이 추가되어있고 defaultValue값도 수정되어있더라구요! readOnly에 대한 부분은 구글링을통해 왜 쓰는지는 알았지만 뒤에 {!!props.~~} 왜 이렇게 선언하는지와, defaultValue부분에 || "" 부분이 왜 들어가는지 모르겠습니다ㅠ

  • Next.js
  • react
  • graphql
  • seo
  • nodejs
ju han 댓글 1 좋아요 0 조회수 587

궁금한 점이 있어요!

해결됨

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

const mapOptions = { ..., logoControlOptions: { position: naver.maps.Position.BOTTOM_LEFT, }, }; 제 생각에는 전역 컨텍스트에 naver 객체가 생성되어 접근이 가능 한 것 같은데, 전역 컨텍스트에 naver라는 객체가 생성되는 시점이 궁금합니다.. !

  • seo
  • ssr
  • ssg
  • Next.js
  • vercel
  • csr
김동훈 댓글 2 좋아요 1 조회수 560

포트폴리오 - modal에서의 오류

해결됨

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

주소입력창 까지 잘 진행되었는데 비밀번호 모달창을 만들면서 부터 오류가 나기 시작했습니다. 어디서부터 잘 못된 것인지 잘 모르겠는데.. 계속 이런 오류가 뜹니다. 어떻게 해결해야 할까요?

  • nodejs
  • graphql
  • seo
  • react
  • Next.js
suny_fun 댓글 1 좋아요 0 조회수 461

netlify 배포시 cors 문제

해결됨

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

안녕하세요 자유게시판을 어느정도 구현해서 netlify를 통해 배포해보려고 하니 cors 문제로 api가 작동하지 않습니다. 어떻게 해야 해결할 수 있을까요 ? Access to fetch at ' https://backendonline.codebootcamp.co.kr/graphql ' from origin ' https://brilliant-rabanadas-0c6769.netlify.app ' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value ' http://localhost:3000 ' that is not equal to the supplied origin. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

  • node.js
  • Next.js
  • seo
  • graphql
  • nodejs
  • next.js
  • react
김태진 댓글 1 좋아요 0 조회수 969

section13 포트폴리오 리뷰 파일

해결됨

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

section13 포트폴리오 리뷰파일 잘못 올라가있습니다! 확인부탁드립니다 freeboard 폴더 graphql 주소가 다르고 class폴더가 딸려있습니다

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

마커 클러스터링 도입

미해결

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

안녕하세요, 강의 보면서 많은 도움 받았습니다. 제가 추가로 마커클러스터링을 도입하려고 하는데 네이버에서 제공하는 깃헙 예제 코드를 봐도 도무지 이해가 안가서요.. 혹시 어떤식으로 풀어나가면 될지 궁금합니다... ㅠㅠ

  • next.js
  • ssg
  • vercel
  • ssr
  • csr
  • vercel
  • ssg
  • ssr
  • Next.js
  • seo
  • cluste
윌럄 댓글 2 좋아요 2 조회수 2960

프리캠프 섹션 2 "CSS 의 기본과 싸이월드 실습 1탄 > CSS 정렬" 강의 질문입니다

해결됨

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

CSS 정렬 강의 마지막 숙제에서 회원 가입 화면을 아래 피그마처럼 만들라고 숙제를 주셨는데요. 숙제 다하고 예시(답안?) 코드는 없는 건가요? 제가 코드를 만들고 참고하려고 답안 코드를 찾으려고 하니 없네요. 설마 없지는 않겠지요?

  • Next.js
  • node.js
  • seo
  • graphql
  • nodejs
  • next.js
  • react
Anne.oh 댓글 1 좋아요 0 조회수 791

인기 태그

인프런 TOP Writers

주간 인기글