묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
- 
      
        
    해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
const filteredToDos = getFilterData() 호출하는 유
강의 내용중 12분 00초 정도에 나옵니다. const filteredToDos = getFilterData();리랜더링 될 때마다, 해당 함수를 호출하여 결과값을 저장하라는데,,,이게 무슨말일까요 ???
 - 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
선생님 질문있습니다.
강의 찍으실 때 어떤 프로그램 쓰면 선생님처럼 화면녹화도하면서 마우스로 네모박스도 그리고 그림도 그릴 수 있는거에요? 너무 궁금해요. 아 그리고 강의가 너무 꼼꼼해서 아직까진 아주 이해가 잘됩니다. 감사합니다.
 - 
      
        
    미해결React Native with Expo: 제로초에게 제대로 배우기
EAS서비스 없이 로컬에서 빌드할 수 있을까요?
EAS서비스 없이 react native처럼 로컬에서 빌드해서 사용 할 수 있는 방법이 있는지 궁금합니다.
 - 
      
        
    미해결찍어먹는 Next.js 풀코스 (영어 음성 & 한글 자막)
명령어 실행중 오류가 발생하여 질문드립니다.
안녕하세요 선생님금일 수강신청 및 프로젝트해보면서 오류가 발생하여 질문드립니다. 우선 프로젝트를 clone하고 pnpm install로 의존성을 설치했습니다. 그리고 docker compose -f docker-compose/redis/redis-compose.yml up -d를 실행하였는데 아래와 같은 결과가 나왔습니다.network ludgi-network declared as external, but could not be found어떻게 조치하면 될까요~?
 - 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
[08-04]안드로이드 백버튼과 메모리누수 리팩토링
안녕하세요 ~수업내용과 똑같이 코드작성을 하고 마지막에 실행을 했는데, 페이지 이동하기와 뒤로가기도 잘 되는데 Tost 메세지가 안뜹니다. 해당 수업 자료로 실행을 해바도 같은데 무슨 문제일까요 ?
 - 
      
        
    해결됨한 입 크기로 잘라먹는 Next.js(v15)
백엔드 서버가 존재할 때에도 서버 액션을 사용하는 것이 바람직할까요?
안녕하세요! 서버 액션에 관해 궁금한 점이 생겨 질문드립니다.일단 제가 강의를 보고 실습하면서 느꼈던 서버 액션의 큰 장점은 다음과 같습니다.브라우저에서 서버 측에서 사용되는 함수를 실행할 수 있다. => 별도의 백엔드 API를 구현하지 않고도 DB에 직접적으로 접근하는 등의 작업이 가능브라우저와의 상호작용을 하면서도 컴포넌트를 서버 컴포넌트로 유지할 수 있다. 하지만 1번 장점의 경우 혼자 풀스택으로 개발하지 않고 백엔드 개발자와 함께 개발하는 경우에는, 주로 이번 강의와 같이 서버 액션 함수 내에서 별도의 API를 호출하게 될 것이라 생각됩니다.이런 경우에도 기존의 방식대로 onSubmit 등을 사용해서 API를 호출하는 것보다, 2번 장점을 위해 서버 액션을 사용하는 것이 바람직 할지 궁금해 질문드립니다!state를 이용해 실시간 validation이 이루어져야 하는 곳이 아니라면 유용할 것 같다고 생각이 들지만, 구글링을 해봐도 최신 기술이라 그런지 실제 적용 사례를 잘 찾아볼 수 없어 질문 드립니다!
 - 
      
        
    해결됨제로베이스부터 배우는 웹개발의 개념과 바이브 코딩
슬러그 주소..
선생님 게시글이 슬러그 필드를 이용해서 고유의 url 형성되는건 알겠는데 만약 제목글이 같은 글의 경우 같은 url이 만들어지면 같은 제목의 여러개의 동일한 url이 생기는게 아닌가요?조금 이해가 안가서요...
 - 
      
        
    해결됨한 입 크기로 잘라먹는 Next.js(v15)
실습용 백엔드 서버 세팅이후 section02 생성후 npm run start 에러
안녕하세요 1.3) 실습용 백엔드 서버 세팅 이후 terminal 에서 npm run start 로 Swagger UI 까지 작동이 되었는데요. 2.1) Page Outer를 소개합니다. 에서 npx create-next-app@14 section02를 진행하고 나면, npm run start 시 에러가 나고 있습니다. SSR 강의를 진행하면서 계속해서 백엔드 서버에 접속을 못하는데 왜 이러는 걸까요? error 사진파일 첨부하였습니다.
 - 
      
        
    해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
리렌더링 구분
리렌더링이 되고 있다고 설명하는 화면 리렌더링이 발생하지 않는다는 화면 제가 보엔 둘 다 하이라이팅이 되고 있는 것 같은데 어느 부분을 봐야 리렌더링이 안된다고 느낄 수 있을까요??
 - 
      
        
    미해결한 입 크기로 잘라먹는 Next.js(v15)
