emotion에 props 던지기 및 setState의 작동원리강의 49분경 설명에서.... 작성자,제목,내용 인풋창에 q,q,q를 입력하는 과정에서최종적으로 내용인풋에 q입력할때 처음에는 contents값이 없는 상태로 렌더링이 일어나고 42번째 함수가 종료가 될때, (임시로 저장해두었던 q) contents를 q로 바꾸라고 알아들어서 바꾸면 한번더 리렌더링이 일어나서 contents 값이 q가되어 있으므로 44번째 if문이 실행이 되어서 45번째 setMycolor가 실행이 되고, 또 다시 setMycolor가 바뀌므로 리렌더링 일어나서 버튼색이 노란색으로 바껴야 하는거 아닌가요? 왜 내용에 qw를 입력하는 순간 이 일이 일어나나요?

 안녕하세요. 언제나 좋은 강의 감사합니다! 다름이 아니라 section 14 과제인 마이페이지를 구현하는 중인데 나의 상품 페이지 pagination에 사용할 내 장터-나의 상품 count API는 어떤 걸 쓰면 될까요? 다른 페이지에서 사용할 count API는 모두 있는 것 같데 나의 상품만 없는 건지 제가 못 찾고 있는 건지 모르겠네요..

로그인은 가능한데 로그아웃은 어떻게 하는지 모르겠습니다 ㅠlogoutUser mutation으로 해도 에러가 떠서 찾아봐도 강의에 나와있지 않아서글 남깁니다!!

안녕하세요 취업할때 공부한 걸 블로그나 노션에 기록해뒀다가주소를 이력서에 첨부하면 좋다고 들었는데요노션에 공부노트 템플릿으로 저렇게 수업내용 같은거 작성하고 있는데제가 노션이 익숙치 않아서ㅜㅜ 이런식으로 해서 주소첨부해도 괜찮은 게 맞나요?혹시 팁이 있다면 알려주세요~^^

안녕하세요 혹시 강의 내용을 복습할 때깃허브나 블로그에 정리 요약 해서 업로드 해도 될까요? 

 let i = 0;while (i <10) {console.log(i)i = i +1}여기서 콘솔로 0 ~10 까지 찍히는데왜 10까지 찍히는건가요??강의 마지막에 편집오류인지 짤려서 이유가 안나와요      

안녕하세요 멘토님매번 강의 잘 듣고 있습니다.이번 강의를 마무리로 별도로 개인 토이프로젝트 개발을 시작하고 배포를 할 때가 오면 다시 배포 부분부터 수강할 예정인데 이 강의에서 이해가 좀 정확히 안되는 부분이 있어서 질문 글을 올렸습니다.API 모킹을 통해 가짜 게시글 생성 테스트 API를 보내서 result를 받는 부분 중, _id 값 부분이 이해가 잘 안됩니다.writer, title, contents 는 테스트 input 부분에 있던 내용들 그대로 result에 적어서 이 값들이 제대로 insert 되었는지 테스트를 하기 때문에 같은 값을 입력했다는 것은 이해를 했습니다.그런데 _id 부분은 왜 백엔드에서-받은-게시글ID 이라고 임의로 입력을 했는지 부분을 이해 못했습니다.id, _id 와 같은 값은 랜덤으로 생성되기에 뭘로 받아올지 모르기 때문에 테스팅 라이브러리에서 임의의 값으로 지정하도록 설정이 가능해서일까요?그렇다면 아폴로에서 캐싱할 때도 _id, id 라는 명을 인식해서 캐싱이 더 잘되듯이, 테스팅 라이브러리도 _id, id 명에 한정해서 개발자가 임의의 값을 입력해도 되도록 만들어 둔 것인지도 궁금합니다.// 가짜 mutation 만들기 (요청, 응답 모두) const mocks = [ { request: { query: CREATE_BOARD, variables: { createBoardInput: { writer: "철수", title: "안녕하세요", contents: "반갑습니다", password: "1234", }, }, }, result: { data: { createBoard: { _id: "백엔드에서-받은-게시글ID", writer: "철수", title: "안녕하세요", contents: "반갑습니다", }, }, }, }, ]; 

