이 영상에서 보고 이해한대로 만들다가 잘 안되는 부분이 있어서, 제가 이해한게 맞는지 질문드립니다. 영상에서 provider랑 tap.tsx랑 어느 위치에 있든지 그건 상관없이 provider에서 쓰는 변수와 tap.tsx에서 쓰는 변수만 맞추고 page.tsx에서 필요한 부분에 <설정한 프로바이더> 태그만 위아래로 감싸면 되는것이 맞나요?
안녕하세요 강의 도움 많이 받고 타입스크립트 + 리액트 조합으로 서비스 만들고 있습니다. 강의에 테스트코드 관련 내용은 없어 무관한 질문 죄송합니다 ㅠ jest로 테스트 코드를 작성하려고 하는데 설정에 무슨 오류가 있는지 도무지 테스트가 되지 않습니다.. 여러 블로그 글이랑 챗 gpt참고해서 수정해도 안되는데 혹시 타입스크립트에서 jest 쓰려면 다른 설정을 해줘야 하는건가요? 도움 주시면 감사드리겠습니다 ..
next.js에서의 fetch는 fetch api와 다른 것과, cache: 'no-store'를 사용하면 getServerSideProps를 사용한 것과 동일한 것도 이해를 했습니다. 근데 만약 fetch를 사용하지 않고 axios를 사용한다면 어떤 차이점이 있는지 궁금합니다. 질문 : axios를 사용하면 next.js에서 어떻게 SSR 처리가 되는 걸까요? (next.js fetch를 쓰지 않는데 어떻게 SSR이 처리가 되는지)
안녕하세요 제로초님! 강의 들으면서 개인 프로젝트에 적용 중입니다! 현재 로그인 기능 구현을 시도하고 있고, 백엔드 API는 개인적으로 이미 구현이 되어있는 상황입니다. 로그인 구현 방식은 강의 내용과 동일하게 진행하고 있는데요, 아이디 또는 비밀번호가 틀렸을 때 authResponse.ok 가 false로 반환되어 아래처럼 에러를 던져주고 있는데, 이 에러의 에러메시지가 터미널에서는 확인이 됩니다. 근데 저 에러 메시지를 로그인을 요청하는(onSubmit 함수가 있는) 클라이언트 컴포넌트에서 확인을 하고 싶은데 next-auth signIn 요청시에 error로 잡히지 않고 res(정상응답)으로만 반환이 되고 있습니다. 그리고 그 res를 콘솔에 찍어보면 {error: 'CallbackRouteError', status: 200, ok: true, url: null} 로만 반환이 됩니다. 로그인이 정상적으로 이루어졌을 때는 {error: null, status: 200, ok: true, url: 'http://localhost:3000/logi n'} 이렇게 반환이 됩니다. next-auth에서 Import해온 signIn 함수의 response 와 서버에서 받아온 errorMessage를 어디서 핸들링해야하는 건지 궁금하여 질문 드립니다.. 터미널에서 찍히는 errorMessage를 동일하게 signIn 함수의 error로 잡고 싶은데 가능한가요?
안녕하세요. 선생님 수업을 통해 크롤링까지는 성공했습니다. HTTP POST 요청으로 받아왔는데요. 다만 Response가 넥사크로에서 사용하는 "SSV"형식으로 왔습니다. SSV:UTF-8ErrorCode:string=0ErrorMsg:string=Dataset:ds_PageList_RowType_TAXNO:string(255)TAXIDX:string(255)MEMBNAM:string(255)TSDATE:string(255)TSTIME:string(255)ACQBID:string(255)CARD_NAME:string(255)HID:string(255)ACQHID:string(255)TERMID:string(255)MTRCNO:string(255)CDNO:string(255)AUTHNO:string(255)ISTMMON:string(255)CURRCODE:string(255)AMT1:bigdecimal(25)AMT2:bigdecimal(25)AMT3:bigdecimal(25)ACQDATE:string(255)DDCEDI:string(255)...... <생략> 이렇게 못생긴 데이터가 왔는데요. 이걸 json으로 파싱하고싶어서요. 이리저리 혼자서 아스키코드 찾아보고 US, RS 사용해서 어떻게든 파싱은 했는데, 제가 짠 로직이 맞나 싶어서요. (일단 작동은 되는데.. ) 혹시 선생님이라면 어떻게 하실까 싶어서요. 이런걸 잘 파싱하려면 알고리즘을 공부해야되는걸까요? 아! 그리고 깃헙에 혹시 라이브러리가 있나 찾아봤는데요. 안나오더라구요. 이게 제일 슬펐어요. 그나저나 저런거 만드는 사람들은 정말 괴물같네요.. 저런걸 도대체 어떻게 만드는 걸까요? (코드가 본문에 저렇게 붙여넣어지는 기능도 신기하네요.. 저런건 또 어떻게 만드나요?)
안녕하세요 강사님 강의 잘 듣고 있습니다! 항상 좋은 강의와 친절한 답변 감사드립니다. 스타일 컴포넌트 적용 중에 궁금증이 생겼는데 검색을 통해서는 명쾌한 답변이 나오지 않아서 질문드립니다. 아래 첨부 드린 코드와 같이 스타일 컴포넌트를 적용하려면 use client로 하고 page.tsx 에서 import 해서 사용해야 하는데 혹시 이렇게 했을때 강사님이 사용하신 CSS Modules에 비해 안 좋은점이 있을까요? use client를 import해서 사용하다 보니 css modules에 비해 속도가 느리다던가 서버 컴포넌트에 클라이언트 컴포넌트로 작성된 스타일을 적용시킴으로서 악영향이 있을까 걱정되어서 질문 드립니다. 'use client' import styled from "styled-components" export const Container = styled.div` background-color: ${({theme}) => theme.color.blue2}; `; import { Container } from "./home.styles" export default function Home() { return ( <Container>안녕하세요</Container> ) };
안녕하세요 강사님 강의 잘 듣고 있습니다! 항상 좋은 강의와 친절한 답변 감사드립니다. 스타일 컴포넌트 적용 중에 궁금증이 생겼는데 검색을 통해서는 명쾌한 답변이 나오지 않아서 질문드립니다. 아래 첨부 드린 코드와 같이 스타일 컴포넌트를 적용하려면 use client로 하고 page.tsx 에서 import 해서 사용해야 하는데 혹시 이렇게 했을때 강사님이 사용하신 CSS Modules에 비해 안 좋은점이 있을까요? use client를 import해서 사용하다 보니 css modules에 비해 속도가 느리다던가 서버 컴포넌트에 클라이언트 컴포넌트로 작성된 스타일을 적용시킴으로서 악영향이 있을까 걱정되어서 질문 드립니다. 'use client' import styled from "styled-components" export const Container = styled.div` background-color: ${({theme}) => theme.color.blue2}; `; import { Container } from "./home.styles" export default function Home() { return ( <Container>안녕하세요</Container> ) };
클론코딩 무작정 하다보니 이 부분은 제가 제대로 이해하고 있는 기분이 들지 않아서 다 지우고 해당 기능 구현에 대해서 혼자서 코딩해보고 있는데, 막막하네요.제가 막무가내로 짠 코드 고쳐봤자 의미가 없어서 다시 생각해서 짜보려고 하는데, 어떤 어떤 부분을 순서대로 구현해야 하는지 핵심만 힌트로 알려주실 수 있을까요?
LoginModal.tsx 클라이언트 컴포넌트에서 로그인 호출시 http://localhost:9090/api/auth/error?error=CallbackRouteError 로 넘어가서 질문드립니다. (9090서버 열린 것 확인했습니다) 비슷한 질문에 대한 답변에 버전 문제가 있어서 버전도 다시 설정해보았습니다. 그런데도 여전히 로그인 함수 호출 시 http://localhost:9090/api/auth/error?error=CallbackRouteErro r 로 리턴되고 있어서요. 터미널에는 아래와 같은 오류가 나옵니다..ㅜㅜ
첫번째처럼 코드 작성했는데, padding을 입력하기 전과 후가 차이가 안 나고 박스1,2,3이 계속 같은 크기예요. 제가 뭘 잘못한 걸까요?ㅠㅠ contentbox와 borderbox 크기 차이가 강의영상처럼 안 나타나서 뭘 잘못했나 싶네요.... 알려주시면 감사하겠습니다!
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
AuthProvider에서 useEffect를 추가해서 loadUser가 호출되도록 해주었는데 모든 페이지 접근시 2번씩 호출되는 원인이 무엇일까요? // app.tsx <AuthProvider> <Component {...pageProps} /> </AuthProvider> // AuthProvider useEffect(() => { async function loadUser() { try { const res = await axios.get("/auth/me"); dispatch("LOGIN", res.data); } catch (error) { console.log(error); } finally { dispatch("STOP_LOADING"); } } console.log("loadUser"); loadUser(); }, []); 그리고 커뮤니티 생성 페이지에서는 getServerSideProps를 선언해두었기 때문에 여기서도 /auth/me api 를 호출해주어서 결국 커뮤니티 생성 페이지에서만 총 3번이 호출되고 있어요. 제가 잘못 구현한 것일까요? 정리하자면, 1. 현재 코드에서는 loadUser() 메서드가 1회만 호출되어야 할 것 같은데, 2번 호출되는 이유는 무엇인지? 2. 커뮤니티 생성 페이지에서는 /auth/me api를 3번 호출하고 있는데, 횟수를 줄일 수 있는지? (이건 url 직접 입력해서 들어가지 않으면 1회만 호출할 것 같긴 하네요.) 서버 로그입니다.(각각 커뮤니티 생성 페이지, 로그인 페이지)
css배우기 예제 실습 중에 질문이 생겼습니다! <link href="./02-signup.css" 까지 연결하고 난 이후에, tㅓㄴ생님께서 rel 입력하신 것처럼 바로 아래에 자동으로 속성 연결할 수 있는 리스트들이 안 뜨고, 그냥 흰색으로 텍스트로 인식되는 것 같아요! 이럴 때는 어떻게 해야하나요?ㅠㅠ 선생님께서 작성하신 코드랑 똑같이 작성했습니다!