안녕하세요, 5.3)풀라우트 캐시 3. 동적경로에 적용하기 질문
안녕하세요, 정환님 궁금한게 있습니다. 동적 경로를 갖는 page.tsx 파일 안에 generateStaticParams 라는 함수를 설정하게되면, 경로에 해당하는 모든 페이지는 모두 Static Page로 만들어지는 것으로 알고 있습니다. return하지 않은 URL Parameter를 갖는 페이지에 대해서도 동일하다고 봤었는데요그렇다면 , 도서 id999번까지 있다고 가정해볼게요return [{id:"1"}] 이렇게만 작성해도 999번까지 static page가 되는게 맞을까요 ?
 - 
      
        
    해결됨@시코 - TypeScript 제대로 배우기(초중급)
교재와 git 링크 문의
강의 소개에 교재와 git 링크를 제공한다고 적혀있어서 찾아봤는데 어디에 있는지 못 찾았습니다. 어디에서 확인할 수 있는 걸까요?
 - 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
[03-04] 디바이스 API
안녕하세요해당 수업 내용을 안드로이드로 실행시켰을때 세 가지 내용중 두 가가지는 잘 나오는데 기종정보는 alert가 안뜨는데 왜 그런걸까요 ??
 - 
      
        
    미해결제로베이스부터 배우는 웹개발의 개념과 바이브 코딩
깃허브 버셀연동
선생님~커서에서 코드 수정하고 연동된 깃허브에 커밋도 시켜주었는데,버셀에 최종 마스터가 뜨지 않는데 왜 이런걸까요? ㅠㅠ 어제 저녁 이것땀시 너무 #&!@ 해서 ㅠㅠ커서에 '최종1'이 마스터로 된 화면이고요.. 깃허브에 최종1이 master 로 되어 있는것 같구요? 근데 버셀에서는 그전단계로만 되어 있어서요 ㅠㅠ(근데 사실 이것도 어제 저녁에 계속 마스터로 안되 있어서 버셀에 있는 프로젝트 계속 지우면서 최신 깃허브 가져온거거든요?) 깃허브에 버셀에 제대로 업뎃이 안되는데, 어디부터 봐야할지 좀 도움 좀 주세요~
 - 
      
        
    해결됨한 입 크기로 잘라먹는 Next.js(v15)
검색을 하면 데이터가 나오지 않습니다..
index.tsx에 getStaticProps로 변경하고 검색을 하면 데이터가 나오질 않습니당..!ㅠ0ㅠ 검색을 한 뒤 페이지를 이동하면 오류 내용은 아래와 같습니다. 챗지피티한테 물어봐도 감이 안 와서 질문 올려봅니다.. import SearchableLayout from "@/components/searchable-layout"; import style from "./index.module.css"; import { ReactNode } from "react"; import BookItem from "@/components/book-item"; import { InferGetStaticPropsType } from "next"; import fetchBooks from "@/lib/fetch-books"; import fetchRandomBooks from "@/lib/fetch-random-book"; export const getStaticProps = async () => { console.log("인덱스 페이지"); const [allBooks, recoBooks] = await Promise.all([ fetchBooks(), fetchRandomBooks(), ]); return { props: { allBooks, recoBooks, }, }; }; export default function Home({ allBooks, recoBooks, }: InferGetStaticPropsType<typeof getStaticProps>) { return ( <div className={style.container}> <section> <h3>지금 추천하는 도서</h3> {recoBooks.map((book) => ( <BookItem key={book.id} {...book} /> ))} </section> <section> <h3>등록된 모든 도서</h3> {allBooks.map((book) => ( <BookItem key={book.id} {...book} /> ))} </section> </div> ); } Home.getLayout = (page: ReactNode) => { return <SearchableLayout>{page}</SearchableLayout>; };
 - 
      
        
    해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
getStringedDate month , date 변환 질문
안녕하세요! 이정환님 강의 정말 재미있게 잘 보고 있습니다. 😊 New 페이지 구현하기 2.기능 강의 중에const getStringedDate = (targetDate) => { let year = targetDate.getFullYear(); let month = targetDate.getMonth() + 1; let date = targetDate.getDate(); if(month < 10) { month = `0${month}`; } if(date < 10) { date = `0${date}`; } return `${year}-${month}-${date}`; }로 날짜 변환 함수로 강의에서 언급 해주셨는데요! 혹시 이건 어떨까요?const getStringedDate = (targetDate) => { return `${targetDate.getFullYear()}-${String(targetDate.getMonth() +1).padStart(2,0)}-${String(targetDate.getDate()).padStart(2,0)}`; }결과는 동일하게 나올 수 있을 것 같아 상관은 없지만 보통 저런 경우에는 조건문을 애용하시는 편이실까요? 어떤 방식으로 짜는 것을 더 선호 하시는지 정말 호기심에 질문을 드립니다! 😆
 - 
      
        
    해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
