inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

묻고 답해요

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

Ubuntu 설치 관련

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

제 노트북이 램이 8G인데 Ubuntu 설치해서 이용가능할까요?

  • javascript
  • node.js
  • docker
  • rest-api
  • nestjs
도식 댓글 1 좋아요 0 조회수 85

recoil error 나시는 분들 보세요

미해결

실무 중심! FE 입문자를 위한 React

리코일 에러 나시는분들 보세요 최근에 강의 시작하셨으면 리액트가 19로 설치되셨을탠데 리코일이 리액트 18까지만 지원하고있습니다. 원활하게 나머지 진행하시기위해서 npm install react@18 react-dom@18 --save 으로 react18로 버전 낮춰주시면 나머지 진행 가능하십니다.

  • react
  • redux
  • node.js
  • sass
  • swr
yeji_rang 댓글 1 좋아요 3 조회수 143

강의하다 줌으로 설명가능한지좀 정확히 알려주세요. 이 선생님 정책이 어떻게 되는데요. 직접 연락할 메일이라도 알려주세요

미해결

따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]

강의하다 줌으로 설명가능한지좀 정확히 알려주세요. 이 선생님 정책이 어떻게 되는데요. 직접 연락할 메일이라도 알려주세요

  • react
  • redux
  • node.js
  • 웹앱
  • mongodb
네이쳐 댓글 1 좋아요 0 조회수 54

8.5) Read -투두리스트 렌더링하기 강의 내용 중 질문드립니다!

해결됨

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

import "./List.css"; {import Todoitem from "./Todoitem"; const List = ({ todos }) => { return ( <div className="List"> <h4>Todo List🎉</h4> <input placeholder="검색어를 입력하세요"></input> <div className="todos_wrapper"> {todos.map((todo) => { return <div>todo</div>; })} </div> </div> ); }; export default List; <질문> {todos.map((todo) => { return <div>todo</div>; })} {todos.map(( todo ) =>{ ....})} 빨간줄 친 todo는 어디서 나온건지 이해가 되지 않습니다 8.5) Read -투두리스트 렌더링하기 강의 1분 46초 입니다!

  • javascript
  • react
  • node.js
이근호 댓글 2 좋아요 0 조회수 126

콜백함수 호출시 인자 개수 체크

해결됨

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

안녕하세요. 강사님. 콜백함수 챕터에서 repeat 함수에서 호출하는 Callback 함수에 인수를 하나로 넣어주고 있는데 callback 함수가 어떤 함수 인지 모르는 상태에서 인수가 여러개인 함수를 넣어 준다면 오류가 발생하지 않을까요? callback 함수로 들어오는 인자가 잘못된 경우 안에서 타입 체크등을 하기도 하는지 궁금합니다.

  • javascript
  • react
  • node.js
유일용 댓글 2 좋아요 0 조회수 138

컴포넌트 리렌더링 관련 질문

미해결

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

안녕하세요! 강의 잘 듣고 있습니다ㅎㅎ 이번 강의에서 React dev tools의 ' Highlight updates when components render' 옵션을 통해서 컴포넌트가 언제 리렌더링 되는지 감지하는 방법을 알려주셔서 해당 내용 학습 중에 궁금한게 생겨 질문 드립니다. 해당 옵션을 켜고, 이번 강의의 실습 내용 중에서 input 영역을 input component로 분리하면 다른 component와 어떠한 영향도 주고 받지 않으니까 input을 작성할 때 input 영역만 highlight가 될 거라 예상 했는데요, 실제로는 형제 컴포넌트도 다 같이 리렌더링 되는 것 처럼 보이더라구요. 이 현상이 제 코드의 문제인건지, 다른 이유가 있는건지 궁금합니다. input component를 분리한 App.jsx와 Input.jsx를 아래에 코드로 첨부했습니다. [App.jsx] import { useState, useEffect, useRef } from 'react' import "./App.css" import Viewer from './components/Viewer' import Controller from './components/Controller' import Even from './components/Even' import Input from './components/Input' function App() { const [count ,setCount] = useState(0); const handleClickCount = (addValue) => { setCount(count + addValue) } return ( <div className="App"> <h1>Simple Counter</h1> <section> <Input /> </section> <section> <Viewer count={count} /> {count % 2 === 0 ? <Even /> : null} </section> <section> <Controller onCount={handleClickCount}/> </section> </div> ) } export default App [Input.jsx] import { useState } from "react"; const Input = () => { const [input, setInput] = useState(""); return ( <input value={input} onChange={(e) => { setInput(e.target.value) }} /> ) } export default Input;

  • javascript
  • react
  • node.js
minsu591 댓글 2 좋아요 0 조회수 124

배포관련 질문드립니다.

해결됨

React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드

