auth LoginView/LogoutView에 success_url_allowed_hosts 설정 추가하여, 로그인/로그아웃 후에 지정 호스트로의 이동 허용 현재 로그인/로그아웃후 지정 호스트로 이동을 허용하는 부분을 실습하고 있는데 막히는부분이 있어서 질문 드립니다. 이부분 코드를 붙여넣고 실행하였더니 로그아웃 부분에서 아래와 같은 에러가 발생하였습니다. (프로필 페이지로 이동은 잘 됩니다.) 찾아보니 GET 메서드가 거절된 것같은데, 이전 강의에서 장고에서 과거에는 GET으로 받았으나, 이제는 POST 요청만 허용한다는 내용을 들은적이 있었던것같은데, 그것과 관련된 것인지 궁금합니다. 다른 분들은 잘되셔서 넘어가셨을텐데, 저가 잘못된것 같긴한데 혹시나해서 여쭈어봅니다. 아래는 로그아웃 구현된 부분입니다.
질문을 온전히 이해할 수 있도록, 모든 맥락을 전달해주세요. 질문은 질문자가 번거로워야 보다 좋은 답변을 얻으실 수 있습니다. 시행착오를 알려주시면 곧바로 원하는 문제에 집중할 수 있습니다. 오류 메시지는 일부만 알려주시기보다 전체 오류 메시지를 캡처해서 주시면, 오류 파악에 도움이 됩니다. 당신의 파이썬/장고 페이스메이커가 되겠습니다. ;-) 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 11-15 강의에서 구현한 프로필 수정 폼에서 이미지를 올린 경우, 다시 프로필 수정 페이지에 들어가면 정상적으로 이전에 등록된 이미지가 현재 란에 보여집니다. 이렇게 구현된 모델은 문제가 몇 가지 있는데요. 수정하지 않고 저장 을 누를 경우 이전 강의에서 교육하신 내용처럼 접미사가 계속 바뀌어가면서 같은 내용의 파일이 spamming 되는 문제가 발생합니다. 우리가 만약 프로필에 다른 항목이 추가된다면, 다른 항목만 수정하지 않고 나가는 유저가 있을텐데 해당 문제를 해결하려면 어떻게 해야할까요? 수정 혹은 취소 체크 박스를 선택하여 삭제를 할 경우 여전히 경로 안에 파일이 남아 있습니다. signal을 이용하면 될 것 같은데, 하기와 같은 방법을 생각해 볼 수 있을까요? @receiver(pre_save, sender=Profile) def edit_delete_on_profile(instance=Profile, **kwargs): instance.avatar.delete(save=False) 수업 내용과는 상관없지만, 기본 제공되는 이미지 업로드 양식이 어색합니다. 특히 취소 체크 박스를 체크하여 제거하는 방식은 너무 어색한데요. 더 좋은게 없을까요? 예를들어 아래는 네이버 '치지직' 에서 프로필 수정 양식입니다.
포트폴리오 과제중 BoardDetail 작성글 페이지에서 패치보드가 안불러와져서 계속 코드 고쳐보다가 결국 강사님이 올려주시는 포트폴리오리뷰 파일 불러와서 코드보고 똑같이 따라쳐도 제 파일에서만 패치보드가 안불러와져서 오류가 계속나네요.. 혹시 좀 봐주실수 있을까요?(_app.js에서 아폴로 주소 확인도 했습니다) 아래는 패치보드 로드 실패로 나오는 창입니다
이 부분 진행할 때 "default alias를 쓸 거냐? No" 라고 말씀해 주셨는데 반대로 말씀해 주신 거 같아요! default alias를 쓴다는 선택이니까요. default import alias 대신 custmize으로 쓰겠냐는 질문에 No라고 선택한 걸로 보입니다!
따라하며 배우는 리액트 A-Z 강의 중 리액트를 위한 도커 파일 작성하기 강의 중 궁금한 것이 있어 질문 드립니다 COPY 부분에 package.json 파일을 복사를 하는데 package-lock.json 파일은 왜 복사를 하지 않나요? package-lock.json 파일이 더 버전 명시가 확실히 되어있어 안전하지 않나요?
원래는 강의에서처럼 터미널에서 (venv)가 있어야 할 자리에 mydjango가 있었습니다 그런데 제가 로컬에서 다른 가상환경을 만들고 진행하니 이제 모든 파이참 환경에서 가상환경 설정할 때마다(venv)라고 활성화 되서 나오네요 얼마전엔 가상환경이름을 venv라고 설정해도 각각에 프로젝트에 맞는 이름들이 (django) 이런식으로 등장했는데 어떻게 원래대로 되돌릴 수 있는지 모르겠습니다. 프로그램 실행에 지장이 있는건 아니지만 알려주시면 감사하겠습니다.
안녕하세요 제로초님 강의를 듣다 의문점이 하나 생겨 질문드립니다. 패레럴 라우트와 인터셉터 라우트를 사용해서 모달을 띄우는 방법을 알려주셨는데 기존의 react에서 사용하던 방식으로 모달의 띄우는게 더 코드도 단순하고 간단하게 구현할 수 있을것 같은데 nextjs에서는 페레럴 라우트와 인터셉터 라우트를 사용해서 모달을 구현하는게 어떤 이점이 있는지 궁금합니다. 기존의 모달을 띄우는 방법은 여러가지가 있지만 state를 통해서 구현하거나 queryString을 사용해서 구현할 수 있을것 같습니다. queryString을 사용하면 뒤로가기 버튼클릭시 모달을 띄우기전 url로도 이동할 수 있고 새로고침을 해도 모달과 뒤의 배경을 같이 보여줄 수 있을 것 같습니다. 혼자서 생각도 해보고 인터넷에서 자료도 찾아봤지만 정확한 이유를 잘 모르겠어서 질문드립니다. 오늘도 좋은 하루 되셨으면 좋겠습니다. 감사합니다.
인터셉팅 라우트의 본 목적은 아닌 것 같으나 제 생각으론 가능하지 않을까 하는 생각이 드는데 진짜 가능한 건지 궁금해서 여쭤봅니다,,ㅠㅠ 인터셉팅 시에 모달이 뜨면서 children이 변경되도록 하고 싶은데,,, 가능한 건가요,,? 그러면 폴더 경로를 어떻게 설정 해야 할까요,,?
안녕하세요 선생님. "Suspense로 Streaming하여 최적화하기(feat. loading.tsx, error.tsx)" 강의 내용중에 궁금한점이 있어 질문드립니다. 강의에서 5:42 ~ 6:35 시간 구간에서의 내용에 관해서 이해가 잘 안되는 부분이 있는데요. 홈 화면에 처음 들어올 때에는 로딩스피너가 안보이고 탐색하기 등 다른 페이지에서 홈 화면으로 들어오면 로딩스피너가 보이는 이유를 설명해주시는 부분입니다. 홈 화면에 처음 들어왔을 때에는 홈 화면에 해당하는 page.tsx를 서버에서 다 그려주기 때문에 로딩 상태가 없어서 로딩스피너가 안보이고, explore에 있다가 클라이언트에서 홈으로 넘어갈 때에는 explore에서 홈 페이지를 새로 로딩을 하기 때문에 로딩 스피너가 뜨는거라고 설명해주셨는데요. "explore에서 홈 페이지를 새로 로딩을 한다" 라는게 무슨 말인지 잘 모르겠습니다 ㅠ page.tsx가 CSR이 된다는 것인가요? 저는 어떤 페이지에 들어오면 그 페이지에 해당하는 page.tsx가 실행되는걸로 알고 있었는데 아닌가요? 홈의 page.tsx는 서버 컴포넌트인데 왜 홈에 처음 들어왔을 때만 page.tsx가 서버에서 실행되고 그 이후에는 마치 클라이언트에서 데이터 패칭하고 그에 따라 렌더링이 되는것처럼 "로딩"이라는 상태가 존재하는것인지가 궁금합니다.
Refresh Token마저 만료되었을때 Todo 또는 Product 메뉴를 누르면 자동으로 로그아웃 및 메인페이지로 이동하려고 합니다. 강의 내용대로 쿠키 member를 삭제하여 로그아웃 처리는 하였으나 '/' Path로 이동은 안되어서 방법을 찾지 못하여 질문드립니다. 추가로 토큰만료시 jwtUtil의 beforeRes에서 쿠키를 삭제하였으나 todo 페이지가 호출 및 페이지 이동이 안되어서 todo 페이지 나오기전에 페이지 이동을 하고싶습니다. ListComponent의 useEffect에 hook을 사용했으나 실제로 이동안 되고 jwtUtil, todoAPI 는 모두 규칙 위반으로 hook이나 navigate를 사용할수 없더라구요. 어떻게 해야할까요..
import React, { useState, MouseEvent } from "react"; import * as S from "./mypoint.index.styles"; import TapPointLoading from "./mypoint_loading"; import TapPointBuying from "./mypoint_buying"; import TapPointAll from "./mypoint_all"; import TapPointSelling from "./mypoint_selling"; export default function MyPoint(): JSX.Element { const [selectedValue, setSelectedValue] = useState<{ name: string; index: number; }>({ name: "전체내역", index: 0, }); const MyPageHeadInfoButton = [ { name: "전체내역", component: <TapPointAll /> }, { name: "충전내역", component: <TapPointLoading /> }, { name: "구매내역", component: <TapPointBuying /> }, { name: "판매내역", component: <TapPointSelling /> }, ]; const onClickTap = ( event: MouseEvent<HTMLDivElement>, index: number ): void => { const newValue = event.currentTarget.id; setSelectedValue({ name: newValue, index, }); }; // 버튼 클릭으로 해당 data 값을 보여주기 위함 const renderData = (): JSX.Element | undefined => { return ( <S.TableWrap> {/* 해당 탭의 배열의 객체 name통해 컴포넌트 가져옴 */} {MyPageHeadInfoButton.map((el) => { if (el.name === selectedValue.name && el.component) { return <div key={el.name}>{el.component}</div>; } return null; })} </S.TableWrap> ); }; return ( <S.Wrap> <S.MyPageHeadWrap> <S.MyPageHeadBtn> {/* 서브 탭 버튼 */} {MyPageHeadInfoButton.map((el, index) => ( <S.MyPageInfoBtn key={el.name} id={el.name} onClick={(event) => onClickTap(event, index)} selected={selectedValue.name === el.name} > {el.name} </S.MyPageInfoBtn> ))} </S.MyPageHeadBtn> </S.MyPageHeadWrap> <S.MyPageBodyWrap> {/* 해당 탭 data */} <div>{renderData()}</div> </S.MyPageBodyWrap> </S.Wrap> ); } 이렇게 탭을 클릭을 해서 해당 컴포넌트가 보이도록 했습니다. 그러면서 각각의 API data도 받아와 cache에 저장을 하도록 해 추가 API 요청이 일어나지 않도록 했는데 여기서 로그아웃을 하고 다른 아이디로 로그인을 하면 이전의 로그인 했던 data가 그대로 남아있어 최신 data를 가져오기 위해 여러가지 방법으로 시도했습니다. 로그아웃 시 useApolloClient를 활용해 cache를 삭제 했습니다. 이렇게 하면 다시 로그인 한 유저의 data를 잘 가져오는데 로그아웃을 하면서 cache data가 삭제되니 다른 API, Board, Markets 등 해당 page의 사용한 query문의 data를 다시 요청하는 문제가 있습니다. refetch()로 query문을 선언하면 해당 refetch()를 실행하지 않아도 API 요청이 일어나 refetchQueries를 사용해 data 최신화 하려는데 그렇게 되면 모든 탭을 refetch 해줘야 되는 문제가 있습니다. 각 탭 이동마다 API 요청 나가는게 싫어서 fetchporicy나 refetch()를 사용 하지 않았는데 보통 어떻게 사용을 하나요? 로그인에 의한 data는 탭 이동마다 refetch를 시켜주는게 좋을까요? 그리고 구매, 충전 등 하면 바로 MyPoint에 업데이트 되도록 client.writeQuery / readQeury 나 refetchQueries를 사용했는데 이런 결제 정보 같은거는 refetch로 실시간으로 data를 가져오는게 좋겠죠? 로그인, 로그아웃은 LayoutHeader에서 사용하고 있습니다.
