학습 자료(노션)에 포트폴리오 리뷰가 안 보입니다.

항상 좋은 강의 감사합니다.다름이 아니라 혹시 강의 들으면서 같이 볼만한 책이나 교재 같은게 있을까요? 

작성된 코드는 똑같은데 타이머가 작동하지 않아요 ㅠㅠ min과 sec 두 변수 모두 String으로 감싸줘보기도 하고 min "+" sec 부분을 String으로 감싸주기도 해봤는데 해결이 안돼요 let auth = () => { const token = String(Math.floor(Math.random() * 1000000)).padStart(6, "0"); document.getElementById("number").innerText = token; document.getElementById("number").style.color = "#" + token; let time = 180; setInterval(function () { if (time >= 0) { let min = Math.floor(time / 60); let sec = Stirng(time % 60).padStart(2, "0"); document.getElementById("timer").innerText = min + ":" + sec; time = time - 1; } else { document.getElementById("finish").disabled = true; } }, 1000); };

안녕하세요 강사님. getServerSideProps 강의를 보고 실습중에 캐시가 되지 않아 질문드립니다. 다음과 같이 코드를 작성하고, getServerSideProps 페이지에서 로드된 html 문서의 헤더를 보면 캐시 정보가 나오지 않고 캐시가 되지 않는데 이유를 알 수 있을까요..?import type { GetServerSideProps, NextPage } from 'next'; type Props = { data: number; }; const Example: NextPage<Props> = ({ data }) => { return ( <main> <h1>getServerSideProps Page!</h1> <p>값: {data}</p> </main> ); }; export default Example; export const getServerSideProps: GetServerSideProps = async ({ res }) => { res.setHeader( 'Cache-Control', 'public, s-maxage=5, stale-while-revalidate=10' ); const delayInSeconds = 2; const data = await new Promise((resolve) => setTimeout(() => resolve(Math.random()), delayInSeconds * 1000) ); return { props: { data }, }; };

강사님 안녕하세요!다름이 아니라 firebase 데이터 업데이트 하는 부분이 막혀 질문하려고 합니다.아래 사진은 Firebase 데이터 업데이트 함수와 발생하는 에러 사진입니다.해당 문제를 해결할 수 있게 도움 부탁드립니다 ㅠㅠ해당 오류 해결하기 위해 firebase 룰을 변경했는데도 해결되지 않았습니다.  

강사님 안녕하세요, 혹시 밑에 질문했는데 제가 잘못 말을 전달한것 같아서요비로그인일때는 피그마에서 작성자, 비밀번호를 입력하게 나타나는데로그인일때는 작성자, 비밀번호를 입력 못하게 나타나더라고여 근데 playground 가보면 파라미터를 받는곳을 보면 user 정보를 받는 파라미터가 없더라구요그래서 fetchBoard를 들어가서 user정보를 가져와도 null값이 나옵니다.그럼 피그마에 있는 저거는 로그인유저도 비로그인유저 화면으로 만들어야하나요?

4분 15초경부터 25초까지 잡음이 들려서 강의 소리가 잘 안들리네요참고하시면 좋을 것 같습니다.

안녕하세요! 강의 잘보고있습니다 :)next.js 13 버전으로 create-next-app 으로 설치하여 강의를 듣고있는데요,섹션1 > getStaticProps 강의내용대로 동일코드를 입력했지만props로 넘긴 값을 받아오질 못하더라구요.. console.log를 찍어봐도 안넘어와서 문의드립니다ㅠㅠ 아래와같이 입력했고 /app/section1/page.tsx로 만들었습니다.관련 깃헙소소는 : https://github.com/simjieun/next13 여기에 있습니다! 한번 확인부탁드리겠습니다ㅠㅠimport { NextPage } from "next"; interface Props { second: number; } const Example: NextPage<Props> = ({ second }) => { return ( <main> <h1>getStaticProps Page</h1> <p>{second}</p> </main> ); }; export default Example; export async function getStaticProps() { const delayInSecond = 2; const second = await new Promise((resolve) => { setTimeout(() => { resolve(Math.random()); }, delayInSecond * 1000); }); return { props: { second, }, }; }

강사님 안녕하세요, 혹시 로그인 유저가 자유게시판 작성하기 할때작성자, 비밀번호등... 필요하잖아요근데 비밀번호는 로그인 유저가 한 비밀번호를 가져와야 하는데 이걸 localStorage, session에해버리면 보안상 문제가 생기지않나요? 지금은 그냥 localStroage, session 이런곳에 유저 비밀번호를 저장해놓을까요?