저는 vercel과 cloudtype 을 이용해 배포를 했습니다. gitlink front-link backend-link 업무게시판등 backend연동이 잘 되지만, admin에서 문제가 있습니다. 수업에 진행한 아이디와 패스워드로, 진행했고, 오류가 나는 부분들을 계속 수정해 보았으나, 로그인연동이 안되서 문의 드립니다. 데이터는 git에 업로드된 내용으로 확인해 주시면 좋겠습니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • mongodb
LIZ.B 댓글 3 좋아요 0 조회수 193

맥 환경에서 redisJson 사용하는 방법이 궁금합니다

미해결

레디스의 모든 것 (feat. Node.js)

현재 로컬에서 redis 설치해서 학습 진행 중입니다! 맥 환경에서 도커 없이 로컬에 설치된 redis에 redisJson 붙여서 사용하는 방법이 궁금합니다!

  • node.js
  • redis
드루와라잇 댓글 1 좋아요 0 조회수 136

redis insight 관련 질문입니다

미해결

레디스의 모든 것 (feat. Node.js)

redis insight 를 현업에서 모니터링 툴로 많이 사용을 하는 지 궁금합니다!

  • node.js
  • redis
드루와라잇 댓글 1 좋아요 0 조회수 146

완벽한 프론트엔드

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

안녕하세요. 저는 현재 고농축 프론트엔드와 백엔드 강의를 모두 수강 중 인데요, 최근에 ‘완벽한 프론트엔드’ 강의가 새로 생긴 걸 알게 됐습니다. 이미 고농축 강의를 수강 중인데도, 완벽한 프론트엔드 강의도 수강하는 게 도움이 될까요? 그리고 ‘고농축 프론트엔드’와 ‘완벽한 프론트엔드’의 가장 큰 차이점 이 궁금합니다. 혹시 고농축 강의를 수강한 사람 입장에서 완벽한 프론트에서 꼭 들어야 하는 파트가 있다면 추천도 부탁드립니다! 그리고 혹시 ‘완벽한 프론트엔드’ 강의에 대해 쿠폰을 받을 수 있는지도 문의드립니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
imhj11777 댓글 2 좋아요 0 조회수 161

"Create-투두 추가하기" 강의에서 onKeyDown에 관련된 질문

해결됨

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

"Create-투두 추가하기" 강의 11분쯤에 나오는 엔터로도 버튼 실행하기에 관해 질문이 있습니다. onKeyDown 함수를 추가하기전엔 input박스에서 한버튼을 꾹 누르고있으면 연속해서 값이 입력 되었었는데, 강의와 같이 onKeyDown 함수를 추가하고 나면 한가지 키를 꾹 누르고 있어도 하나만 입력 됩니다. (ex. E버튼을 꾹 누르는 경우, "EEEEEEEEEEEEE" 이렇게 입력 되었었는데, onKeyDown을 추가하면 "E" 이렇게 하나만 입력됩니다.) 엔터로 버튼을 실행하면서 한가지 키를 꾹 눌러서 연속적으로 값도 입력할 수 있는 방법이 있는지 궁금합니다. 감사합니다.

  • javascript
  • react
  • node.js
댓글 2 좋아요 0 조회수 107

5.8) State로 사용자 입력 관리하기 1

미해결

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

강의 6분쯤에 "" 으로 공백이었던 useState의 초깃값을 "이름"으로 바꿔주면서 value={name} 구문을 추가해주셨는데요, 공백일 때에는 같은 문자열임에도 해당 구문 없이도 잘 작동했는데 "이름"으로 설정했을 때에는 해당 구문이 필요한 이유는 무엇인가요? 지피티에 물어보니 Uncontrolled와 controlled input이라는 새로운 개념을 언급하길래 잘 이해가 안 되어 여쭤봅니다!

  • javascript
  • react
  • node.js
차예린 댓글 2 좋아요 0 조회수 113

npm init이 안됩니다 ㅠ

해결됨

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

해당 오류 발생하여 아래와 같이 power shell에서 RemoteSigned 으로 변경하였습니다.. 다른 방법이 있을까요 ㅠ

  • javascript
  • react
  • node.js
kmh880507 댓글 2 좋아요 0 조회수 192

나만의 쇼핑몰 샘플 페이지 접속 확인부탁드립니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

