inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

12.15강의 10분 Edit페이지에서 삭제하기(onDelete) 기능 질문

해결됨

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

TypeError: onDelte is not a function onDelete를 함수로 인식하지 못하고 있다고 합니다. 오탈자가 문제인건지 잘 모르겠습니다.... import "./App.css"; import { useReducer, useRef, createContext } from "react"; import { Route, Routes } from "react-router-dom"; import Home from "./pages/Home"; import Diary from "./pages/Diary"; import New from "./pages/New"; import Notfound from "./pages/Notfound"; import Edit from "./pages/Edit"; // 1. "/" : 모든 일기를 조회하는 Home 페이지 // 2. "/new" : 새로운 일기를 작성하는 New 페이지 // 3. "/diary" : 일기를 상세히 조회하는 Diary 페이지 const mockData = [ { id: 1, createdDate: new Date("2024-11-04").getTime(), emotionId: 1, content: "1번 일기 내용", }, { id: 2, createdDate: new Date("2024-11-03").getTime(), emotionId: 2, content: "2번 일기 내용", }, { id: 3, createdDate: new Date("2024-10-07").getTime(), emotionId: 3, content: "3번 일기 내용", }, ]; function reducer(state, action) { switch (action.type) { case "CREATE": return [action.data, ...state]; case "UPDATE": return state.map((item) => { String(item.id) === String(action.id) ? action.data : item; }); case "DELETE": return state.filter((item) => String(item.id) !== String(action.id)); default: return state; } } export const DiaryStateContext = createContext(); export const DiaryDispatchContext = createContext(); function App() { const [data, dispatch] = useReducer(reducer, mockData); const idRef = useRef(4); //기본 일기 추가 const onCreate = (createdDate, emotionId, content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, createdDate, emotionId, content, }, }); }; // 기존 일기 수정 const onUpdate = (id, createdDate, emotionId, content) => { dispatch({ type: "UPDATE", data: { id, createdDate, emotionId, content, }, }); }; // 기존 일기 삭제 const onDelete = (id) => { dispatch({ type: "DELETE", id, }); }; return ( <> <DiaryStateContext.Provider value={data}> <DiaryDispatchContext.Provider value={{ onCreate, onUpdate, onDelete }}> <Routes> <Route path="/" element={<Home />} /> <Route path="/new" element={<New />} /> <Route path="/diary/:id" element={<Diary />} /> <Route path="/edit/:id" element={<Edit />} /> <Route path="*" element={<Notfound />} /> </Routes> </DiaryDispatchContext.Provider> </DiaryStateContext.Provider> </> ); } export default App; import Header from "../components/Header"; import Button from "../components/Button"; import Editor from "../components/Editor"; import { useParams, useNavigate } from "react-router-dom"; import { useContext } from "react"; import { DiaryDispatchContext } from "../App"; const Edit = () => { const params = useParams(); const nav = useNavigate(); const { onDelte } = useContext(DiaryDispatchContext); const onClickDelete = () => { if (window.confirm("일기를 정말 삭제할까요? 다시 복구되지 않아요!")) { //일기 삭제 로직 //console.log(params.id); onDelte(params.id); nav("/", { replace: true }); } }; return ( <div> <Header title={"일기 수정하기"} leftChild={<Button onClick={() => nav(-1)} text={"< 뒤로 가기"} />} rightChild={ <Button onClick={onClickDelete} text={"삭제하기"} type={"NEGATIVE"} /> } /> <Editor /> </div> ); }; export default Edit;

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

2025년 실기준비할때도 참고하면 좋을 강의일까요?!

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

아직 결제만하고 강의시청은 안한상태인데 2025년 웹디자인개발기능사로 바뀌는데 내용도 바뀐다고 알고있는데 이 강의로2025년도꺼 준비해도 무리는 없을까요!? 혹시 2025년도 버전 강의가 새로 나오면 그걸로 결제할까해서요 여쭤볼곳이 없어서 여기에 적습니다. 답변주시면 감사하겠습니다.!

  • HTML/CSS
  • jquery
  • 웹-디자인
이희정 댓글 1 좋아요 2 조회수 276

섹션 3 부트 프로젝트 생성 및 확인 / 엔티티 클래스 만들기 강의가 재생되지 않습니다.

미해결

코드로 배우는 React 19 with 스프링부트 API서버