로그인 된 상태가 아닐 때 (로그인하면 안뜸) alert창: {"response":{"errors":[{"message":"","locations":[{"line":2,"column":3}],"path":["restoreAccessToken"],"extensions":{"code":"INTERNAL_SERVER_ERROR","exception":{"stacktrace":["Error"," at RestoreAccessTokenService.createAccessToken (/codecamp_backend_api/dist/api/token/services/mutation/restoreAccessToken.service.js:45:19)"," at runMicrotasks (<anonymous>)"," at processTicksAndRejections (internal/process/task_queues.js:93:5)"," at async target (/codecamp_backend_api/node_modules/@nestjs/core/helpers/external-context-creator.js:76:28)"," at async /codecamp_backend_api/node_modules/@nestjs/core/helpers/external-proxy.js:9:24"]}}}],"data":null,"status":200,"headers":{"map":{"content-length":"654","content-type":"application/json; charset=utf-8"}}},"request":{"query":"mutation restoreAccessToken {\n restoreAccessToken {\n accessToken\n }\n}"}} 이런 문구가 뜨는데 다른 분 질문에서 프론트딴에서는 무시해도 된다고 하셨는데 화면딴에서 이게 안뜨게는 못하는걸까요?할 수 있다면 어떻게 해야하나요?  

강사님이 예시로 보여줄땐 보이는데왜 제가 하면 payload 탭이 안보일까요ㅠ

안녕하세요 선생님맨 처음 설치 과정에서 막히는 부분이 있어 질문 남깁니다!class 폴더를 만들고, apollo, emotion등 것들을 분명 설치를 했는데 package.json에는 확인되지 않는 이유가 뭘까요?

안녕하세요. 최근 강의를 수강을 시작하였는데요. nextjs가 13버전으로 바뀜에 따라 강의 에 맞게 소스 코드를 받아서 진행하려고 합니다. git checkout 으로 0-2 branch로 이동하고 여기서 부터 이어하려고 했으나,  error: Your local changes to the following files would be overwritten by checkout: pages/section1/clientSideRendering.tsx pages/section1/getServerSideProps.tsxPlease commit your changes or stash them before you switch branches.Aborting 변경점이 있는것 같아 해당 branch로 이동이 안되는것 같습니다!$ git stash && git pull origin master && git stash pop임시 저장소로 옮기고 pull을 하려고 했으나 git@github.com: Permission denied (publickey).fatal: Could not read from remote repository.Please make sure you have the correct access rightsand the repository exists. 키가 없어서 안되는것 같습니다! 혹시 이런경우에 어떻게 해결해야 할지 알 수 있을까요?     

강의 코드를 작성하다가 중간에 잘못 작성한 부분이 있었는지다음페이지를 눌렀을때 11 , 21, 31페이지로 넘어가지 않고계속 1 ~ 10페이지만 작동을 해서좀 이상하길래 재수정을 하고 재빌드를 했는데 코드의 이상이 없음에도 똑같이 작동하길래.next 폴더를 삭제하고 재빌드를 했더니정상작동 하는 것을 보았습니다..next 폴더가 캐싱 정보를 가지고 있어서 그랬던 건가요?만약에 .next 폴더를 건드리고 싶지 않다면 브라우저에서 캐시된 것들을 지우면 되는 건가요? 

안녕하세요. 멘토님. 강의를 듣다 보니 react 18이 아닌 17버전을 쓰는 이유가 궁금해져서 질문 드립니다.18 버전을 사용하게 된다면 다른 라이브러리와 호환이 안되는 이슈가 생겨서 17버전을 쓰는 것일까요?18버전을 쓸때 어떤 이슈가 생길 수 있는지 궁금해서 질문 드립니다..!

다음 수업 > 을 통해서 섹션8 | 데이터 통신 에 도달하였는데 아무 반응이 없네요.해당 페이지에서 다음 수업 > geolocation 은 정상동작하네요.

질문1:빨간색 부분에 width랑 background가 하얀글씨로 되어있는데적용이 된건가요? 그리고강의 중 이 부분에 예시가 없어서 레퍼런스 코드를 참고해버렸는데요질문2:transition:제일 앞에 선언할수 있는 속성이 무엇이 있는지질문3:transition-property:는 어떤식으로 사용하는지 궁금합니다  

