React에서 useReducer를 사용해 장바구니 기능을 구현하던 중,수량을 조절하는 + 버튼을 클릭했을 때 가격이 NaN으로 표시되거나, 수량과 맞지 않는 가격이 표시되는 현상이 나타났습니다.이 글에서는 1️⃣ 문제 상황, 2️⃣ 원인 분석, 3️⃣ 해결 방법과 함께 관련 개념을 정리해보았습니다. 💡 내가 구현하고자 했던 기능"React 티셔츠 추가"버튼을 누르면 장바구니에 상품이 추가된다.+,- 버튼을 눌러 수량을 조절각 아이템의 수량에 따라 가격이 실시간으로 반영 🚨 문제 1: 가격이 NaN으로 표시됨📌 발생 상황수량 증가(+) 버튼을 눌렀을 때 가격이 NaN으로 표시됨🔍 원인sampleItem 객체 내부에서 total: this.price * this.quantity를 사용함하지만 일반..

1. 제너레이터 함수코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수function* 로 정의한 함수.호출하면 바로 실행되지 않고 “제너레이터 객체(이터레이터)”를 반환.이 객체에는 next(), return(), throw() 메서드가 있고,yield 지점에서 실행이 일시중지/재개된다.next()를 호출할 때마다 다음 yield까지 진행된다. 제너레이터 vs 일반함수1. 제너레이터 함수는 함수 호출자에게 함수 실행의 제어권을 양도할 수 있다 일반 함수는 호출하면 제어권이 함수에게 넘어가고, 함수가 호출된 이후 함수 실행을 제어할 수 없다 → 함수 밖에서 실행 중인 함수를 멈추거나 재개할 수 없다제너레이터 함수는 함수 호출자가 함수 실행을 일시 중지시키거나 재개시킬 수 있다...

오늘 해 볼 실습입니다.   ✅ 목표버튼 하나를 클릭하면서 다크모드, 라이트모드를 변환합니다.다크모드, 라이트모드의 자바스크립트 작성 시 toggle을 사용합니다.   먼저, html 코드를 작성합니다.이 실습은 다크모드, 라이트변환 자바스크립트 실습을 위한 것이니 html은 간단히 하겠습니다.  ✅ Html가운데 중앙 정렬로 div 박스를 만듭니다.오른쪽 상단에 버튼을 고정합니다. Web Programming HTML CSS Javascipt 다크 모드  body 전체에 클래스를 주어 버튼을 누를 때마다 body 전체의 배경색, 글자 색을 한번에 변경합니다.body 클래스에 light-mode 클래스를 추가합니다.버튼이 눌릴 때 dar..

☑️ 기본 더하기 연산자 게임 조건 ☑️ 1. 어떤 이벤트 A 가 발생하면 1~100 사이의 랜덤 숫자가 하나 생성 (반복) 2. 최소 3개의 숫자가 발생하면 이벤트 B 를 통해 세개의 숫자를 더해서 제시 🎯 PlusPlus Game 규칙 🎯 1. Start Game 버튼을 눌러 게임을 시작한다 2. 버튼을 누르면 60초동안 진행 3. 세개의 카드를 눌러 랜덤 숫자를 확인, 4. 3개의 카드를 모두 뒤집어야지만 답이 생성 5. 제한시간 60초 내에 빠르게 랜덤숫자 3개의 총합을 입력 6. 게임 중간 Reset Game 버튼을 누르면 재시작 가능 7. 게임종료 후 Score 출력 💡 SKILL 💡 1. HTML,CSS,JavaScript를 사용 2. css는 tailwindcss 를 적용 💡 오픈 API ..

부트스트랩 코드를 다운받았는데 적용이 안될때! 해결방법? 일단 원인은 버전이 안 맞아서 적용이 안되는 경우가 대부분이었다 코드안에 이코드를 붙여넣기! 해결완료 후 적용된 모습!

요런 에러가 발생한 상황!! 코드는 동작하지만 에러가 발생해서 거슬린다 왜인지 App.js 코드 어디에서 오류가 난 것인지 라인 넘버가 보이지 않는다. 일단 오류 내용을 보면 안에 가 있으면 안된다? 는 뜻인 듯 이건 App.js코드 일부 https://stackoverflow.com/questions/41928567/div-cannot-appear-as-a-descendant-of-p cannot appear as a descendant of I'm seeing this. It's not a mystery what it is complaining about: Warning: validateDOMnesting(...): cannot appear as a descendant of . See ... Some..