섹션 3 부트 프로젝트 생성 및 확인 / 엔티티 클래스 만들기 강의가 재생되지 않습니다. 크롬으로 보던 중 무한로딩이 떠서 시크릿모드 및 다른 브라우저로 시도해봤지만 여전히 재생되지 않습니다. 다른 영상은 잘 재생되는데, 섹션 3 부트 프로젝트 생성 및 확인 / 엔티티 클래스 만들기 강의만 재생되지 않네요. 확인 한 번 부탁드립니다!

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
양성준 댓글 2 좋아요 0 조회수 161

SessionManagerV6 에서 synchronized 부분이 이해가 잘 안갑니다.

해결됨

김영한의 실전 자바 - 고급 2편, I/O, 네트워크, 리플렉션

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] package network.tcp.v6; import network.tcp.v5.SessionV5; import java.util.ArrayList; import java.util.List; public class SessionManagerV6 { private List<SessionV6> sessions = new ArrayList<>(); public synchronized void add(SessionV6 session) { sessions.add(session); } public synchronized void remove(SessionV6 session) { sessions.remove(session); } public synchronized void closeAll() { for (SessionV6 session : sessions) { session.close(); } sessions.clear(); } } 여기서 closeAll() 에서 스레드가 작업중일때 다른스레드가 remove() 를 호출할 수 없다는 부분이 잘 이해가 안 갑니다. synchronized 는 메서드 단위로 적용이 된다고 알고 있어서 closeAll() 에 스레드가 작업중이더라도 remove() 같은 다른 메서드랑은 관련 없다고 생각했습니다. 뭔가 흐름을 잘못 이해하고 있는 걸까요?

  • java
  • 네트워크
  • 객체지향
물병97 댓글 1 좋아요 0 조회수 305

강의 자료 요청합니다~

미해결

실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)

강의를 듣기 시작했는데 강의자료는 어디에서 받는지 몰라 질문드려요~ kjj5421@naver.com 으로 자료 요헝 드려도 될까요?

  • HTML/CSS
  • jquery
  • 인터랙티브-웹
  • 반응형-웹
roaddion 댓글 2 좋아요 0 조회수 155

searchParams 질문있습니다.

미해결

Next + React Query로 SNS 서비스 만들기

const onClickHot = () => { setCurrent('hot'); router.replace(`/search?q=${searchParams.get('q')}`) } 이 코드가 있으면 q=null일때 주소가 http://localhost:3000/search?q=null 이렇게 이동되는데 제로초님은 아무런 검색어가 없는데 어떻게 null로 안나오죠? null체크를해서 주소를 2개 분기해도 될거같긴한데 제로초님은 q가 null일땐 주소창의 쿼리가 안생기더라고요 . 뭐가다른건지 모르겠네요ㅠ

  • react
  • next.js
  • react-query
  • next-auth
  • msw
ChangJun.dev 댓글 2 좋아요 1 조회수 222

h2데이터베이스에 변경사항이 반영이 안됩니다.

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

쿼리문이 다음과 같이 날라가는데도 h2데이터 베이스에 변경사항이 반영되지 않습니다 ㅠㅠ 어떤 문제가 있는 걸까요

  • java
  • jpa
주현 댓글 2 좋아요 0 조회수 209

백엔드서버에서 요청은 정상적이나 데이터를 못가져오는 현상

해결됨

한 입 크기로 잘라먹는 Next.js

안녕하세요. 책 데이터를 불러오지 못해서 문의 드립니다. 스웨거에서도 아무 데이터를 못 불러오는데 혹시 어떤 문제일까요? npx prisma db push 도 잘 완료 하였고 백엔드 서버도 start 해 놓은 상태입니다.

  • react
  • typescript
  • next.js
univsai_edu 댓글 2 좋아요 1 조회수 447

무한스크롤 리액트버전 | 16분 31초

해결됨

[React / VanillaJS] UI 요소 직접 만들기 Part 1

16분 31초에 const useInfiniteFetcher =() => {} 여기 부분을 보게 되면 pageData는 async에서 받아와서 promise가 되었는데 강사님은 따로 .then을 안하셨는데 어떻게 가능한가요??

  • react
  • typescript
  • dom
  • ui
  • vanilla-js
영준 댓글 2 좋아요 0 조회수 204

다운로드소스코드 실행 후 창이 다릅니다.

미해결

김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음

