inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

윈도우 사용자입니다. homebrew 윈도우 설치법은 없나요?

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

윈도우 사용자입니다. homebrew 윈도우 설치법은 없나요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
면류관받는날까지# 댓글 3 좋아요 0 조회수 423

리렌더링 관련 문의

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

toggleTodo = useCallback( ( id : number) => { <-- 여기 이 지점에 todos 라는 state 값이 필요한 상황 ( 체크 로직 등등.. ) setTodos( (todos) => todos.map( (todo) => todo.id === id ? { ...todo, completed: !todo.completed } : todo ); }, []); 위 부분에 todos 의 state 값이 필요하게 되면 의존성 배열에 todos 를 넣어줘야 될꺼 같은데요. 이렇게 되면 React.memo 에 의해 전달될 toggleTodo props 도 변경되게 될것으로 예측 되고 결국 자식 컴포넌트들이 리렌더링이 계속 발생되지 않을까 싶은데요. 위 부분에 todos 의 state 값이 필요하게 될 경우에는 어떻게 처리를 해줘야 될까요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
최병국 댓글 2 좋아요 0 조회수 71

7.React UI구현하기 에서 css파일을 어디서 다운받나요?

해결됨

Spring Boot와 React로 배우는 초간단 REST API 게시판 만들기

강의를 수강하면서 실습하고 있는데요. 7.React UI구현하기 강의 중 css파일을 복사해서 붙여넣기 하시는데 깃자료에서 css파일 다운로드 하는 위치를 못찾겠어요. 위치를 알려주시면 감사하겠습니다.

  • mysql
  • rest-api
  • spring-boot
  • jpa
  • react.js
장창욱 댓글 2 좋아요 0 조회수 86

공부 방향에 대해서

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

안녕하십니까 이번에 책을 샀으나 잘 이해가 안되 강의와 함께 보기로 결정해서 공부하고잇는 초보자입니다 선생님 제가 공부를 하고있는데 자꾸 다 메모 할려고 하는데 프로그래밍은 메모하면서 공부하지말라고 암기하는것이 아닌 그때마다 찾아보라는 말이 많습니다 그래서 그냥 메모 같은거 필요없이 그때 이해만하고 넘어가도 진짜 괜찮을가요 뭔가 아직 초보자입장에서는 잊어먹을가 두렵습니다 예를 들면 바이트 와 웹팩의 차이 이런것도 암기를해둬야하는가 아닌 불안감 나중에 나혼자 만들수있을가? 같은불안이 좀 큽니다. 긴글 죄송합니다

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
JEOUNG WOOYOUNG 댓글 2 좋아요 0 조회수 75

Day10 미션 안내 이미지

해결됨

한입 챌린지 7기 - React.js

Day10 미션 안내에서 예시 이미지가 보이지 않는 거 같습니다.

  • javascript
  • react
  • node.js
  • react.js
Lucy 댓글 1 좋아요 0 조회수 66

form action 과 onSubmit

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

진행중에 form 에 action 과 onSubmit 을 섞어서 사용하셨는데 form action 과 onSubmit 을 어느상황에 어떤걸 선택해서 사용해야하는 기준이 있을까요? 어떤 기준에 따라 왜 사용하는지 정리가 안되서요 🤔

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
joo0 댓글 2 좋아요 0 조회수 74

카카오로그인 에러

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

AxiosError: Request failed with status code 401 at settle (/Users/sujin/Development/_00_inflearn/code/SECTION19(finalProject)/backend/node_modules/axios/dist/node/axios.cjs:2106:12) at IncomingMessage.handleStreamEnd (/Users/sujin/Development/_00_inflearn/code/SECTION19(finalProject)/backend/node_modules/axios/dist/node/axios.cjs:3491:11) at IncomingMessage.emit (node:events:531:35) at endReadableNT (node:internal/streams/readable:1698:12) at process.processTicksAndRejections (node:internal/process/task_queues:90:21) at Axios.request (/Users/sujin/Development/_00_inflearn/code/SECTION19(finalProject)/backend/node_modules/axios/dist/node/axios.cjs:4731:41) at process.processTicksAndRejections (node:internal/process/task_queues:105:5) at async /Users/sujin/Development/_00_inflearn/code/SECTION19(finalProject)/backend/routes/auth.js:77:20 카카오 로그인 버튼 클릭후 동의하기 누른 다음 이런 에러가 뜹니다. .env 파일은 이렇게 입력되어있고요. JWT_SECRET=sucoding!@34 KAKAO_REDIRECT_URI=http://localhost:4000/auth/kakao/callback FRONTEND_URL=http://localhost:5173 JWT_ACCESS_EXPIRES_IN=1h JWT_REFRESH_EXPIRES_IN=7d 무엇이 문제일까요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
hicy3nh 댓글 3 좋아요 0 조회수 101

몽고DB 연결이 안됩니다.

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

이런 에러가 계속 뜨고 있습니다. MONGODB_URI=mongodb+srv://admin:qwe123!!@cluster0.eazdtgs.mongodb.net/react_blog?appName=Cluster0 .env 파일의 mongodb 넣는 곳입니다. 첫 clustor0 을 만들고 다른 에러가 나서 terminate 하고 새로 만들어서 한것입니다. 무엇이 문제일까요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
hicy3nh 댓글 3 좋아요 0 조회수 95

섹션 19에 백엔드 부분 몽고DB 연결이 계속 끈깁니다.....

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

따로 몽고 DB URL로 하는 connect는 잘됬습니다만, 백엔드 소스를 동작 시켯을때에는 그 URL 로 연결시에 저렇게 failed가 뜨는데... 이미 몽고DB에 아이피도 0.0.0.0/0해준상태입니다. 혹시 뭐가 문제일가요?...

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
show0389 댓글 2 좋아요 0 조회수 57

최종 예제 코드

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

예제 코드는 한 강좌 후 최종 소스가 아니라 강좌시작 하기전 기초 소스 일까요? 예를 들어 134강의 경우 10-10 소스인데 예제코드 소스를 보면 jsx 정보 정도만 들어 있습니다. 다른 강좌도 마찬가지로 기본 틀만 있고 강좌에 나온 파일 조차 만들어 지지 않은 경우가 많습니다. 수업후 최종 소스도 받을수 있을까요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
신박한 댓글 2 좋아요 0 조회수 49

vite으로 리액트 빌드하기를 업데이트해주세요.

미해결

한 입 크기로 잘라먹는 타입스크립트(TypeScript)

CRA 으로 리액트를 빌드하는 것은 레거시이기 때문에, vite으로 리액트를 빌드하는 식으로 강의를 업데이트하는 것이 필요해보입니다. 감사합니다.

  • typescript
  • react.js
  • vite
빌더 댓글 2 좋아요 1 조회수 106

useState 훅

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

const [count,setCount] = useState(0); 선언되어 있을때 ()=>setCount(count+1); (count)=>setCount(count +1); 강의에서는 2번 처럼 사용 하던데 1번 처럼 사용해도 상관없나요? 차이가 있나요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
신박한 댓글 2 좋아요 0 조회수 50

spring 과 mysql 연결이 안돼요

미해결

Spring Boot와 React로 배우는 초간단 REST API 게시판 만들기

mysql 워크벤치 설정 하고 application.properties 입력 후 실행 결과 unable to load class [org.hibernate.dialect.MySQL8Dialect] Could not load requested class : org.hibernate.dialect.MySQL8Dialect 라고 뜨는데 어디가 잘못 되었을까요?

  • mysql
  • rest-api
  • spring-boot
  • jpa
  • react.js
코딩딩딩 댓글 1 좋아요 0 조회수 120

CRUD어떤 방식의 API 활용하는지 궁금합니다.

해결됨

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

이 강의가 restAPI 기반인지, graphQL 기반 CRUD 구현인지 궁금합니다.

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
mj756987 댓글 2 좋아요 0 조회수 50

Css 복사하는 코드 첨부되어 있나요?

미해결

Spring Boot와 React로 배우는 초간단 REST API 게시판 만들기

React UI 구현하기에서 css복사했던 코드 어디서 복사하나요?

  • spring-boot
  • jpa
  • react.js
백현준 댓글 2 좋아요 0 조회수 103

예제코드 실행

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

예제코드 다운받은거 실행시킬때는 04-04, 04-05와 같이 폴더 기준으로 다음예제 넘어갈때마다 npm install, npm run dev두개명령어 쳐서 실행시키는거 맞나요? 추가로 예제 코드에서 안하고 직접 처음부터 만들어서 하려면 처음에 했던 npm create vite@latest . 이 명령어로 하는거 맞죠?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
오태연 댓글 2 좋아요 0 조회수 46

Redux 연결이 안된걸까요?

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

안녕하세요 쌤! redux 사용을 이번 예제를 통해 처음 알게되었는데요. console.log 로 찍을때는 잘 내려오던 user 정보가 redux 에서는 안찍히고 isLogin 값만 보여서요 ㅠㅁㅠ 여러번 돌려봤지만 어떤 부분에서 놓친 것인지 잘 모르겠어서 질문드립니다! zustand, immer 모두 설치 잘되었는데 연결이 안된 문제일까요?.? 카카오 구현하기 6까지 끝낸 상태이고 모든 기능은 잘 동작해요(로그인, 로그아웃, 프로필 가져오기 등) 혹시 몰라 github 링크도 첨부해봅니다! https://github.com/YounaJ00/blog

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
댓글 2 좋아요 0 조회수 79

window 10을 사용하고 있는 학생인데 react작동안됩니다ㅜㅜ

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

window 10을 사용하고 있는 학생인데 react작동안됩니다ㅜㅜ ctrl 하고 마우스 왼쪽해도 실행이 안되네요 로딩이 오래 걸려요

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
구님 댓글 3 좋아요 0 조회수 70

67강 상태업데이트 강의 중 궁금한 점

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

import FirstCount from "./firstCount"; import SecondCount from "./secondCount"; import { useState } from "react"; export default function Main() { const [count, setCount] = useState(0); const handleSetCount = () => { setCount((prev: number) => prev + 1); }; return ( <> <h1>Main Component</h1> <FirstCount count={count} setCount={handleSetCount} /> <SecondCount count={count} setCount={handleSetCount} /> </> ); } import type { MouseEventHandler } from "react"; interface FirstCountProps { count: number; setCount: MouseEventHandler<HTMLButtonElement>; } export default function FirstCount({ count, setCount }: FirstCountProps) { return ( <> <h1>firstCount Component</h1> {count} <button onClick={setCount}>increase</button> </> ); } import type React from "react"; interface SecondCountProps { count: number; setCount: React.MouseEventHandler<HTMLButtonElement>; } export default function SecondCount({ count, setCount }: SecondCountProps) { return ( <> <h1>secondCount Component</h1> {count} <button onClick={setCount}>increase</button> </> ); } 맨 위에 코드가 부모컴포넌트인데 부모컴포넌트에서 증가 함수를 정의하고 그 아래에 props로 내려주는 패턴은 잘 쓰이지 않는 패턴인가요? 강의에서는 각 자식 컴포넌트에서 카운트 증가 로직이 있어서 중복되는거 같아요 그래서 부모에 하나로 정의하고 props로 내려주었는데 어느게 맞는 패턴인가요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
모카 댓글 3 좋아요 0 조회수 93

19강 게시물 수정 기능 강의 질문입니다

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

export const requireAuth = () => { const token = sessionStorage.getItem("access_token"); if (!token) { return redirect("/auth/login"); } }; export const fetchPostModify = async ({ params }: LoaderFunctionArgs) => { try { const auth = requireAuth(); if (auth) return auth; const { data } = await axiosInstance.get(`/posts/${params.id}`); return data; } catch (e) { console.error(e); } }; fetchPostModify에서 requireAuth를 import 해서 reponse를 리턴해주고 있는데 여기서 어떤식으로 auth를 리턴시켜 requireAuth를 통해 redirect가 되는건지 조금 헷갈립니다

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
홍재훈 댓글 2 좋아요 0 조회수 47

인기 태그

인프런 TOP Writers

주간 인기글