안녕하세요 선생님 콘솔을 찍으면 자꾸 브라우저 개발자 도구 콘솔에서 안보이고 터미널에서만 보이는데 이유가 뭔지 알 수 있을까요? 해당 컴포넌트가 server client component라 그런걸까요? 'use client'; 라고 적은 컴포넌트에서는 콘솔이 잘 찍힙니다.
안녕하세요. banner.js에서 질문이 있습니다 이 부분에서 왜 async await를 사용하셨는지 궁금합니다! const fetchData = async () => { // 현재 상영중인 영화 정보를 가져오기(여러 영화) const request = await axios.get(requests.fetchNowPlaying); // 여러 영화 중 영화 하나의 ID를 가져오기 const movieId = request.data.results[ Math.floor(Math.random() * request.data.results.length) ].id; // 특정 영화의 더 상세한 정보를 가져오기(비디오 정보도 포함) const { data : movieDetail } = await axios.get(`movie/${movieId}`, { params: {append_to_response: "videos"}, }); setMovie(movieDetail); }
요즘은 타입스크립트가 대세라는 소리를 어디서 들은 것 같아서 질문드립니다. 왜 타입스크립트를 안썼냐고 따지는 것은 절때 아니고... 단순히 자바스크립트를 사용했는데 어떠한 의도를 갖고 했는지가 궁금합니다. 작성하기가 쉬울 수도 있고, 코드의 길이가 짧을 수도 있고, 기존에 만들어진게 자바스크립트일 수도 있다는 생각이 들긴 하지만 직접 물어보는게 더 좋을꺼같아서 질문드립니다.
안녕하세요, 요창님 :) 강의 잘 보고 있습니다! 보던 중 한 가지 궁금한게 생겨서요! 실제 현업에서도 const pageToStr = Array.isArray(convertPage) ? convertPage[0] : convertPage; const sizeToStr = Array.isArray(convertSize) ? convertSize[0] : convertSize; 위와 같은 코드(?) 가 자주 쓰이나요? 먼저 위를 예시로 들면 분명 client 에선 page을 number로 넘겼으나 api 에서 배열인지 아닌지 확인해줘야 하는 것은 인터넷에 찾아보니 next의 req.query의 타입이 string | string[] 이므로 타입을 지정해주고 있기 때문에 위에서 저렇게 체크를 해주는 것이라 이해했습니다. 그럼 많은 부분에서 저렇게 배열을 구분하는 코드가 들어갈텐데 조금은 비 효율적이라 생각해 현업에서는 다르게 사용할 것 같아서 질문 드립니다.!!
const onChangeContents = (event) => { setContents(event.target.value); if (writer && title && contents) { setIsActive(true); } }; 리렌더링은 함수에 바뀐값이 있다면 함수가 끝난후에 리렌더링이 되고 그래서 함수가 끝나기 전에 위 코드처럼 참/거짓 검증을 하려고 하면 undefined 값이라 거짓이라 setActive 값은 리렌더링이 되지않고 const onChangeContents = (event) => { setContents(event.target.value); if (writer && title && event.target.value) { setIsActive(true); } }; 위처럼 event.target .value로 바꾸면 참이라서 바로 리렌더링이 되어서 노란색으로 버튼이 활성화 되는건가요?
안녕하세요, 강의 잘 들었습니다. SSG 페이지 갯수에 관해서 궁금한 것이 있는데요. 만약에 커뮤니티 사이트 같은 걸 만든다고 하면 엄청나게 많은 글이 생성 될텐데 SEO를 위해 이 페이지 모두 SSG를 적용하면 안될 것 같다고 생각하는데 맞을까요? 그리고 그렇다면 SSR로 모든 페이지를 개발한다고 하면 사용자 경험이 안 좋을 것 같고, SSR은 prefetch도 안되는 것 같은데 속도를 개선하는 방법이 없을까요?
사진처럼 eslint js 파일에 rules 설정을 마쳤는데도 npx eslint .을 하면 여전히 문제가 100개 이상 발생하고 있습니다. 하지만 강의 내용에는 저 5개의 규칙만 적용해도 발생하는 문제가 없다고 뜹니다. 뭐가 문제인가요? 빠른 수정 방식으로 새로운 규칙을 지정하는 등의 문제 해결은 가능하나 현재 강의 내용과 보여지는 에러가 달라서 질문 남깁니다. 빨간 줄이 쳐저 있는 부분은 import하는 부분과 코드 내부에서는 router 기능을 사용하는 곳에 표시됩니다.
제 한계네용... 1.텍스트입력칸을 어떻게 하면 밑줄만 가로로 쭉 나오게 할지 모르겠고 2. 성별 선택하는 라디오"만" 중앙배치 시키고싶은데 아직 해결이 안되고 3.모든 요소들사이에 공간을 만들어주는게 아닌 가입버튼과 이용약관, 성별 선택라디오 이렇게 세가지 요소만 공간을 만들고 요소를 선택해서 배치를 자유자재로 하고싶은데 어렵네요 ㅠ
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
안녕하세요! 강의 잘 보고있습니다 섹션 8에 유저페이지 생성하기 부분을 진행 하던 중 useSWR을 입력 시 툴팁으로 useSWR에 대한 추론이 나오시는데 저는 나오지를 않습니다ㅠㅠ.. useSWRConfig 말고는 나오지 않는데 이유가 무엇일까요? 라이브러리는 제대로 설치가 되었습니다..!
안녕하세요, 사용자 정보 조회 API 부분에서 컨트롤러에 보면 screenName이 없을 경우에 대해서 예외처리를 해주고 있습니다. if (screenName === undefined || screenName === null) { throw new BadReqError('screenName이 누락되었습니다.'); } 위와 같은데 저 에러를 구현해보고 싶어서 테스트 해봤는데 되지 않아서 고민하다가 질문드려요. [screenName].ts 형식의 Dynamic route로 되어 있어서 screenName이 누락된다면 해당 컨트롤러를 수행하지 않아 위 에러가 발생하지 않을 것 같은데 맞을까요? 제가 next는 이제 막 배워가고 있는 단계라서 잘 몰라서 위 이유가 맞는지 잘 모르겠습니다. 제가 발생시키지 못 하고 있는 중이라면 어떻게 해야 저 에러를 발생시킬 수 있는지 또한 같이 답변 부탁드립니다!! 요약 dynamic route로 인해 screenName이 누락되었을 경우 컨트롤러를 실행하지 않는다고 생각했는데 맞을까요? 실행시킬 수 있는 에러라면 어떻게 해야 저 예외처리를 실행 시킬 수 있나요?
redirect_uri_mismatch 구글 로그인 버튼 생성하여 팝업을 실행시키면 위와 같은 에러가 나옵니다. 안되는 이유를 찾던 중 강의에서는 authDomain에 FIREBASE_AUTH_HOST 를 입력하셨는데 host를 입력하지 않고, firebaseconsle에서 확인할 수 있는 domain 을 가져와서 값을 넣으니 동작 하였습니다. 아래와 같은 형식 authDomain: " blah-tutorial-3e756.firebaseapp.com ", 영상을 찍을 때와 버전이 달라져서 그런건지 문의드리며 혹시 비슷한 이슈로 팝업에서 에러를 받는 수강생들에게 도움이되길바랍니다.
안녕하세요? 프로그램 설치 관련 한번 더 질의 드립니다. 질의 답변 및 노션의 디렉션대로 진행하던 중 어떤 문제가 발생한 듯도 했지만 설치는 진행이 되었습니다. npx create-next-app을 설치한 한 class 폴더 내 다른 폴더들 확인한 결과, 아래와 같이 pages 폴더는 설치가 되지 않았고, node.modules에서는 노션에 나온 대로 버전 변경하려 했으나 이미 변경된 상태였습니다. 시간이 지나 업데이트 등의 이유로 설치 항목이 변경되어 위와 같은 것인지, 혹은 제가 무언가 실수를 한 것인지 궁금하여 질의 드립니다. 위와 같이 설치된 상태에서도 수업 진행에 차질이 없을지요?