박스사이즈를 구하라는 문제에서 저는 div의 크기를 생각하고24*3(폰트사이즈*3em) + 20(가로세로 padding 10+10)=92 생각했는데 93이라는 약간의 오차도 있고정답은 폰트사이즈인 72네요 ㅠ 1.제가 문제를 잘못이해했는지2.div크기 구하는데 오차가 발생하는 이유위 두가지가 궁금합니다.

안녕하세요.브라우저 재 접속 시 로그인 상태 유지를 하고 싶습니다.로그인 후 어플리케이션의 쿠키에 refreshToken이 담긴 것을 확인하였습니다.브라우저를 재접속하면 refreshToken이 사라져있는데 이것은 브라우저를 종료하면 쿠키가 휘발되는 성질로 인해 사라지는 것이 맞나요? 그렇다면 브라우저 재접속 시 로그인 상태 유지는 어떻게 구현할 수 있는지 궁금합니다.감사합니다.

강의중 clearfix div를 넣어주는데제가 그게 왜들어가는지 들어가서 무슨작용을 하는지원리가 무엇인지 아직 이해가 덜되서요.. 조금만 더 자세하게 설명해주실수 있나요?못난 제자라 죄송합니당 ㅜㅜ html:<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>02-02-clear</title> <link rel="stylesheet" href="./index.css"> </head> <body> <div class="box1 box"> 첫번째 박스입니다.<br> float:left가 적용되어 있습니다. </div> <div class="box2 box"> 두번째 박스입니다.<br> float:right가 적용되어 있습니다. </div> <div class="clearfix"></div> <div class="box3"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris risus sapien, facilisis vitae feugiat ut, semper at ligula. Vivamus cursus lectus tincidunt tellus tincidunt pharetra. Donec pharetra dictum malesuada. Fusce non sapien egestas, maximus urna vel, pulvinar magna. Aenean ut dapibus lacus, in blandit ligula. Vestibulum sit amet efficitur tortor. Phasellus id viverra felis. Mauris magna est, luctus sit amet neque et, sagittis ultrices elit. Morbi odio eros, finibus non justo eget, sollicitudin dapibus ante. Nunc maximus eu nunc et finibus. Vivamus viverra feugiat pretium. Sed at tempus enim, et dignissim ante. Mauris vel nisi leo. Nullam vel nibh suscipit, lobortis ex eu, mollis nunc. Fusce in eros blandit, vehicula libero et, euismod enim. </div> </body> </html>css:*{ box-sizing: border-box; margin: 0; padding: 0; } .container { background-color: #eeeeee; display: flex; flex-direction: row; justify-content: center; align-items: center; padding: 50px 0px; } .wrapper { width: 620px; padding: 40px 30px; background-color: white; border: 1px solid gray; border-radius: 10px; } .wrapper__head { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dashed gray; } .wrapper__head__title { font-size: 32px; background-color: orange; color: white; text-align: center; padding: 5px; margin-bottom: 10px; } .wrapper__head__sub-title{ font-size: 18px; padding: 10px 0; } #point { color: orange; font-size: 22px; font-weight: bold; text-decoration: underline; display: block; margin-top: 15px; } .wrapper__body { border: 1px solid #dddddd; padding: 20px 30px; } .diary-title { font-size: 18px; font-weight: 600; background-color: #f4f4f4; margin-bottom: 20px; } .kimchi { color: red; font-weight: 600; } .egg { color: orange; font-weight: 600; } .highlight { font-size: 22px; color: blue; font-weight: 700; font-style: italic; } .diary-date { color: #919191; font-size: 14px; text-align: right; } .header { height: 80px; display: flex; justify-content: center; align-items: center; border: 1px solid gray; } .header-inner { width: 900px; height: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .logo { width: 100px; } .logo h1 a{ text-decoration: none; color: orange; } .menu__ul { display: flex; flex-direction: row; } .menu__ul li { list-style: none; } .menu__ul li a{ display: block; /* a 태그는 inline태그여서 상하적용이 안되기 떄문에 block요소를 적용시킴*/ padding: 10px 20px; /*상하에 굳이 시각적 차이 없는 10px을 주는 이유는 마우스 커서클릭 영역이 글자만 되는것 보다 영역을 늘려서 여유를 주기위해서*/ text-decoration: none; color: black; } .menu__ul li a:hover{ color: orange; } .user { width: 100px; }