묻고 답해요
138만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
github
제 깃헙 아이디를 만들어서푸시를 해야 이 섹션 진행 할 수 있는건가요?vscode와 git 연결을 해야하는건지답변 부탁드립니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
Next.js 버전
이 수업에 대한 질문은 아니지만,next.js의 버전이 올라갔는데가르쳐주시는 버전으로 배워도취업하는데에 문제가 없을까요??
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
빌드 아이디 바꾼 후 적용 안됨_재질문
안녕하세요. 이 강의에 질문을 달았는데 해결이 안되서 다시 질문드립니다.ㅠ 우선 로드밸런서에서는 아래의 동적페이지가 잘 작동되는것으로 확인됩니다.cloudFrond에서 연결도 잘 해줬구요. 그런데...제 도메인에서 부터 시작되는 부분은 자꾸 오류가 납니다.아래처럼요ㅠ아래 _buildManifest.js 네트워크창을 확인해보면 보드아이디도 잘 먹혀있는걸 확인할 수 있습니다.그런데 오류가 난 빨간부분에서는 뭔가 이상합니다.x-cache 부분을 보면 클라우드 프론트에 에러가 났다고 하는데 이유를 당최 모르겠습니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
기동시 동적으로 설정 정보를 읽어서 적용하는 방법
FE 서버 기동시(yarn start) 사전에 정의한 설정 정보를 읽어서 사용하는 방법이 있을까요?예를 들어, 아래 apollo의 uploadLink 생성 코드의 경우, 만약 graphql 서버 주소가 바뀌었다면 uri 부분을 변경해서 다시 빌드를 해야 되는데요.빌드없이 yarn start 시에 FE 서버 로컬 설정파일에서 uri를 읽어와서 적용하는 방식으로 하고 싶은데 어떤식으로 하면 좋을지요?.env 파일은 빌드 이후에 변경은 반영되지 않는것 같고.. SSR 같은 방법으로 해야 할까요? 아니면, 기동시에 accessToken 처럼 backend에 uri 정보를 조회해서 적용해야 할까요? const uploadLink = createUploadLink({ uri: "https://backendonline.codebootcamp.co.kr/graphql", headers: { Authorization: `Bearer ${accessToken}` }, credentials: "include", });
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
js d-day 카운터 질문 합니다.
const nowDate = new Date (); const dayDate = new Date ("2023-4-15") const count = (dayDate - nowDate) / 1000 ; const countDate = Math.floor(count / 3600 / 24); const countHours = Math.floor(count / 3600) % 24 ; const countMinutes = Math.floor(count / 60) % 60; const countSec = Math.floor(count) % 60;수업 시간 작성한 코드는 이해가 갑니다.d day 카운터 관련 구글링중 const dDay = new Date('2023-4-15'); const today = new Date(); const difference = dDay.getTime() - today.getTime(), // Ms 단위로 변환 secInMs = Math.floor(difference / 1000), minInMs = Math.floor(secInMs / 60), hourInMs = Math.floor(minInMs / 60), days = Math.floor(hourInMs / 24), // 남은 시간 계산 seconds = secInMs % 60, minutes = minInMs % 60, hours = minutes % 24;위의 코드를 보면 hours = minutes % 24 이부분이 이해가 가지 않습니다. minutes 은 나머지 값인데 왜 작동이 잘될까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
중고마켓 포트폴리오 포인트 충전오류
이렇게 코드를 작성하였는데계속 오류가 나네요 이유가 뭔지 알 수 있을까요 ?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
npm start 안됨
다른 폴더에서 연습하다가 다시 강의할때 만든 폴더를 로컬 서버에 연결하려고 하니 안되네요npm start하면next build 하라고 나오고 그대로 하면 또 다른 에러가 떠서 에러 동굴로 들어가는 느낌이에요 다른 폴더는 또 로컬서버 3000으로는 들어가지는데 코드 변경한게 저장해도 반영이 안되고 예전 모습 그대로만 나와요 구글링 해보면 도커를 설치해서 설정 추가하라고 나오는데 이렇게 따라해볼까요?? 구글에서 하라는대로 하다가 모두 엉망진창이 될까봐 두려워요
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
function 컴포넌트 생명주기 관련해서 질문있습니다.
안녕하세요. Section10 함수형 컴포넌트의 생명주기에서 궁금한 점이 있어 질문 드립니다.component가 unmount 되는 상황을 만들기 위해 router.push로 페이지를 이동하잖아요?그런데 router.push로 이동할 때는 return()=>{...}의 내용이 제대로 실행되는데,주소창에 직접 이동할 주소를 써서 이동했을 때에는 같은 동작이 실행되지 않더라구요.둘다 현재 컴포넌트가 제거되고 새로운 컴포넌트가 화면에 나타나는 것아닌가요? 다르게 동작하는데 이유가 있는지, 아니면 제가 코드를 잘못 쓴건지 피드백 부탁드립니다. 감사합니다! 작성코드 useEffect(() => { console.log('컴포넌트가 마운트됐습니다~'); return () => { alert('컴포넌트가 제거됩니다~'); }; }, []); useEffect(() => { console.log('컴포넌트가 변경됐습니다~'); }); const onClickButton = () => { setCount((prev) => prev + 1); }; const onClickMove = () => { router.push('/'); };
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
_app.tsx import 에러
안녕하세요 강사님, 강의 잘 듣고 있습니다.혹시 다음과 같은 에러가 발생하는데 뭘 잘못한지 모르겠어서 문의 남깁니다.아래 사진 파일들은 순서대로_app.tsx.eslintrc.js.eslintrc.jsonpackage.json입니다.감사합니다!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의를 듣다가 export default function () 관련 궁금점이 있습니다.
안녕하세요 멘토님.항상 강의 잘 보고 있습니다. 예전부터 문의드리려다가 자꾸 잊어먹던게 있었는데 이제서야 질문드립니다.export default function aaa() { const bbb = () => { ... } ... }위와 같이 강의를 들을 때 마다 왜 컴포넌트 부분의 최초 함수 선언 부분만 화살표 함수가 아닌 일반 함수 선언 방식으로 하시는지, 특별한 이유가 있는 것인지 궁금합니다. 감사합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
OAuth 관련 질문이 있습니다.
안녕하세요 멘토님,항상 틈틈히 강의 잘 보고 있습니다.질문부터 말씀드리자면,OAuth로 로그인 기능을 만들면 백엔드에서 별도로 JWT관련 인증, 발급, 재발급 등의 로직을 개발해주지 않아도 되는지 궁금해서 질문을 드리게 되었습니다.제 상황을 말씀드리자면 토이프로젝트 개발을 슬슬 시작하려는데요, 시작하기에 앞서 백엔드 서버부터 먼저 만들고 있었습니다.해당 강의에서 제공해주는 백엔드 서버의 중고마켓이나 게시판 API를 활용한 것이 아닌,다른 주제로 개인 토이프로젝트를 새로 프론트부터 백엔드단까지 직접 만들어보려고 합니다.기존 웹 개발 경력이 조금 있어서인지 자바나 노드 백엔드 구축 등을 배워서 API를 개발하는 것은 할만했습니다.하지만 백엔드에서 딱 하나, JWT 관련 로직을 추가하는 부분이 제 기준으로 너무 어렵고 벽이더라구요. (현업에서도 JWT 경험이 없습니다)그래서 시간이 너무 걸려서 보류해두었다가 다시 강의를 듣고 있었는데 이번 강의에서 OAuth 관련 내용을 보게 되었습니다.더 찾아보니까 인증, 발급과 같은 각종 로그인 관련 기능들을 해당 OAuth 서버에서 제공해준다고 되어있더라구요.그래서 해당 부분들을 활용하면 기존의 JWT 발급이나 인증 관련 로직을 백엔드에서 직접 구축해야하는 부분을 스킵하고 진행할 수 있지 않을까 궁금해져서 질문 글을 올리게 되었습니다.강의 내용의 OAuth 부분을 보고 궁금해져서 질문을 올려야 겠다고 생각했는데 어쩌다 보니 백엔드 느낌의 질문 글이 되어 죄송합니다.하지만 멘토님이 백엔드쪽 강의도 하시는걸로 알고 있어 혹시나 질문을 드려봅니다.감사합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
prevState를 사용하여 리팩토링
import { useState } from "react"; import { Modal } from "antd"; import { Address } from "react-daum-postcode/lib/loadPostcode"; import DaumPostcodeEmbed from "react-daum-postcode"; const ModalCustomPage = () => { const [isModalOpen, setIsModalOpen] = useState(false); const onToggleModal = () => { setIsModalOpen((prev) => !prev); }; const handleComplete = (address: Address) => { console.log("실행되었습니다."); console.log(address); onToggleModal(); }; return ( <> {isModalOpen && ( <Modal title="모달 제목" open={true} onOk={onToggleModal} onCancel={onToggleModal} > <DaumPostcodeEmbed onComplete={handleComplete} /> </Modal> )} </> ); }; export default ModalCustomPage; 안녕하세요, 한 가지 궁금증이 들어 질문합니다.onToggleModal 함수를 보면 prevState를 사용해서 isOpenModal 값을 바꾸는데 굳이 그럴 필요가 있을까? 라는 생각이 들어서요. const onToggleModal = () => { setIsModalOpen((!isModalOpen); };onToggleModal 안에서 여러개의 setIsModalOpen이 실행되는 것이 아니기 때문에 그냥 이렇게 코드를 작성해도 함수가 끝나면 isOpenModal 값이 바뀌고 리렌더링되어 버그 없이 잘 실행될 것 같은데 혹시 다른 이유가 있나요?아님 setState 사용할때 prevState를 사용하는 것이 암묵적인 원칙인가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
graphql의 DOCS가 강의와 다른 것 같아요.
섹션 6 포트폴리오 리뷰 영상 보면서 따라하고 있는데 아무래도 createBoard의 파라미터랑 리턴값이 강의와 다른 것 같아서 오류가 발생하는 것 같은데 어떻게 해야 같은 API를 사용할 수 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
빌드 아이디 바꾼 후 적용 안됨
안녕하세요. 강의 진행 중 빌드 아이디가 적용이 안되어 문의 드립니다. 우선 next.config.js파일에generateBuildId: () => "codecamp_deploy",라는 명령을 통하여 빌드 아이디를 일치시키고 빌드하였습니다. 그런데 ec2에서는 빌드아이디가 계속 이전 것으로 유지됩니다. 원인이 무엇일까요? 아래는 제가 진행한 과정입니다. 1. 빌드 후 aws S3에 다시 올림, 퍼블릭 설정완료 2. git push 완료 ec2에서 git pull 완료 4-1 .next 변경사항 확인 결과는 안됨혹시 제가 놓친 부분이 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
댓글 삭제 에러 관련질문
댓글 삭제가 잘 진행이 되다가 .. 다음과 같은 에러창이 뜨면 더이상 삭제가 진행되지 않습니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
대댓글 기능 구현
대댓글 기능을 구현하라고 했는데, graphql을 보면대댓글 기능을 구현할 수 있는 query가 보이지 않아요.fetchBoardcomments는 있는데, 이건 그냥 댓글 리스트를 가져오는 query고 대댓글 리스트를 가져오는 query는 안보여요.혹시나 해서 포트폴리오 리뷰를 참고했지만 SECTION9-1에서 대댓글 기능 구현에 대한 언급은 따로 없는거같아서요. 제가 못찾는건가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의 난이도와 강의가 취업에 충분한지 궁금합니다
안녕하세요 취업을 위해 강의를 구매하고 듣고 있습니다혹시 이강의 만으로 취업이 가능할까요?보통 국비학원이나 오프라인 코드캠프 과정에 비해 내용이 좀 적은 편인가요?난이도가 입문이라고 되어 있어서 더 따로 공부해야 취업을 위한 실력이 가능한 건지 궁금합니다혹시 부족하다면 어떤 부분을 따로 공부하는게 좋나요?그리고 또 알고리즘같은 것도 여기서 다루나요? 따로 공부해야 하나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
qql
qql에서 백틱 다음에 저는 문자열로 모든게 표현되는데, 강의 화면에서는 다르게 나오던데 어떤 익스텐션을 추가해야 되나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
cloudFront에 원본 프로토콜
원본 도메인을 적는 칸에 강의와는 다른 프로토콜 칸이 생겼습니다.해당 부분은 어떻게 진행하는 것인가요?++ 우선 뷰어 일치로 진행하였는데, 받은 주소가 자꾸 에러가 나네요.자물쇠는 걸렸지만 아래처럼 나옵니다!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
.git 파일
초기 세팅부분에서 ls -al 했을때 .git 파일이 나오면 어떻게 삭제를 해야하죠? 그리고 이전 수업에서는 .git 파일을 따로 삭제하진 않았던것같은데 혹시 했었다면 어떤 강의에서 했는지 알 수 있을까요?