안녕하세요. 강의를 마치고 혼자 구현을 해보고 있는데, 로그인과 인증 관련해서 궁금한 부분이 있습니다. 프론트에 로그인한 유저인지의 판단을 미들웨어에서 auth함수로 next 서버를 통해 하고있는데,로그인 후에 접속 가능한 페이지를 이동할때마다 무조건 서버에 체크를 해주어야 하나요? 데이터 페칭은 리액트 쿼리를 설명하며 말씀해주신것 처럼 컨텐츠에 따라 판단해서 캐싱하고 새로 받아오고의 개념이 이해가 되었는데, 세션체크라고 해야 할까요? 로그인 후에 이 유저가 로그인이 되어있는지에 대한 체크를 서버에 얼마나 자주 해주어야 하는지 모르겠습니다. 현재는 미들웨어에서 로그인이 필요한 페이지에 auth함수를 호출하여 프론트 서버에서 체크를 하고, api를 호출할때는 쿠키에 next-auth의 세션 토큰과 서버에서 발급한 세션 아이디를 담아서 서버에서 로그인과 인증 확인을 하고있는것으로 이해를 했습니다. 현재는 혼자서 nestjs를 통해 jwt 토큰 2개 (access,refresh)을 발급해서 구현을 해보고있는데, 로그인이 필요한 페이지로 이동한다면 무조건 미들웨어에서 토큰 확인을 서버를 통해 해주어야 하는건가 잘 모르겠어서 질문 드립니다.. 강의 정말 잘 듣고 도움이 많이 됐습니다. 감사합니다.
안녕하세요! 수업 잘 듣고 있습니다. 수업 듣던 중 http://localhost:3000/book/34 와 같이 존재하지 않는 책의 상세 정보에 대한 요청에 대한 페이지까지 구현해보고 싶어 혼자 작성하다 문제가 생겨 질문 드립니다. http://localhost:12345/book/333 에서 자동적으로 오류 api 를 주는 것을 보고 해당 객체를 활용하려고 하였으나, id가 13 이상일 때부터는 [id].tsx 파일의 context.parms.id 가 undefiend로 반환되는 문제가 있습니다. 서버측의 문제인지, 제가 설정을 잘못한 건지 잘 모르겠어 질문 드립니다!
vs code에서 깃 커맨드를 쓰거나 소스 컨트롤 기능에서 내역을 확인할 수 있는데 깃 GUI프로그램으로 소스트리를 따로 쓰시는 이유가 뭔가요? 그리고 깃헙 데스크탑 GUI프로그램이 있는데 깃헙 연동으로는 이게 더 편리할 거 같은데 소스트리가 더 우수한 이유가 있을까요?
선생님 데이터 캐시부분 보고 있는데요 page router의 SSG, ISR처럼은 app router에서 동작이 일어나지 않는걸까요? 아니면 동일한건지 궁금합니다. SSG의 경우는 페이지를 build타임에 페이지를 만드는데 app router는 fetching 한 데이터만 캐시하는것 같아 질문 드립니다.
안녕하세요. 예전부터 궁금했던게 있습니다. 이번 사전렌더링 강의에서 계속 설명하는 유저-브라우저-서버 개념 에서 서버란 무엇인가요? 단순히 csr은 서버에서 빈껍데기를 먼저주고, 초기접속속도가 느리고, ssr은 빈껍데기가아니라 이미 렌더링된 html을 서버에서 받아서 그대로 렌더링하고... 이런 개념들은 CSR과 SSR 차이만 검색해도 수많은 블로그와 개념이 나오고, 항상 많이 들어왔고 면접준비했을때도 수없이 외워서 알겠습니다만 여기서 항상 의문이 있었는데요. 여기서 말하는 서버란 대체 무엇인가요? 제가 알고있던 서버라는것은 백엔드서버였는데, 이 서버라는 개념이 어려웠습니다.
안녕하세요 강의 너무 잘 보고 있습니다. 너무 이해하기 쉽게 알려주셔서 열심히 듣고 있는데 state부분에 대해 궁금해서 질문을 드립니다. state는 그럼 글자가 변한다거나 어떤한 것이 변경되는것처럼 이런 상태들이 변하게 할때 state를 사용한다라고 이해하고 이럴때 state를 사용하면 되는건가요?
안녕하세요 css를 공부중인데 선택자에 대해 질문이 있습니다 * {color: white}, body {color: white} 이렇게 전체선택자와 body선택자 둘다 글자 색상을 흰색으로 했는데 전체선택자도 모든 태그의 글자색이 흰색이 되고 body도 모든 글자색이 흰색이 되는데 이 두개의 차이점이 헷갈립니다.
다른 분들의 질문에 대한 답변에서 "사전 렌더링 방식에서 서버가 주는 것은 전체 HTML이 아닌 그 페이지의 HTML이다"와 같은 표현이 많이 보여서 질문 드립니다. 페이지 이동 시 시뮬레이션을 설명하면서 사용하신 컴포넌트 교체 , 컨텐츠 렌더링 과 같은 표현들을 미루어 보았을 때, 아래와 같은 작업이 이루어질 것이라고 생각했는데요, 접속 요청 -> 웹 서버가 HTML을 반환 페이지 이동 -> 해당 HTML의 돔 트리 수정 수화 과정 역시 HTML을 리액트가 핸들링할 수 있도록 하는 작업(리액트 문서 참고)이기 때문에 초기 렌더링 시에만 일어난다고 이해했습니다. 페이지 이동 시마다 HTML을 새로 생성하는 것인지, 또 수화의 정확한 의미는 무엇인지 공부할수록 헷갈리게 되어 질문 남기게 되었습니다. 제가 잘 이해한 것이 맞을까요?
안녕하세요, 강의 너무 잘 보고 있습니다 !!(책도 혼공 시리즈 너무 잘 보고 있어요 !!) 질문이 생겨 여쭤보려 합니다 !! 저는 맥os에서 터미널로 푸시를 하려고 합니다. 로컬에서 깃허브로 푸쉬를 하려고 시도하였는데 다음 오류가 떴습니다. ( git remote add origin https://github.com/nippyclouding/test.git git branch -M main git push -u origin main 저도 다른 질문자분들처럼 터미널에 두 줄이 아니라 세 줄을 복사 붙여넣기 하였습니다) 그랬더니 출력으로 아래처럼 되었습니다. remote: Support for password authentication was removed on August 13, 2021. remote: Please see https://docs.github.com/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication. fatal: Authentication failed for ' https://github.com/nippyclouding/test.git/ ' 해당 문제를 찾아보니 비밀번호 인증을 중단하였다고 하는데, 이렇게 되면 터미널에서 깃허브에 푸시하는 방법이 있을까요 ..?
안녕하세요 "부트캠프에서 만든 완벽한 프론트엔드 코스" 강의를 구매해서 열심히 듣고 있습니다. 강의소개에서 웹 프론트엔드 부트캠프 부분에 CRUD에 충실한 여행자 게시판 '트립토크'와 숙박상품을 구매할 수 있는 여행플렛폼이라고 나오는데 그렇다면 이 강의에 이 여행 플랫폼을 만드는 내용도 있나요?
"[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스강의" 를 수강하고 배포 부분을 이 강의를 수강하고 있는 수강생입니다. 고농축 강의에서 만든 포트폴리오를 aws에서 배포했을때에, CORS 에러가 다음과 같이 나는 문제가 있는데 어떻게 해결해야할까요? 찾아보니 백엔드에서 CORS 를 허용해야하거나 프론트에서 프록시를 사용하라고 되어있는데 어떻게 해결해야할지 모르겠네요
안녕하세요! 강의 도중 궁금한게 생겨 여쭤보기 위해 질문 드립니다! 다름이아니라, 서버 액션과 api route의 차이가 속도 말고 어떤 때에 서버 액션을 써야하고, api route를 사용해야하는지 여쭤보고싶습니다! 찾아본 바로는 서버 액션은 POST, PATCH 등 폼 제출 시에 사용하는 것이라는데, 폼 제출 시에는 무조건 서버액션을 사용하는 것이 맞는지, 아니라면 단지 개발자 판단 하에 사용하면 되는 것인지 여쭤보고싶습니다!
로그인하여 /home에 접속해 있는 도중, 세션이 만료된 상태에서 사용자 정보가 필요한 /message 또는 /explore 등으로 클라이언트 네비게이션을 통해 페이지를 이동하는 경우, 미들웨어의 세션 검사를 거쳐 로그인 페이지로 이동되지 않고 not-found 페이지가 뜨는 오류가 있습니다. / / middleware.ts import { NextResponse } from "next/server"; import { auth } from "./auth"; export { auth } from "./auth"; export async function middleware() { const session = await auth(); if (!session) { return NextResponse.redirect(`http://localhost:3000/i/flow/login`); } } export const config = { matcher: ["/compose/tweeet", "/home", "/explore", "/messages", "/search"], }; 로그인 이 후 쿠키를 삭제를 통해 세션을 없애고 클라이언트 네비게이션을 통해 페이지 이동을 하면 미들웨어의 세션 검사에 걸려 redirect가 진행됩니다. /i/flow/login 페이지로 url이 변경되긴 했지만 병렬 라우트 및 인터셉팅 라우트로 인한 간섭이 있어 제대로 된 page를 찾지 못하는 것으로 보이는데 정확한 원인을 알 수 없어 문의 드립니다.
