안녕하세요 섹션 1 듣고 혼자 해보다가 궁금한 게 생겨서 질문드립니다. 기존 사이트는 왜 "/login"으로 진입하면 "/i/flow/login"로 리다이렉트하게 했을까요? 단순하게 생각하면 그냥 "/login", "/signup"에 페이지를 두던가 아니면 "/i/flow/login", "/i/flow/signup"만 사용하도록 하면 리다이렉트 로직 필요없이 더 깔끔할 것 같은데 말이죠. 또 의아한 것은 기존 사이트에서 '/signup' url로 진입하면 '/i/flow/signup'으로 리다이렉트하는데 계정 만들기 버튼은 로그인과 다르게 href를 /i/flow/signup'으로 해두었네요. 실수인가.. 물론 제로초님은 기존 사이트를 최대한 그대로 구현하려고 하신 것 뿐이니까 당연히 정확한 의도를 알 수 없으시겠지만 현업자 입장에서 추측이 가는 부분이 있으신가 싶어 질문드립니다!
사진 상세보기에서 오른쪽 UI에 댓글 달기랑 게시글이 있는데 이 때 게시글 눌렀을 때 단순 도메인만 바뀌고 이동이 안되더라구요. 그래서 아래 코드처럼 PostArticle 컴포넌트 에서 router.refresh() 넣어서 처리했는데 이렇게 해도 될까요? const router = useRouter(); const handleOnClickCapture = () => { router.push(`/${post.User.id}/status/${post.postId}`); router.refresh(); // 추가 } return ( <article onClickCapture={handleOnClickCapture} className={style.post}> { children } </article> )
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
위에 코드로 docker-compose up을 해도 data 폴더가 생성되지 않아요. 다른 질문 참가해서 volumes: data:를 넣어봐도 생성되지 않습니다. 밑에 코드는 docker-compose up을 실행했을 때 뜨는 코드 입니다. PostgreSQL Database directory appears to contain a database; Skipping initialization 2024-03-15 02:14:21.650 UTC [1] LOG: starting PostgreSQL 16.2 (Debian 16.2-1.pgdg120+2) on x86_64-pc-linux-gnu, compiled by gcc (Debian 12.2.0-14) 12.2.0, 64-bit 2024-03-15 02:14:21.650 UTC [1] LOG: listening on IPv4 address "0.0.0.0", port 5432 2024-03-15 02:14:21.650 UTC [1] LOG: listening on IPv6 address "::", port 5432 2024-03-15 02:14:21.665 UTC [1] LOG: listening on Unix socket "/var/run/postgresql/.s.PGSQL.5432" 2024-03-15 02:14:21.683 UTC [30] LOG: database system was shut down at 2024-03-15 02:13:06 UTC 2024-03-15 02:14:21.697 UTC [1] LOG: database system is ready to accept connections 어떻게 해야할까요?
안녕하세요. 강의보고 따라하니 https 적용이 잘 됐습니다. 저는 https를 적용하기 전에 3050번 포트에 프론트, 3060번 포트에 백, 3000번 포트에 관리자 페이지를 각각 배포해놓았습니다. ec2의 한 인스턴스에 이 3개를 배포하는 방법은 있을까요? 예를 들어 도메인이 domain.com 일때, 프론트는 domain.com 에 배포하고 관리자는 domain.com:3000 에 배포하고 백은 domain.com:3060 에 배포하는 방법이 있을까요?
안녕하세요 제로초님 강의 잘보았습니다! 본론부터 말씀드리자면 2가지 고민이 있습니다. 하나는 msw component가 필요한지 궁금합니다. 왜냐하면 현재 express로 하고 있어서 msw component가 없어도 mock 서버(express)를 키면 작동하는데 msw component가 관여하지 않은것 같아서요~ 두번째는 localhost 9090 외에 실제로 사용하는 api를 모킹하고 싶은데 어떻게 해야할지 고민이 됩니다. 예를 들어주소가 naver.com 이라면 이 백엔드 api를 넣는 방법을 모르겠습니다.~! 감사합니다!
이미지 상세 보기 눌렀을때 모달창이 켜지고, 닫기 버튼 누르면 router.back() 으로 처리하셨는데 이 때 문제점이 게시글 위치가 다시 맨 위로 올라가게 되더라구요. 만일 닫기 버튼 눌러도 제가 스크롤 해서 봤던 게시글 위치 그대로 보여질려면 어떻게 처리하면 좋은가요?
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
docker-compose up을 사용하면 initdb: error: directory "/var/lib/postgresql/data" exists but is not empty initdb: hint: If you want to create a new database system, either remove or empty the directory "/var/lib/postgresql/data" or run initdb with an argument other than "/var/lib/postgresql/data". 라는 오류가 자꾸 발생합니다. 삭제하고 다시 해도 해결이 안되서 질문남깁니다. 어떻게 해결해야하나요.
ex) src/components/commons/apollo/index.tsx // ... const uploadLink = createUploadLink({ uri: "...", headers: { Authorization: `Bearer ${accessToken}` }, }); const client = new ApolloClient({ link: ApolloLink.from([uploadLink]), cache: GLOBAL_STATE, }); // ... 이전 강의에서 createUploadLink 함수를 이미지같은 파일을 업로드 설정을 위해 불러왔었는데 이 안에 accessToken을 넣어주는 게 이해가 가지 않았습니다. 지금 제 머릿속에는 자동으로 headers에 accessToken을 담아서 인가를 해주는 설정을 왜 이미지업로드를 위한 설정함수에 accessToken을 넣어주는 거지?라는 생각이 들어서 혼란스럽습니다.. 이 부분에 대해서 제가 잘못 이해하고 있거나 이렇게 해주는 이유에 대해서 알려주신다면 감사드리겠습니다!
[리뉴얼] 파이썬입문과 크롤링기초 부트캠프 [파이썬, 웹, 데이터 이해 기본까지] (업데이트)
- 본 강의 영상 학습 관련 문의에 대해 답변을 드립니다. (어떤 챕터 몇분 몇초를 꼭 기재부탁드립니다) - 이외의 문의등은 평생강의이므로 양해를 부탁드립니다 - 현업과 병행하는 관계로 주말/휴가 제외 최대한 3일내로 답변을 드리려 노력하고 있습니다 - 잠깐! 인프런 서비스 운영(다운로드 방법포함) 관련 문의는 1:1 문의하기를 이용해주세요. 포스트맨 구성이 달라져서 블로그 보고 따라해봐서 성공했습니다 업데이트 되어 달라진 것 같아서, 다른 분들도 참고하실 수 있게 강의 내용도 업데이트 되거나 게시판에 업로드 해주시면 좋을 거 같습니다-
제로초님 안녕하세요. 강의 잘 보고 있습니다. 강의를 보는 도중 궁금한점이 생겨 질문을 남깁니다 (강의 후반부에 설명해 주셨을지도 있지만...) 저는 React, Next13 버전으로만 개발을 해보았고, Next14를 배우기 위해 강의를 듣고 있는데 Next13에서는 기본이 클라이언트 컴포넌트이고 필요한 경우에만 'use server' 를 사용해 ssr을 구현했던 것으로 기억합니다. 그런데 Next 14에서는 기본이 서버 컴포넌트이고 필요한 경우에만 'use client'를 사용하시는 것 같습니다. 어떤 경우에 use client를 적용해야하는지 기준을 잘 모르겠어서 제로초님은 어떤경우에 use client를 사용하시는지 궁금합니다. 제가 생각하기에는 상태관리가 필요하거나 hook을 사용해야하는 컴포넌트의 경우 'use client'를 적용해서 사용하는 것 같은데 그런 특별한 경우를 제외하고는 모두 서버 컴포넌트를 쓰는게 맞나요??
조은님 안녕하세요 🙂 강의 잘 보았습니다! 강의를 보다가 문득 궁금한 점이 있는데요! import 문 통해서 절대경로로 파일을 불러올 때, 전역에 있는 tsconfig.json 내에서 파일별로 일일이 수동 설정을 해주어야하는 걸로 아는데 조은님께서는 자동으로 @가 붙여진 형태로 불러와지는 거 같아서요! 혹시 따로 설정 어떻게 하셨는지 여쭤봐도 괜찮을까요?
z-com\src\app\(beforeLogin)\_component\SignupModal.tsx 파일에서 useFormState(OnSubmit, {message: null }); 해당 부분에서 Type error: No overload matches this call. Overload 1 of 2, '(action: (state: { message: string; } | undefined) => { message: string; } | Promise<{ message: string; } | undefined> | undefined, initialState: { message: string; } | undefined, permalink?: string | undefined): [state: ...]', gave the following error. Argument of type '(prevState: any, formData: FormData) => Promise<{ message: string; } | undefined>' is not assignable to parameter of type '(state: { message: string; } | undefined) => { message: string; } | Promise<{ message: string; } | undefined> | undefined'. Target signature provides too few arguments. Expected 2 or more, but got 1. Overload 2 of 2, '(action: (state: { message: string; } | undefined, payload: FormData) => { message: string; } | Promise<{ message: string; } | undefined> | undefined, initialState: { message: string; } | undefined, permalink?: string | undefined): [state: ...]', gave the following error. Type 'null' is not assignable to type 'string'.ts(2769) 에러가 발생합니다. 제로초님 github 파일 3-2에 있는 부분을 복붙해서 하고 있는데 에러가 발생했습니다. 타이핑 에러는 아닌 것 같습니다. 찾아보니 함수에 들어오는 매개변수의 타입이 예상한 타입과 일치하지 않을 때 발생한다고 하여서 message의 type을 any로 바꿔보아도 에러가 납니다 .. React 버전은 18버전이고 nextjs 는 14.0.4 버전입니다. 어떤 부분을 수정해야 할지 모르겠습니다...
안녕하세요. 현재 찜하기 기능을 추가하는 작업을 진행중입니다. 전체적으로 설명드리면 찜하기 Hook을 만들고 ProductDetail 컴포넌트에 Hook의 리턴 값을 보내어 작업하였습니다. 찜하기 API의 결과 값으로 off시 0, on 시 1을 출력하여 그 값을 state에 저장하여 상품디테일 컴포넌트로 리턴하여 작업하는 중입니다. 그런데 state의 초기값을 토글의 결과값을 가져와서 넣어주어야 하는데 어떻게 해야할지 잘 모르겠습니다. 제가 생각해본 방법으론 상품 컴포넌트에서 state를 새로 만들어 가져온 pick의 변수를 set에 담았더니 랜더링이 많아진다면서 오류가 떴습니다. 혹시 제가 작업하는 방향이 틀린 것인지 궁금하고, 어떻게 문제를 해결해야할지 잘 몰라 질문 드립니다!
안녕하세요 제로초님. 이제 막 Next 강의 시작해서 기초부터 보고 있는데 이해가 되지 않는 부분이 있어 질문드립니다. next/link에 관한 부분인데요. 공식문서보니까 next/link 사용시에 클라이언트 사이드 라우팅이 된다고 하는데 그 말인 즉슨 link에 해당하는 페이지 컴포넌트의 자바스크립트를 미리 받아놓고 사용자가 Link로 이동할 때 클라이언트에서 페이지를 생성한다는 뜻으로 이해했는데요. 그럼 이동하는 페이지 컴포넌트에 console.log("하이")가 있으면 클라이언트, 즉 브라우저에 console.log가 출력되어야하는 거 아닌가요? 하지만 제 예상과 다르게 Link로 이동한 페이지 컴포넌트의 console.log는 서버에 출력되네요. 1. "use client"를 명시하지 않은 컴포넌트는 모두 서버에서 렌더링 되는 컴포넌트다 2. Link로 이동하면 클라이언트 사이드 렌더링을 한다. 이 두 가지 개념이 어떻게 공존할 수 있는지, 위에 설명드린 케이스와 함께 잘 이해가 되지 않네요ㅜ
