묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결따라하며 배우는 리액트 네이티브 기초
파이어베이스 버전 11 오류
파이어 베이스 11로 했을때똑같이 실행했을때 , getAuth를 인식을 못합니다. 찾아보니까 9버전부터 하나하나 import해야한다는데 맞나요?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
Favicon이 설정이 안 됩니다.
현재 이미지를 public 폴더에 잘 넣어주었는데 아래 이미지처럼 바뀌지 않고 지구 모양으로 뜹니다.. app.tsx , document.tsx, index.tsx 파일에서 favicon 설정하는 코드가 없는데.. 이거때문인걸까요?
-
미해결한 입 크기로 잘라먹는 Next.js(v15)
Pre Rendering 방식에서 페이지 이동 요청 시 동작 관련 질문 드립니다.
[1.2) Next.js 사전렌더링 이해하기] 강의 15분 부근에서 "사전 렌더링에서 페이지 이동 요청 시 클라이언트 사이드 렌더링 방식과 동일하게 처리한다"는 내용을 보고 질문 드립니다. 강의를 따라가며CSR에서의 JS Bundle은 서비스 전체 코드에 대한 번들사전 렌더링에서의 JS Bundle은 해당 페이지에 대한 번들라고 스스로 생각하여 페이지 이동 요청 시 웹 서버로부터 새 JS Bundle을 받을 줄 알았는데, 사전 렌더링에서도 JS Bundle은 서비스 전체 코드에 대한 번들인 것인지 궁금합니다. 만약 제가 이해한 것이 맞다면, 아래 답변에 대해서마지막으로 현재 페이지에 필요한 자바스크립트 코드만 Hydration이 이루어지게 됩니다. 그 이유는 간단한데요 단순히 Hydration이라는 과정이 현재 브라우저에 렌더링된 페이지의 HTML과 JS를 연결하는 과정이기 때문입니다.전체 JS Bundle에서 현재 페이지에 대한 JS를 실행하고, 컴포넌트 교체 및 수화가 일어난다고 생각하면 될까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
useEffect에 대해 질문있습니다.
안녕하세요 useEffect에 대해 공부를 하다가 궁금한점이 생겨 질문을 드립니다. 강의처럼 useEffect의 배열에 count를 작성하면 컴포넌트가 마운트 될때 먼저 실행되고 그다음 count가 바뀔때마다 useEffect가 실행이된다... 까지는 이해를 했는데 그럼 의존성 배열에 count를 넣으면 이 count의 값만 바뀔때에만 실행되기 때문에 불필요한 렌더링을 줄여주어서 useEffect를 사용하는건가요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
12.11) Home 페이지 구현하기 - 년월 (In/De)crease 관련
강사님께서 말씀주신대로 년월 증가처리에 대해서동일하게 코드를 작성하였습니다.<div> <Header title={`${pivotDate.getFullYear()}년 ${pivotDate.getMonth()+1}월`} leftChild={<Button onClick={onDecreaseMonth} text={"<"}/>} rightChild={<Button onClick={onIncreaseMonth} text={">"}/>} /> <DiaryList/> </div>(질문)Home.jsx에서 Button 구성요소 ">" 클릭시에onClick시에 onIncrease 함수객체가 <Button/> 구성요소가 props형태로 함수객체가 전달되고 있습니다.rightChild={<Button onClick={onIncreaseMonth} text={">"}/>}Button 구성요소에는 전달받은 onClick 전달받은함수객체에 대해서 별도 처리가 없어도 되는것인가요?const Button = ({text, type, onClick}) => { console.log("Button onClick : ", onClick) return ( <button onClick={onClick} className={`Button Button_${type}`}> {text} </button> ) }
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
React가 서버 컴포넌트를 지원하는 이유
안녕하세요 선생님. 강의 잘 듣고 있습니다.강의를 듣고 Next.js도 아니고 React는 CSR 방식인데 왜 서버 컴포넌트를 지원하지? 라는 의문이 생겼습니다.React 공식문서를 보니 프레임워크와 통합하기 위해 Next.js 팀과 협력했다고 나오더라고요. React가 서버 컴포넌트를 지원하게 된 계기가 Next.js의 SSR 때문인지 궁금합니다.공식문서 : https://react.dev/learn/start-a-new-react-project#bleeding-edge-react-frameworks
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
새 강의 쿠폰 질문있습니다.
안녕하세요 강의를 너무 잘 듣고 있습니다. 강의가 업데이트가 되었다는 공지를 오늘 처음 확인을 하게 되었는데 업데이트 된 내용으로 새로 듣고 싶은데 쿠폰을 혹시 발급 받을 수 있을까요?
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
ch9-3 배포하기는 따로 동영상강의가 1월말에 올라온다는 것인가요?
📢 질문을 작성하기 전에 꼭 읽어주세요! 📢질문 전에 준비할 것스스로 먼저 확인하기같은 문제를 겪은 사람이 있는지 인터넷에서 검색해보세요. 대부분의 경우 비슷한 사례를 쉽게 찾을 수 있습니다.오류와 코드를 다시 한번 점검하기간단한 실수나 오타가 없는지 확인해보세요. (예: 변수 이름, 함수 호출 방식 등)문제 상황 정리하기본인이 겪고 있는 문제를 정확히 이해하고, 어떤 상황에서 발생하는지 메모해보세요.질문 작성 시 유의할 점간결하고 명확한 제목문제를 한눈에 이해할 수 있도록 제목을 작성하세요. ("React에서 상태값 초기화 문제"처럼 구체적으로!)상황 설명 포함문제가 발생한 맥락과 이미 시도했던 해결 방법을 간략히 정리해서 알려주세요.코드 공유문제가 발생한 코드를 첨부하여 보여주세요.강의 관련 질문강의 내용과 관련된 질문이라면 문제가 발생한 강의의 시간이나 챕터를 반드시 적어주세요.추가 안내사항답변을 받으면 꼭 확인하고 감사 인사를 남겨주세요. 작은 반응도 답변자에게 큰 동기부여가 됩니다!질문 게시판에서는 서로를 존중하며 커뮤니케이션해주세요.강의 외적인 문의(예: 계정 문제, 결제 등)는 고객센터를 이용해주세요.여러분의 꼼꼼한 질문이 더욱 빠르고 정확한 답변으로 이어질 수 있습니다. 😊
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
Root Layout에서 Context API를 사용할 때 모든 컴포넌트는 클라이언트 컴포넌트가 되나요?
제목그대로의 질문입니다!app/layout.tsx에서<Providers>{children}</Providers> 와 같이 했을때 전체 페이지는 클라이언트 컴포넌트가 되는걸까요?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
안녕하세요
한입 Nextjs강의 수강중입니다. 2.12) SSR 2. 실습 요 강의전체가 다른 강의보다 음량이 많이 작게 나오네요수강에 문제는 없지만 혹시나 수정이 간단한 문제라면 한번 살펴보셔도 좋을것 같습니다.
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
커스텀훅을 언제 사용하는건지 궁금합니다.
안녕하세요~ 커스텀훅을 만들 때, 커스텀훅 안에도 스프레드 연산자를 넣어서 통합핸들러처럼 사용하면 되는걸까요? 커스텀훅을 훅 파일로 만들어 놓으면, 다른 컴포넌트에서도 비슷한 함수면 가져다 쓰는 용도라고 이해했는데 맞는걸까요? 감사합니다.
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
/, /new, /diary 관련 질문
home으로 들어가서 보이는 화면에는 Home이라고 잘 보이는데주소뒤에 /new나 /diary를 붙여서 검색해봐도 계속 Home으로 고정되어있습니다코드는 밑에와 같은 방식으로 작성하였습니다. import { createRoot } from 'react-dom/client' import './index.css' import App from './App.jsx' import { BrowserRouter } from 'react-router-dom'; createRoot(document.getElementById('root')).render( <BrowserRouter> <App /> </BrowserRouter> ) const Diary=()=>{ return <div>Diary</div>; }; export default Diary; import './App.css' import {Routes,Route} from "react-router-dom"; import Home from './pages/Home'; import Diary from './pages/Home'; import New from './pages/Home'; // 1. "/" : 모든 일기를 조회하는 Home 페이지 // 2. "/new" : 새로운 일기를 작성하는 New 페이지 // 3. "/diary" : 일기를 상세히 조회하는 Diary 페이지 function App() { return <Routes> <Route path="/" element={<Home />} /> <Route path="/new" element={<New />} /> <Route path="/diary" element={<Diary />} /> </Routes>; } export default App
-
미해결따라하며 배우는 리액트 네이티브 기초
마지막 9번째 Redux 관련 자료가 없어요
다른 학습들은 도표에 docs 가 연결되어있는데 마지막 redux 프로젝트는 빠져있어요.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
기존 강의 자료 관련 주소, 새 강의 쿠폰
graphql 연습 관련 주소가 더 이상 유지되고 있지 않는 것 같습니다. 일단은 새 강의 쿠폰 관련 문의 드렸는데, 이전 강의에 해당하는 주소들은 이제 유지하지 않는 건가요?
-
미해결Next + React Query로 SNS 서비스 만들기
auth.ts 에서 오류가 납니다.
안녕하세요, 클론코딩 강좌 따라하던중 오류가 나는데 강사님 깃헙 클론해서 완성본 봐도 같은 오류가 나는것 같은데 무슨오류일까요..?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
클라이언트 , 서버 컴포넌트의 사용 범위
안녕하세요 정환님. 완강하고 혼자 google oAuth 와 jwt를 이용해서 로그인을 구현하는 와중에 아무리 찾아봐도 도저히 개념이 잡히지 않는 부분이 있어서 질문 드립니다. nextjs에서는 대부분의 컴포넌트들을 서버컴포넌트로 쓰는것을 권장하고, 상호작용을 위해 hydration이 필요한 컴포넌트들을 클라이언트 컴포넌트로 사용하라고 강의에서 배웠고 그렇게 구현을 하고 있습니다. nextjs의 로그인을 찾아보면 jwt로 access토큰과 refresh 토큰을 이용해서 구현을 하는 글들이 많이 있는데, access토큰은 로컬 스토리지나 state에 담고, refresh 토큰은 httpOnly 쿠키에 담으라고 합니다. 구현을 하다보니 컴포넌트에서 데이터를 페칭을 할때 서버에 access 토큰을 헤더에 담아 보내기 위해서는 로컬 스토리지나 state를 사용하기위해 무조건 클라이언트 컴포넌트를 사용해야 하는데 , 원래 이래야 하는 건가요? 이렇게 되면 데이터 페칭이 필요한 컴포넌트들을 무조건 클라이언트 컴포넌트가 되어버립니다. 아니면 서버 컴포넌트를 사용하고 페칭이 필요할때는 쿠키에 있는 refresh 토큰으로 매번 검증을 해야하는것인지..강의에 많이 벗어난 내용 같긴 한데 이렇게 사용하는게 맞는건인지 .. 개념이 잘 잡히지 않아 질문드립니다.강의는 정말 잘 들었습니다. 새해 복 많이 받으세요.
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
회사 사이트 설명(노션) 사이트 접속 문의
강의중 설명에서 알려주시는노션 사이트는 어떻게 접속해야 하나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
새 강의 쿠폰 관련 문의
안녕하세요!! 강의 너무 잘 듣고 있습니다! 다름이 아니라 css 거의 마지막까지 왔는데 새 강의가 나왔다는 사실을 알게 되어서저도 새로운 버전으로 강의를 수강하고 싶은데요! ㅠㅠ실제로 82강에 나오는 my-shop 깃헙 페이지가 다운되기도 했고 해서 새로운 버전으로 꼭 수강하고 싶습니다!!저도 쿠폰을 받을 수 있을까요?좋은 강의 제공해 주셔서 정말 감사합니다!
-
미해결Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
LiveDemo 페이지 정상작동하나요?
강의를 본격적으로 듣기에 앞서Live Demo를 살펴보려했는데,링크 접속 자체에는 문제가 없으나,로그인 클릭시 리다이렉트 url이 잘못되었는지 정확한 이유는 모르곘으나 "This site can't be reached" 에러가 뜨네요?!확인 좀 해주실 수 있을까요?!
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
context 강의를 들으면서 이해가 안가는 부분이 있습니다.
안녕하세요이전 memo 강의에서 useCallback를 들고 context 듣다 보니 궁금한 사항이 있습니다.리로딩 방지를 위한 onCreate, onUpdate, onDelete에 이전 강의에 useCallback이 되어있는 상태에서 TodoDispatchContext하는 과정에서 useMemo로 리턴해서 전달하는데 context를 사용시 한번만 리로딩 방지를 위해서는 useMemo와 useCallback를 중복으로 사용 되어야하는걸까요?? 아님 useMemo를 사용하여 useCallback는 사용해도 안해도 무방한지 영상을 보다가 궁금합니다...! 추가적으로 이건 아주 소소한 궁금증인데함수를 쓰실때 카멜표기법과 파스칼표기법을 번갈아가면서 쓰시는데 어떤 용도에 따라서 사용하시는지 궁금합니다..ㅎㅎㅎ