inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

스타일관련문의드립니다

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

선생님 강좌 하다보니까 스타일 관련이 좀어려운 부분이 있는데요 혹시 스타일 쉽게 구현하는 법이 있나요? 미디어쿼리 z인덱스니 포지션 이런거 한번에 해결해주는 툴은 없는지요?

  • Next.js
  • redux
  • react
  • typescript
  • tdd
David Ko 댓글 2 좋아요 0 조회수 304

특정 영화의 더 상세한 정보가져오기

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

const {data:moviedetail} = await axios.get(`movie/${movieId}`,{params:{append_to_reponse:'videos'}}) setmovie(moviedetail) `movie/${movieId}`,{<---------- 이부분이요 params:{append_to_reponse:'videos'}}); 선생님 저 윗 부분은 1. 중괄호로 params를 묶으신건 어떤걸 의미하는건가요? 2.append_to_response:'videos' 이부분은 문법인가요? 감사합니다

  • tdd
  • redux
  • typescript
  • react
  • Next.js
David Ko 댓글 2 좋아요 0 조회수 340

error: password authentication failed for user "postgres"

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

도커 컨테이너도 실행 잘 되고, 서버 연결도 잘되서 localhost : 4000에서 서버도 잘 띄워집니다. 그런데, 데이터베이스만 연결이 안되는 것 같아요 ㅠㅠ npm run dev 만 하면 이런 에러가 납니다. // docker-compose.yml // data-source.ts 환경변수로도 해봤는데 안되서, 일단은 postgres, password로 입력해 놓은 상태입니당 ㅜ Docker Desktop에 컨테이너에서 로그 같은 기능이 있길래 봤는데 자꾸 비밀번호 인증에 실패 했다고만 나오고 구글링해도 모르겠어용 ㅠㅠ reddit-postgres | 2022-08-28 02:13:17.747 UTC [1] LOG: database system is ready to accept connections reddit-postgres | 2022-08-28 02:13:52.751 UTC [33] FATAL: password authentication failed for user "postgres" reddit-postgres | 2022-08-28 02:13:52.751 UTC [33] DETAIL: Connection matched pg_hba.conf line 100: "host all all all scram-sha-256"

  • error
  • react
  • typescript
  • docker
  • postgresql
  • nodejs
  • 클론코딩
  • Next.js
프링이 댓글 3 좋아요 1 조회수 1629

error 관련하여

해결됨

풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)

text contents does not match server-sided HTML이라는 오류가 뜨는게 혹시 어떻게 해결할 수 있을까요? 검색해도 마땅히 제대로 된 답이 안나오네요. 그리고 왜 여기서는 그런 오류가 안생기는지 궁금합니다!

  • rest-api
  • graphql
  • react
김인범 댓글 1 좋아요 1 조회수 314

data값이 안 받아와져요..

미해결

MERN STACK 커뮤니티 : 시작부터 배포까지 알려주는 React

프록시 설정하고 응답요청했는데 console.log(요청)도 안되고 데이터자체가 안 받아와지는데 왜 그럴까요..?

  • mongodb
  • express
  • nodejs
  • firebase
  • react
pooh2_2000 댓글 2 좋아요 2 조회수 474

동영상이 없을 경우 오류

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

선생님 안녕하세요? 강의 잘 듣고 있습니다. Styled Component를 이용한 비디오 배너 만들기에서 iframe에서 src에 movie.videos.results가 없을 경우 오류가 생깁니다. 저는 여기에 옵셔널 체이닝(?.)을 걸어 만약에 movie.videos.results이 없을 경우 undefined를 반환하게 하는 방식으로 해결했습니다. 이렇게 한 경우 오류 페이지가 보이는 대신 동영상을 재생할 수 없다고 뜹니다. 이렇게 하는 방법도 괜찮은지, 혹시 더 좋은 방법이 있다면 가르쳐 주세요. 감사합니다. src={`https://www.youtube.com/embed/${movie.videos.results[0]?.key}?controls=0&autoplay=1&loop=1&playlist=${movie.videos.results[0]?.key}`}

  • Next.js
  • typescript
  • react
  • redux
  • tdd
hh1234 댓글 1 좋아요 2 조회수 584

dispatch("LOGIN",res.data?.user); 쪽에서 에러가 뜹니다 ㅜ

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

TypeError: dispatch is not a function at _callee$ (login.tsx?11e1:20:10) at tryCatch (runtime.js?ecd4:45:16) at Generator.invoke [as _invoke] (runtime.js?ecd4:274:1) at prototype.<computed> [as next] (runtime.js?ecd4:97:1) at asyncGeneratorStep (_async_to_generator.mjs?949a:3:1) at next ( async_to_generator.mjs?949a:25:1) 라는 에러가 뜨는데 어디가 문젠지 모르겠습니다.. ㅠ

  • docker
  • postgresql
  • typescript
  • react
  • nodejs
  • 클론코딩
  • Next.js