기존 mock data는 그룹이 따로 만들어지는데 뭔가 잘못된 건가요?
이게 제 console인데요아래 mock data는 자기들끼리 따로 그룹지어서 나오는데 선생님 콘솔에는 그냥 다 개별로 나오거든요...뭐가 문제일까요? import { useReducer, useRef } from "react"; const mockData = [ { id: 1, createDate: new Date().getTime(), emotionId: 1, content: "1번 일기 내용", }, { id: 2, createDate: new Date().getTime(), emotionId: 2, content: "2번 일기 내용", }, ]; function reducer(state, action) { switch (action.type) { case "CREATE": return [action.data, ...state]; } } function App() { const [data, dispatch] = useReducer(reducer, [mockData]); const idRef = useRef(3); const onCreate = (createDate, emotionId, content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, createDate, emotionId, content, }, }); }; return ( <> <button onClick={() => { onCreate(new Date().getTime(), 1, "Hello"); }}> 일기 추가 테스트 </button> </> ); } export default App; 제 코드도 첨부해봅니다,,,
 - 
      
        
    해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
카운터앱 기능구현하기 - 스테이트 리프팅이 헷갈립니다.
강의 설명 중 10분06초 부분 에서 설명해주신 " State Lifting (State끌어올리기 ) "이라는 개념이 아직 애매모호해서 좀더 확실하게 설명 부탁드려도 될까요 ?부모컴포넌트에서 state관리 해야하는 건 인지하고 있습니다. ( 단방향으로 흘러가는 React의 특성 때문에 ) 끌어올린다? 라는 키워드가 확실하게 팍! 하고 이해하기가 조금 어렵네요 ...
 - 
      
        
    해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Header 컴포넌트에 div 말고 애초에 button은 안 되나요?
궁금한 점이 2가지 있는데요1. Header 컴포넌트에 div 말고 애초에 button를 넣으면 안 되나요?Header.jsxconst Header = ({ title, leftChild, rightChild }) => { return ( <header className="Header"> <button className="header_left">{leftChild}</button> <div className="header_center">{title}</div> <button className="header_right">{rightChild}</button> </header> ); };App.jsx<Header title={"Header"} leftChild={"Left"} rightChild={"Right"} />이런 식으로 헤더 컴포에 처음부터 버튼 태그를 넣으면 될 것 같은데 왜 div로 감싸는 건가요?음.. 그냥 css 편의상 이유일까요? 2. 저는 css를 배울 때 처음에 charset "utf-8"; 을 항상 입력하라고 배웠는데 리액트 강의에서는 항상 안 사용하시더라구요. 리액트에서는 원래 안 쓰는건가요, 아니면 그냥 강의에서는 굳이 필요없어서 쓰지 않는건가요?
 - 
      
        
    미해결제로베이스부터 배우는 웹개발의 개념과 바이브 코딩
회원 가입 이메일 문의
안녕하세요 선생님..선생님 강의를 따라하다가,회원 가입한 사람 모두가 글을 쓸수 있는 낚서장 같은 블로그를 만들었는데,회원 가입 페이지나 등록 등을 커서에서 만들어서 잘 동작하는것 같고, 수파베이스에서도 세팅을 해주었는데,회원가입에서 이메일과 비번을 입력하면 제게 확인 메일이 와야 하는데 오질 않네요.이거 혹시 smtp 서비스를 추가해야 되는건가요?
 - 
      
        
    미해결한 입 크기로 잘라먹는 Next.js(v15)
npx prisma db push 문제 완전 해결!
아래 동일한 문제로 고통받는 분들이 계시는 것 같아서깔끔하게 정리해서 올려드립니다. 1.운영체제 및 환경설정-맥북 m1, 윈도우 11 2.이슈발생-터미널 내 npx prisma db push 입력 시, 아래 오류 발생-오류코드 : 아래 문자열3.해결방안-여러가지 해결방안이 있겠지만, 저는 아래와 같이 해결했습니다.-prisma 폴더 > schema.prisma 파일 > 14번째 줄, directUrl 삭제 (*아래처럼)변경 전변경 후-.env 파일 > directURL 설정하지 않기 (*아래처럼!!! / 단, keyword는 본인 키워드로 변경 필수!) 그리고, npx prisma db push 입력 시, 문제없이 실행!! 4.원인분석-아마도 DATABASE_URL과 DIRECT_URL을 둘 다 사용할 때, 뭔가 문제가 발생했던 것 같습니다. 물론 .env 파일 내 DIRECT_URL 키 생성 후 정상적인 값을 입력해보기도 했지만, 저는 계속 동일한 문제가 발생했기 때문에 그냥 서버 연결 방식을 1개만 선택했는데, 이 방법으로는 잘 되었습니다. 혹시나 저와 동일한 문제로 고민하실까 해서 완벽하지는 않지만, 공유드립니다. 감사합니다.