172만명의 커뮤니티!! 함께 토론해봐요.
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요. 투두리스트 업그레이드 중 "UPDATE" 에서 질문있습니다. 업그레이드 하며 체크박스를 선택했을 때 다음과 같은 오류가 발생합니다. 업그레이드 이전까지는 잘 돌아가서 업그레이드 하며 오타 문제가 아닐까 하는데 원인을 찾기가 어려워 질문 드립니다.. ㅜ APP.jsx 와 List.jsx 코드 올려드립니다. - APP.jsx import "./App.css"; import Header from "./components/Header"; import Editor from "./components/Editor"; import List from "./components/List"; import { useState, useRef, useReducer } from "react"; const mockData = [ { id: 0, isDone: false, content: "Study React.js", date: new Date().getTime(), }, { id: 1, isDone: false, content: "do laundry", date: new Date().getTime(), }, { id: 2, isDone: false, content: "wanna go home", date: new Date().getTime(), }, ]; function reducer(state, action) { switch (action.type) { case "CREATE": return [action.data, ...state]; case "UPDATE": return state.map((item) => { item.id === action.targetId ? { ...item, isDone: !item.isDone } : item; }); case "DELETE": return state.filter((item) => item.id !== action.targetId); default: return state; } } function App() { const [todos, dispatch] = useReducer(reducer, mockData); const idRef = useRef(3); const onCreate = (content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, isDone: false, content: content, date: new Date().getTime(), }, }); }; const onUpdate = (targetId) => { dispatch({ type: "UPDATE", targetId: targetId, }); }; const onDelete = (targetId) => { dispatch({ type: "DELETE", targetId: targetId, }); }; return ( <div className="App"> <Header /> <Editor onCreate={onCreate} /> <List todos={todos} onUpdate={onUpdate} onDelete={onDelete} /> </div> ); } export default App; List.jsx import "./List.css"; import TodoItem from "./TodoItem"; import { useState } from "react"; const List = ({ todos, onUpdate, onDelete }) => { const [search, setSearch] = useState(""); const onChangeSearch = (e) => { setSearch(e.target.value); }; const getFilteredData = () => { if (search === "") { return todos; } return todos.filter((todo) => todo.content.toLowerCase().includes(search.toLowerCase()) ); }; const filteredTodos = getFilteredData(); return ( <div className="List"> <h4>Todo List 🎈</h4> <input value={search} onChange={onChangeSearch} placeholder="검색어를 입력하세요" /> <div className="todos_wrapper"> {filteredTodos.map((todo) => { return ( <TodoItem onDelete={onDelete} onUpdate={onUpdate} key={todo.id} {...todo} /> ); })} </div> </div> ); }; export default List;
yanna
2025-04-03T07:55:24.291Z
댓글 4
좋아요 0
조회수 194
해결됨
(2026 최신!) 일주일만에 합격하는 정보처리기사 실기
(기출) 2024년 2회 기출문제 (영상) 43분대 질문 return 값이 dcba가 되는 것이 이해가 잘 되지 않습니다. 1) 코드 흐름을 보면 처음에 result - comp(str, 7, seen); 실행 2) idx가 0보다 크므로, char c = str.charAt(7) 즉 여기서 char c는 d가 됨 3) 그리고 String result = comp(str, 6, seen)으로 comp 함수를 다시 부르는 거죠? (재귀함수) 4) if (!seen[c])는 seen[d]는 처음에는 False이므로, !를 만나 True 5) result = d + result 6) char c = str.charAt(6) 이제 char c는 c가 됨 // 3번에서 호출한 재귀함수 실행 7) 이런식으로 해서 처음 들어오는 값만 result에 저장되다 보니 dcba가 출력되는게 맞나요? 추가로 재귀함수를 만나면 아래 if문은 재귀함수가 모두 끝난 이후에 진행되는 것인지, 병렬(?)로 진행되는 것인지 궁금합니다.
김예린
2025-04-03T07:42:38.320Z
댓글 2
좋아요 0
조회수 138
해결됨
(2026 최신!) 일주일만에 합격하는 정보처리기사 실기
# include <stdio.h> int intArr[ 5 ]; // int형 배열 float floatArr[ 5 ]; // float형 배열 double doubleArr[ 5 ]; // double형 배열 char charArr[ 5 ]; // char형 배열 int main () { printf ( "int 배열 초기값: " ); for ( int i = 0 ; i < 5 ; i++) { printf ( "%d " , intArr[i]); } printf ( "\n" ); printf ( "float 배열 초기값: " ); for ( int i = 0 ; i < 5 ; i++) { printf ( "%f " , floatArr[i]); } printf ( "\n" ); printf ( "double 배열 초기값: " ); for ( int i = 0 ; i < 5 ; i++) { printf ( "%lf " , doubleArr[i]); } printf ( "\n" ); printf ( "char 배열 초기값: " ); for ( int i = 0 ; i < 5 ; i++) { printf ( "%d " , charArr[i]); // %d로 출력하면 ASCII 값이 출력됩니다 } printf ( "\n" ); return 0 ; } 에서 출력값이 쓰레기값이 나온다고 하셨는데 출력값으로 작성해 놓으신거는 그냥 임의로 쓰레기값 형태로 작성해놓으신거죠?
wnsghdnjs123
2025-04-03T07:34:02.895Z
댓글 2
좋아요 0
조회수 109
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
안녕하세요! 시험과는 조금 무관한 부분일 수 있으나 강의 들으면서 궁금해 문의 드립니다. 만약 levene을 통해서 한 집단이라도 등분산성을 만족시키지 못하는 경우, 어떤 검정을 사용해야 하나요? 감사합니다!
python 머신러닝 빅데이터 pandas 빅데이터분석기사
yaejin1016
2025-04-03T06:31:10.060Z
댓글 2
좋아요 0
조회수 187
미해결
[신규 개정판] 이것이 진짜 크롤링이다 - 실전편 (인공지능 수익화)
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 스타트코딩 네이버카페 가입했는데 클래스와 객체 강의 수강은 어떻게 해야 하나요. 등업 방법이랑 수강방법 궁금합니다.
ajh7457
2025-04-03T06:08:07.106Z
댓글 1
좋아요 0
조회수 76
미해결
[신규 개정판] 이것이 진짜 크롤링이다 - 실전편 (인공지능 수익화)
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요 어떻게 해야 하나요 코드는 똑같은데
ajh7457
2025-04-03T05:54:12.168Z
댓글 1
좋아요 0
조회수 81
해결됨
한 입 크기로 잘라먹는 Next.js
안녕하세요! ISR on-demand 활용해서 인덱스 페이지에서 전체 페이지 새로고침 없이 "새로 추천 받기" 버튼 을 눌렀을 때 추천 도서(recoBooks) 만 새롭게 받아오도록 구현하고 싶습니다. getStaticProps 를 통해 전달된 recoBooks 가 useState 의 초기값으로 들어갈 때, 해당 데이터도 여전히 빌드 타임에 fetch되어 정적 HTML과 함께 포함되는지 궁금합니다. 개발자 도구를 보면 정적으로 렌더링되는 것 같은데, useState 로 상태를 만들었기 때문에 초기 렌더링이 정적인지 아니면 클라이언트 측에서 동적으로 할당되는건지 헷갈립니다. // CSS Module import SearchableLayout from '@/components/searchable-layout'; import style from './index.module.css'; import { ReactNode, useState } from 'react'; import BookItem from '@/components/book-item'; import { InferGetStaticPropsType } from 'next'; import fetchBooks from '@/lib/fetch-books'; import fetchRandomBooks from '@/lib/fetch-random-books'; 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>) { const [recommended, setRecommended] = useState(recoBooks); const revalidate = async () => { try { const response = await fetch('/api/revalidate'); const result = await response.json(); // console.log(result); if (result.revalidate) { //페이지 갱신이 됐을 때 const rebooks = await fetchRandomBooks(); setRecommended(rebooks); } else { //페이지 경신 안됐을 때 } } catch (err) { //에러처리 console.error(err); } }; // console.log(recoBooks); return ( <div className={style.container}> <section> <h3>지금 추천하는 도서</h3> <button onClick={revalidate}>새로 추천 받기</button> {recommended.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>; };
김혜빈
2025-04-03T05:18:36.365Z
댓글 2
좋아요 0
조회수 174
해결됨
(2026 최신!) 일주일만에 합격하는 정보처리기사 실기
this(a,b)에서 매개변수를 2개 넣은것이 만약 2개 이상이라면 코드가 잘못된 것인가요? 아니면 두 개 다 호출하나요?
melon2641
2025-04-03T04:56:52.221Z
댓글 2
좋아요 0
조회수 113
해결됨
한 입 크기로 잘라먹는 Next.js
강사님 영상대로 했는데 왜 저부분이 왜 적용이 안되는걸까요 혹 index.module.css 해도 배경을 하얀색으로 해야 하나요 강의 내용에는 별 말씀이 없으셨는데
2025-04-03T03:49:46.820Z
댓글 2
좋아요 0
조회수 134
미해결
한 입 크기로 잘라먹는 Next.js
알려주신 완성본 (완성본) 데모사이트 링크 https://inf.run/fBsfH 가서 경험해보려고 가니 검색기능도 안되고 상품 클릭해도 정보가 안나오네요
Ming
2025-04-03T03:16:46.781Z
댓글 2
좋아요 0
조회수 104
미해결
코드로 배우는 React 19 with 스프링부트 API서버
거듭된 질문에 한결같이 답변을 해주셔서 감사합니다. 교재 9장까지는 문제없이 잘 진행되어서, 10장 부터 새로 작성한, 엔티티, DTO, Repository 싹 다 지우니, 앞서 작성한 테스트는 그나마 제대로 실행이 되는군요. 다시 엔티티부터 하나씩 깔면서, 동시에 테스트를 다시 진행해봐야 겠습니다.
react spring-boot jpa jwt redux-toolkit
hee woong Yoo
2025-04-03T03:05:21.588Z
댓글 1
좋아요 0
조회수 66
미해결
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 제로초님 ! 강의보고 따라해보고 있는데 화면 새로고침할때 깜빡거리는걸 없애고 싶은데 getServerSideProps을 사용해서 상태값을 변경해주면 가능한걸까요??
react redux node.js express next.js
ᅵᅵ
2025-04-03T02:53:27.651Z
댓글 1
좋아요 0
조회수 136
미해결
코드로 배우는 React 19 with 스프링부트 API서버
testInsertByProduct() 와 관련된 에노테이션은 교재하고 똑같이 했고, log.info 만 남기고 나머지 코드는 다 지웠는데도, 여전히 Test Failed가 뜨고, testInsertProduct() 메소드로 진입조차 안되는 군요.
react spring-boot jpa jwt redux-toolkit
hee woong Yoo
2025-04-03T02:22:32.450Z
댓글 1
좋아요 0
조회수 53
미해결
코드로 배우는 React 19 with 스프링부트 API서버
교재를 똑같이 따라왔는데, testInsertByProduct()에서 tests failed 메시지가 뜨는 군요. 서버코드는 cookie_00@naver.com으로 첨부했습니다.
react spring-boot jpa jwt redux-toolkit
hee woong Yoo
2025-04-03T01:54:20.515Z
댓글 1
좋아요 0
조회수 63
미해결
파이썬 알고리즘 트레이딩 파트1: 알고리즘 트레이딩을 위한 파이썬 데이터 분석
sp500 = pd.read_html(url) 에서 오류가 나는 경우, pip install lxml 해주면 됩니다
python 머신러닝 pandas 객체지향 퀀트 병렬-처리
stupidstudent
2025-04-03T01:48:29.776Z
댓글 2
좋아요 1
조회수 175
미해결
프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)
chpter05_03_ex1 에 대한 강의 자료 요청드립니다. dpdltmee@gmail.com 어떤강의는 강의 옆에 다운로드가 있는데 어떤강의는 다운로드가 없습니다. 영상에서는 다운로드 받을 수 있다고 하시는데 어디로 가면 모든 자료를 다운로드 받을 수 있을까요?
jsr
2025-04-02T23:39:13.237Z
댓글 2
좋아요 0
조회수 102
해결됨
(2026 최신!) 일주일만에 합격하는 정보처리기사 실기
57분 필기하신거를 보면 {1, 5, 3, 9, 2} 배열을 int *arr 포인터 변수에 대입하시는데 왜 배열 첫번째 요소의 주소가 대입되는게 아니라 {1, 5, 3, 9, 2} 배열 전체가 대입이 되는건가요?
sbd
2025-04-02T20:26:00.731Z
댓글 2
좋아요 0
조회수 156
미해결
남박사의 파이썬 기초부터 실전 100% 활용
비쥬얼 스튜디오에서 코드 드레그 하고 컨트로 + / 키를 입력했는데 주석처리가 안됩니다..
turtlestory920
2025-04-02T15:08:19.087Z
댓글 1
좋아요 0
조회수 143
해결됨
한 입 크기로 잘라먹는 Next.js
defined but never used.eslint@typescript-eslint/no-unused-vars 만들고 아직 다른 곳에서 import 하거나 사용하지 않아서 빨간줄이 뜹니다. 문제는 없으나 헷갈리기도 하고 ,, 강의에서 강사님은 빨간줄이 안뜨는데 ESLint 설정을 따로 하신 걸까요? 헷갈리니 설정을 하는 것을 추천하시나요?
박지성
2025-04-02T14:37:15.541Z
댓글 4
좋아요 0
조회수 280
미해결
코드로 배우는 React 19 with 스프링부트 API서버
교재 9장까지 잘 따라왔습니다. 10장 장바구니 api 만들기에 들어와서 CartRepository 만들고 CartItemRepository를 만들고 CartRepositoryTests를 만들었습니다. 그리고, testInsertByProduct()를 테스트 하는데, Tests failed 가 나왔습니다. 코드 몇 군데에서 로그를 확인해봤는데, configuration 부분은 잘 통과했는데, testInsertByProduct() 메소드로는 진입조차 못하고 있습니다. 실습환경은 "인텔리제이" 입니다. 아래 캡쳐는, 에러가 시작되는 경계로 생각되는 부분입니다. 질문 내용이, 답변 주시기에 좀 부족하다면, 더 필요한 코드 부분이나, 에러로그를 보충해서 다시 질문에 올리도록 하겠습니다.
react spring-boot jpa jwt redux-toolkit
hee woong Yoo
2025-04-02T14:06:07.023Z
댓글 1
좋아요 0
조회수 71