tmdrbwk3 댓글 4 좋아요 0 조회수 588

질문 드려요

해결됨

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

findone vs findoneorfail 무슨차이 인가요?

  • toporm
  • typescript
  • nodejs
  • postgresql
  • react
  • docker
  • 클론코딩
  • Next.js
리나스 댓글 1 좋아요 0 조회수 298

디비 api 사이트 회원가입 문제

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

디비 api 사이트 회원가입이 안됩니다

  • react
  • typescript
  • redux
  • tdd
  • Next.js
강민성 댓글 2 좋아요 0 조회수 354

500에러 질문

미해결

Slack 클론 코딩[실시간 채팅 with React]

제로초님 깃헙코드 보고 리액트쿼리로 공부하다가 DM 보내는 로직에서 500에러가 떳습니다~!! api 문서대로 요청보냈고, 분명 서버쪽은 문제가 없을텐데 싶어서 며칠 째 고민하다 질문드려요!!! NaN으로 뜨는 부분이 백엔드 코드에서 콘솔 찍어보니까 req.query.perPage 이게 언디파인드로 전달 되더라구요. 근데 저는 perPage를 제로초님처럼 20으로 고정해서 전달하고 있는데 언디파인드로 뜨는게 이상하더라구요.ㅜㅜ +) 그리고 뮤테이션 쿼리키를 ["workspace", workspace, "dm", id, "chat"] 이렇게 주신 이유가 궁금해요!! 제가 공식문서 읽고 이해한게 배열로 줄 경우 첫번째 값이 캐싱할 때 쓰이는 이름이고 그 위에있는 애들은 mutation 안에서 사용될 외부 값을 넣어준다고 이해했었거든요!! 근데 dm 이나 chat은 사용되지 않는 것 같아서요!!

  • typescript
  • 웹팩
  • react
  • babel
  • Socket.io
  • 클론코딩
댓글 1 좋아요 0 조회수 369

Router 예제 복붙했더니 오류가 뜰 때!

미해결

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

아랫분들도 설명해주셨다싶이 버전이 바뀌면서 쓰이는 용어가 바뀌었어요! 다만 올려주신부분들이 다 수업끝부분 완성본인것같아서.. 저는 Home() About() Users()함수가 들어가야하는 초반 부분 수정본을 첨부해봅니다! import React from "react"; import { Route, Routes, BrowserRouter } from "react-router-dom"; function Home() { return <h2>Home</h2>; } function About() { return <h2>About</h2>; } function Users() { return <h2>Users</h2>; } function App() { return ( <BrowserRouter> <div> {/* A <Switch> looks through its children <Route>s and renders the first one that matches the current URL. */} <Routes> <Route path="/about" element={About()}> <Route /> </Route> <Route path="/users" element={Users()}> <Route /> </Route> <Route path="/" element={Home()}> <Route /> </Route> </Routes> </div> </BrowserRouter> ); } export default App;

  • react
  • nodejs
ina9377 댓글 1 좋아요 7 조회수 690

Context 질문드립니다.

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요 선생님. 질문이 있어요. 그전까지는 이해가 되었는데 Context강의가 유독 어렵네요... 먼저 DiaryStateContext.Provider의 value로 {data, onCreate, onRemove} 이렇게 넣으면 prop이 바뀌면 재생성된다는 것이 이해가 안되요. onCreate랑 onRemove는 useCallback으로 재생성 되는 것을 막아 놓은 것 아니었나요? 헷갈리네요. 두번째로 중첩으로 하는 이유가 잘 이해가 안 됩니다. 왜 중첩으로 하면 이게 해결이 될까요? 어차피 memoizedDispatches로 useMemo를 썼으면 그냥 DiaryStateContext.Provider에 value로 넣으면 안되는 건가요. 중첩으로 하는 이유가 잘 납득이 안됩니다. DiaryStateContext.Provieder value={data, memoizedDispatches} 이렇게 하면 안되나요? 그리고 useMemo로 묶는 부분도 다시 한번 설명해주실 수 있나요? useCallback으로 막아놨는데 왜 useMemo로 다시 묶어야 할까요 그냥 onCreate, onRemove, onEdit을 묶지 말고 따로따로 DiaryStateContext.Provider의 value로 {data, onCreate, onRemove} 이렇게 보내주면 안될까요? 강의를 두번 반복했는데도 잘 이해가 안되네요..

  • nodejs
  • react
  • javascript
학운학운 댓글 2 좋아요 2 조회수 389

프론트앤드 .env 파일

미해결

[리뉴얼] React로 NodeBird SNS 만들기

그 어디에선가 프론트앤드에서 .env 파일이 build 시 노출된다는 얘기를 들었던 것 같은데 사실인가용 프론트앤드에서 .env 파일을 사용하면 더 효율적으로 처리 할 수 있는 작업이 생겼는데 백앤드로 처리해도 되지만 보안상 괜찮은지 궁금해서 여쭤봅니다

  • Next.js
  • redux
  • nodejs
  • react
  • express