section 19 refresh Token을 공부하면서 새로고침시 토큰을 유지하는 방법에 대해 다음과 같이 알려주셨는데요const [accessToken, setAccessToken] = useRecoilState(accessTokenState); useEffect(() => { // 1. 기존방식(refreshToken 이전) // console.log("지금은 브라우저다!!!!!"); // const result = localStorage.getItem("accessToken"); // console.log(result); // if (result) setAccessToken(result); // 2. 새로운방식(refreshToken 이후) - 새로고침 이후에도 토큰 유지할 수 있도록 void getAccessToken().then((newAccessToken) => { setAccessToken(newAccessToken); }); }, []);이게 withAuth가 아닐시의 방법이고 withAuth 일때는 나중에 리뷰해주신다고 했는데, 강의 자료를 살펴보니 따로 적힌 방법이 없어서요. withAuth가 아닐때는 토큰 유지를 어떻게 하나요?

import NewBoard from "../../../../src/components/units/write/BoardWrite.container" import { useQuery, gql } from "@apollo/client" import { useRouter } from "next/router" const FETCH_BOARD = gql` query fetchBoard($boardId: ID!){ fetchBoard (boardId: $boardId) _id writer title contents } ` export default function editPage(props) { const router = useRouter() console.log("-------------------") console.log(router.query.detail) console.log("-------------------") const {data} = useQuery(FETCH_BOARD, { variables: { boardId : Number(router.query.detail) } }) console.log("++++++++++++++++++") console.log(data) console.log("++++++++++++++++++") console.log("###################################") return( <> <NewBoard isEdit={true} queryData = {data?.data?.fetchBoard}/> </> ) } 수정 페이지에서 라우터 안에 있는 보드 아이디로 쿼리 요청을 보내려 했는데 처음에는 router.query.detail이 undefined 상태로 있어서 그런지 오류가 나왔습니다 ㅜㅜ어떤 부분이 잘못된 걸까요..

 제 깃헙 아이디를 만들어서푸시를 해야 이 섹션 진행 할 수 있는건가요?vscode와 git 연결을 해야하는건지답변 부탁드립니다.

 이 수업에 대한 질문은 아니지만,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", });

 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하면next build 하라고 나오고 그대로 하면 또 다른 에러가 떠서 에러 동굴로 들어가는 느낌이에요 다른 폴더는 또 로컬서버 3000으로는 들어가지는데 코드 변경한게 저장해도 반영이 안되고 예전 모습 그대로만 나와요 구글링 해보면 도커를 설치해서 설정 추가하라고 나오는데 이렇게 따라해볼까요?? 구글에서 하라는대로 하다가 모두 엉망진창이 될까봐 두려워요

안녕하세요. 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.eslintrc.js.eslintrc.jsonpackage.json입니다.감사합니다!

 안녕하세요 멘토님.항상 강의 잘 보고 있습니다. 예전부터 문의드리려다가 자꾸 잊어먹던게 있었는데 이제서야 질문드립니다.export default function aaa() { const bbb = () => { ... } ... }위와 같이 강의를 들을 때 마다 왜 컴포넌트 부분의 최초 함수 선언 부분만 화살표 함수가 아닌 일반 함수 선언 방식으로 하시는지, 특별한 이유가 있는 것인지 궁금합니다. 감사합니다. 

안녕하세요 멘토님,항상 틈틈히 강의 잘 보고 있습니다.질문부터 말씀드리자면,OAuth로 로그인 기능을 만들면 백엔드에서 별도로 JWT관련 인증, 발급, 재발급 등의 로직을 개발해주지 않아도 되는지 궁금해서 질문을 드리게 되었습니다.제 상황을 말씀드리자면 토이프로젝트 개발을 슬슬 시작하려는데요, 시작하기에 앞서 백엔드 서버부터 먼저 만들고 있었습니다.해당 강의에서 제공해주는 백엔드 서버의 중고마켓이나 게시판 API를 활용한 것이 아닌,다른 주제로 개인 토이프로젝트를 새로 프론트부터 백엔드단까지 직접 만들어보려고 합니다.기존 웹 개발 경력이 조금 있어서인지 자바나 노드 백엔드 구축 등을 배워서 API를 개발하는 것은 할만했습니다.하지만 백엔드에서 딱 하나, JWT 관련 로직을 추가하는 부분이 제 기준으로 너무 어렵고 벽이더라구요. (현업에서도 JWT 경험이 없습니다)그래서 시간이 너무 걸려서 보류해두었다가 다시 강의를 듣고 있었는데 이번 강의에서 OAuth 관련 내용을 보게 되었습니다.더 찾아보니까 인증, 발급과 같은 각종 로그인 관련 기능들을 해당 OAuth 서버에서 제공해준다고 되어있더라구요.그래서 해당 부분들을 활용하면 기존의 JWT 발급이나 인증 관련 로직을 백엔드에서 직접 구축해야하는 부분을 스킵하고 진행할 수 있지 않을까 궁금해져서 질문 글을 올리게 되었습니다.강의 내용의 OAuth 부분을 보고 궁금해져서 질문을 올려야 겠다고 생각했는데 어쩌다 보니 백엔드 느낌의 질문 글이 되어 죄송합니다.하지만 멘토님이 백엔드쪽 강의도 하시는걸로 알고 있어 혹시나 질문을 드려봅니다.감사합니다.