src 폴더 내 array 등 많은 것으로 영상에서는 보여지는데 저는 Main 파일 밖에 없습니다. 다운로드 파일이 잘못된걸까요? ㅠㅠ [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요.

  • java
  • 객체지향
상호 댓글 2 좋아요 0 조회수 183

BlockingQueue에 Task 가 없어요

미해결

김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] ExecutorService.submit 시점에 디버깅을 걸어서 확인해보니 BlockingQueue 필드인 workQueue 내부에 task가 들어가지 않고 workers라는 HashSet에 들어가지는 것 같습니다 혹시 제가 어디서 놓친건지 모르겠어서 여쭤봅니다 이거 때문에 계속 헷갈려요..ㅜ

  • java
  • 객체지향
  • 동시성
  • multithread
  • thread
JHS 댓글 2 좋아요 0 조회수 402

인텔리제이 설치한 후 이상합니다.

미해결

김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음

강사님께서 말씀하신데로 설치하고 뉴 프로젝트를 눌렀는데, 강의에 나오는 화면과 다릅니다... 너무 어이없지만 여기서부터 막혀서 저도 당황스럽습니다... 빨리 공부하고 싶은데... 이게 대체 무슨 상황인지... 빠른 답변 부탁드립니다.

  • java
  • 객체지향
hyosu92 댓글 2 좋아요 0 조회수 114

개발자 모드 질문입니다

해결됨

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

디버그 모드가 되는 것 같은데 이유를 모르겠습니다. 뭐라 검색해봐야할까요? 아님 제가 코드 오타가 난걸까요? 이전에 components탭에서 볼 수 있던 값들이 안 보여서 질문드립니다.

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

closed 사용하는 이유

미해결

김영한의 실전 자바 - 고급 2편, I/O, 네트워크, 리플렉션

NormalCloseServer 할때 close()가 여러번 호출돼도 예방하는 코드가 있다고 했습니다. 그러면 V6SessionV6에서 closeAll() 하기전에 closed를 확인 안해도 되지 않나요?

  • java
  • 네트워크
  • 객체지향
tjrans303 댓글 2 좋아요 0 조회수 213

그랩선생님, 질문 답변 부탁 드립니다.vscode에서 npm install -g create-react-app 입력 후 에러 입니다.

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