123413 댓글 1 좋아요 0 조회수 487

상위 커뮤니티 imageUrl

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

사진을 등록하고 메인 페이지에서 위와 같이 이미지가 제대로 나오지 않습니다. server.ts 에서 express.static("public") 코드 추가한상태입니다. 해당 커뮤니티 페이지 내에서 사진 업로드는 잘 됩니다. 메인 페이지에서 이미지가 안보이는건 어떻게 해결해야 할까요?

  • Next.js
  • 클론코딩
  • typescript
  • nodejs
  • react
  • postgresql
  • docker
SOOMIN 댓글 2 좋아요 0 조회수 320

중첩 Context 관련 질문있습니다.

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요 중첩 Context 관련해서 질문하나 드립니다 <DirayStateContext> 라는 컨텍스트 또한 컴포넌트 이기에 data 값이 바뀌면 하위 컴포넌트 들 또한 재렌더링이 되기에 DirayStateContext 에 상태변경 함수를 넣어주게 되면 함수또한 재생성이되서 전달이 되는것이고 그러면 최적화가 풀려버리기에 그하위에 별도의 컨텍스트를 생성해서 data 라는 상태가 변경되어도 DiaryDispatchContext에 전달한 상태변경 함수는 변동이 없어서 최적화를 유지할 수 있다 제가 이해한게 맞는걸까요? 이부분이 살짝 헷갈립니다.

  • javascript
  • nodejs
  • react
권석기 댓글 1 좋아요 1 조회수 339

npx sequelize db:create 입력시 에러 발생

미해결

Slack 클론 코딩[실시간 채팅 with React]

back 폴더에 npm i 이후 npx sequelize db:create 입력시 npm ERR! could not determine executable to run npm ERR! A complete log of this run can be found in: npm ERR! /Users/eycha/.npm/_logs/2022-08-21T06_14_10_186Z-debug-0.log 라는 에러 발생합니다. mysql 과 node 정상적으로 설치했는데 관련되서 검색해도 해결책이 없어서 질문 남깁니다.

  • react
  • Socket.io
  • babel
  • typescript
  • 웹팩
  • 클론코딩
차은엽 댓글 5 좋아요 0 조회수 2262

params : { append_to_response : "videos"},

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

강의 잘 보고 많이 배우고 있습니다 ! "append_to_response"는 사용자가 다르게 바꿀 수 있는 부분인가요 ? 아니면 axios 속성인가요 ?

  • axios
  • Next.js
  • typescript
  • redux
  • react
  • tdd
댓글 1 좋아요 0 조회수 357

config-overrides cant resolve path

해결됨

프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 1

ts 프로젝트 진행중 config-overrides를 통해 경로를 alias 설정하였는데 cra-bundle-analyzer가 작동을 안하는데요 혹시, 방법이 있을까요? webpack-bundle-analyzer로 해야할 것 같은데 잘 안나오네요,, module.exports = override( useBabelRc(), addWebpackAlias({ "@Path": path.resolve(__dirname,'./src/path'); )

  • react
  • devtools
easyiscat 댓글 1 좋아요 1 조회수 379

11:58 질문입니다. ㅠㅠ

해결됨

따라하며 배우는 리액트 A-Z[19버전 반영]

안녕하세요 선생님... 아래 부분 이해를 못했는데 다시 한 번 설명 가능하신가요? ㅠㅠ const { data: movieDetail } = await axios.get(`movie/${movieId}`, { params: { append_to_response: "videos" }

  • react
  • tdd
  • redux
  • typescript
  • Next.js
miniapp 댓글 1 좋아요 0 조회수 416

보안 세션을 위한 TLS 핸드셰이크에 해싱알고리즘의 용도

미해결

CS 지식의 정석 | 디자인패턴 네트워크 운영체제 데이터베이스 자료구조

안녕하세요! 큰돌님 강의 잘 듣고있습니다. 해싱 알고리즘은 단방향 알고리즘으로 복호화가 불가능한 것으로 알고있는데, 데이터를 주고받기에 양방향 알고리즘이 필요한 보안 세션 생성 과정에서 복호화가 불가능한 해싱알고리즘의 용도가 궁금합니다! 또한 저는 지금까지 https가 키교환 시 중간자 공격에 대비해 비대칭키 암호화로 공통의 암호키를 생성하고 추후 데이터 통신에는 만들어진 암호키로 사용하는, 대칭키와 비대칭키를 적절히 혼합해 사용한다고 생각했는데 AES라는 대칭키 블록 방식의 암호화를 사용하네요.. 혹시 제가 잘못 알고 있는 부분이 어딜지 궁금합니다!!

  • 암호화
  • 기술면접
  • https
  • 운영체제
  • 면접
람쓰 댓글 1 좋아요 0 조회수 278

인기 태그

인프런 TOP Writers

주간 인기글