안녕하세요! 섹션3에서 나만의 쇼핑몰 샘플 페이지 접속 시 404에러가 발생해 확인 부탁드립니다. ( https://jooeun-k.github.io/css_my_shop ) 더 이상 접속을 할 수 없는 걸까요? 미리 답변 감사드립니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
hyunah10 댓글 1 좋아요 0 조회수 98

mongdb 스키마 공식 문서와 형태가 다른 이유 궁금합니다.

미해결

탄탄한 백엔드 NestJS, 기초부터 심화까지

수업에서 보여주신 코드와 nest.js 공식 문서에서 제공하는 스키마 파일의 구조가 살짝 다른 이유가 궁금합니다. 1. xtyatDocument = HydratedDocument<Cat>; 수업 코드에서는 이 부분이 없습니다. 무슨 차이인가요? export class Cat { 공식 문서 제공 파일에서는 아무것도 extends하지 않는데, 수업에서는 다릅니다. 무슨 차이인가요? [공식 문서 제공 코드] ``` import { Prop, Schema, SchemaFactory } from '@nestjs/mongoose'; import { HydratedDocument } from 'mongoose'; export type CatDocument = HydratedDocument<Cat>; @Schema() export class Cat { @Prop() name: string; @Prop() age: number; @Prop() breed: string; } export const CatSchema = SchemaFactory.createForClass(Cat); ```

  • node.js
  • mongodb
  • express
  • nestjs
김지혜 댓글 1 좋아요 0 조회수 131

npm run build 시 search 쪽에서 에러로 인해 build가 안됩니다.

미해결

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

git : https://github.com/ture403/next_appRoute 입니다. 현재버전 : 에러: 이건 search/page.tsx 입니다. import BookItem from "@/components/book-item"; import BookListSeletion from "@/components/skeleton/book-list-seletion"; import { BookData } from "@/types"; import { delay } from "@/util/delay"; import { Suspense } from "react"; async function SearchResult({ q }: { q: string }) { await delay(1500); const res = await fetch(`${process.env.NEXT_PUBLIC_API_SEVER_URL}/book/search?q=${q}`); if (!res.ok) { return <div>오류가 발생했습니다.</div>; } const searchDatas: BookData[] = await res.json(); console.log(searchDatas); return ( <div> {searchDatas.map((book) => ( <BookItem key={book.id} {...book} /> ))} </div> ); } export default async function Page({ searchParams }: { searchParams: Promise<{ q?: string }> }) { const params = await searchParams; // searchParams Promise를 await 합니다. const query = params.q || ""; // q 값을 추출하고, 없으면 빈 문자열을 사용합니다. return ( <Suspense key={query} fallback={<BookListSeletion count={3} />}> <SearchResult q={query} /> </Suspense> ); } 봐주시면 감사겠습니다.

  • javascript
  • react
  • node.js
레디온 댓글 2 좋아요 0 조회수 76

vercel 터미널 설치 문제

해결됨

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

터미널에 vercel을 설치하려는데 자꾸 이렇게 뜨고 제가 맥os를 사용중이라 sudo npm i -g vercel 이것도 넣어봤더니 패스워드 입력하라고 뜨는데 입력이 아예 안 되네요.. 그냥 엔터 누르면 다시 시도하라고 뜨는데 어떻게 해야 설치 가능한가요?ㅜㅜ

  • javascript
  • react
  • node.js
green 댓글 2 좋아요 0 조회수 165

사용자 입력값으로 input 수정시 문자열을 date객체로 바꾸는 이유

해결됨

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

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}`; }; 초기값 설정 할 때 input 태그가 date 객체를 해석하지 못해서 위의 getStringedDate() 함수로 문자열로 변환하여 value 속성으로 넣어줘야 한다고 하셨는데요, 사용자 입력값을 넣을 때는 input을 수정하면 문자열로 들어가기 때문에 다시 date 객체로 바꿔주는 함수를 새로 사용해야 하던데 <input name="createdDate" onChange={onChangeInput} value={getStringedDate(input.createdDate)} type="date" /> 이미 여기서 getStringedDate() 로 객체에서 문자열 변환하는 함수를 사용해서 값을 나타내야하기 때문에 onChangeInput() 함수를 사용해야 하는건가요? 이 흐름이 맞는 거 같긴한데 왠지 좀 번거로운거 같아서 제가 이해한게 맞는지 궁금해서요 참고로 섹션13 12.14)강의의 10:22 부분을 듣고 생긴 질문입니다!

  • javascript
  • react
  • node.js
green 댓글 2 좋아요 0 조회수 106

PUT, DELETE 등의 http 메소드 질문있습니다.

해결됨

React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드

안녕하세요. 오늘도 좋은강의 정말 감사히 듣고 있습니다. 제가 웹개발자가 아니라서 정확하게는 잘 모르긴 합니다. 6-3에서 문의글 상태변경, 삭제할때 PUT, DELETE 인 http메소드를 사용하시던데 제가 알기로는 PUT, DELETE는 보안에 취약한것으로 알고 있는데 사용해도 상관은 없는지 궁금합니다. 만약 사용하지 않는다면 상태변경, 삭제할때 GET과 POST방식만으로 어떤식으로 사용해야할지 로직정도만 알려주시면 감사하겠습니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • mongodb
초보자 댓글 2 좋아요 0 조회수 434

인기 태그

인프런 TOP Writers

주간 인기글