(* nodejs 설치를 https://nodejs.org/en/download/ 에 들어가서 Prebuilt Installer 메뉴에서 v22.11.0(LTS)를 설치하였습니다.) 안녕하세요, 수고가 많으십니다. 강의 잘 듣고 공부하다 모르는 부분이 있어 에러사항은 아래에 요약하여 적었습니다. 일단 react 시작하기 강의를 듣고 있던 중 처음 부분에서 vscode 터미널에서 명령어 npm install -g create-react-app 입력 후 아래 에러가 발생하여 어떻게 해야 해결 할 수 있는지 답을 알고 싶어서 글을 쓰게 되었습니다. 1.첫번째로 vscode 실행 후 npm install -g create-react-app 명령어 입력하니 에러 요약: 경로를 확인하라는 문제가 발생하였습니다. 첫번쨰 에러 발생 한 후 vscode를 종료하고 다시 시작하니 또 다시 이번엔 새로운 에러가 발생 하였습니다. 에러 요약: 자세한 내용은 마이크로소프트 링크 주소 참조하라는 메시지 에러가 발생하였습니다. 현재까지 2가지 에러가 순서대로 나타내고 있는데요, 어떻게 하면 해당 사항을 해결 할 수 있을까요? 상세하고 자세한 답변 부탁드립니다. 감사합니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
isbcom1004 댓글 2 좋아요 0 조회수 522

Next.js vs React.js

해결됨

한 입 크기로 잘라먹는 Next.js

강사님, 안녕하세요. 강의를 들으면서 살짝 혼란스러운 부분이 있습니다. 사실 Next.js 도 바탕은 React 인데요. React 에서 제일 많이 언급되고 중요시되는 부분은 상태(state)관리라고 생각이 되는데 Next.js 로 SSR 위주의 페이지를 작성하게 되면 결국 상태관리는 최소화하게 되는 것인데 이게 React 의 컨셉과 맞는 것인지 살짝 이해가 되지 않습니다. (강의에서도 state 는 거의 언급이 되지 않고요) 그렇다고 상태관리를 최대한 활용하는 CSR 위주의 개발을 하게 되면 Next.js 의 장점을 거의 얻지 못하게 될 것 같기도 하고요. 저는 Next.js 가 제공하는 프레임워크 측면의 혜택을 얻고자 Next.js 로 어플리케이션 구축을 해보고 싶은데 해당 어플리케이션이 CSR 의 비중이 적지 않을 것 같아서 좀 망설여지는 부분이 있습니다. 현대 애플리케이션들은 사용자들과의 상호작용이 적을 수가 없을텐데 대다수의 앱들이 Next.js 의 SSR 위주의 개발로 충분히 커버가 가능한 것일까요?

  • react
  • typescript
  • next.js
아리마 댓글 2 좋아요 0 조회수 618

강의 자료 그림

미해결

김영한의 실전 자바 - 중급 1편

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요 ~! 강의 자료에서 처럼 이런 자료들을 draw.io에서 만든다는 정보는 찾았는데요 ! 그 내부에서 어떤 템플릿을 사용하시는지 궁금합니다..! 몇 시간 동안 여러가지 클릭 해봤는데 못 찾아서요 ㅠㅠ 크래파스로 그은듯한 네모와 점선으로 연결된 화살표, dot 네모박스가 궁금합니다 !

  • java
  • 객체지향
강리눅스 댓글 1 좋아요 0 조회수 147

h2 데이터 베이스 버전 오류

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

지금 현재 2가지 문제가 있는데 해결할 수있을까요? 해결방법을 알고 싶습니다 ㅠㅠ

  • java
  • jpa
주현 댓글 2 좋아요 0 조회수 289

delay 적용 안됨

미해결

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

딜레이가 적용이 안되는데 코드에서 어떤 부분이 잘못된 것일까요?? animation-fill-mode와 animation-delay 모두 다 주었습니다. <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; } .skill-progress { background-color: #333; width: 500px; border-radius: 10px; color : white; text-align: center; padding: 10px; } .item { margin-bottom: 35px; } .item p{ overflow: hidden; margin-bottom: 5px; } .item span:nth-child(1) { float: left; } .item span:nth-child(2) { float: right; } .progress { border : 1px solid aquamarine; padding: 5px; border-radius: 3px; } .progress-level { background: linear-gradient(to right, #fc6c85 0%, gold 100%); height: 7px; animation: ani 1s; animation-fill-mode: both; } @keyframes ani { 0% { width: 0; } } .skill-progress .item:nth-of-type(1) .progress-level { animation-delay: 0s; } .skill-progress .item:nth-of-type(2) .progress-level { animation-delay: 0.2s; } .skill-progress .item:nth-of-type(3) .progress-level { animation-delay: 0.4s; } .skill-progress .item:nth-of-type(4) .progress-level { animation-delay: 0.6s; } .skill-progress .item:nth-of-type(5) .progress-level { animation-delay: 0.8s; } </style> </head> <body> <div class="skill-progress"> <h1>SOFTWARE SKILLS</h1> <div class="item"> <p> <span>HTML5</span><span>90%</span> </p> <div class="progress"> <div class="progress-level" style="width: 90%"></div> </div> <p> <span>CSS3</span><span>80%</span> </p> <div class="progress"> <div class="progress-level" style="width: 80%"></div> </div> <p> <span>jQuery</span><span>65%</span> </p> <div class="progress"> <div class="progress-level" style="width: 65%"></div> </div> <p> <span>Photoshop</span><span>70</span> </p> <div class="progress"> <div class="progress-level" style="width: 70%"></div> </div> <p> <span>illustrator</span><span>82%</span> </p> <div class="progress"> <div class="progress-level" style="width: 82%"></div> </div> </div> </div> <script src="script\jquery-1.12.4.js"></script> <script src="script\custom.js"></script> </body> </html>

  • HTML/CSS
  • jquery
황서영 댓글 1 좋아요 1 조회수 148

구조체 강의 4:31 질문있습니다

해결됨

(2026 최신!) 일주일만에 합격하는 정보처리기사 실기

myCar.model[i] = '\0'; 은 세줄 위의 for에 영향을 받는 것 인가요?? 바로 위 } 에서 for문이 종료됐다고 생각했는데 myCar.model[i] = '\0'; 가 [i]에는 어떤 숫자를 넣어야할지 이해가 되지 않습니다

  • python
  • java
  • c
  • 정보처리기사
kku1804 댓글 2 좋아요 1 조회수 174

인기 태그

인프런 TOP Writers

주간 인기글