JavaScript의 typeof 연산자는 변수 또는 표현식의 데이터 유형을 확인하는 데 사용됩니다. typeof 구문 typeof 연산자는 operand의 타입을 나타내는 문자열을 리턴해줍니다. typeof operand typeof(operand) typeof 예제 typeof 연산 결과 해당 변수의 데이터 유형이 문자열로 나타납니다. const name = "Bob"; console.log(typeof name); //"string" const age = 21; console.log(typeof age); //"number" const arr = [1, 2, 4]; console.log(typeof arr); //"object" const obj = {name:'Bob'}; console.log(t..

React에서 Route 사용 중 Matched leaf route at location does not have an element 오류가 발생했을 때 해결한 방법을 알려드리겠습니다. 참고로 처음 오류가 발생했을 때 화면에는 아무런 내용이 표시가 되지 않았습니다. 개발자 도구를 확인해보니 아래와 같은 경고 문구를 확인할 수 있었습니다. Matched leaf route at location “/main” does not have an element. This means it will render an with a null value by default resulting in an “empty” page. 오류가 발생한 코드는 다음과 같습니다. import React from 'react'; import..

리액트 서버 실행 후 콘솔창에 ‘React Cannot find module’로 시작하는 에러 메세지가 발생했습니다. Error: Cannot find module ‘C:\Users\jin\Desktop\React\ToyProject\backend\src\src\’ at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15) at Function.Module._load (node:internal/modules/cjs/loader:778:27) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12) at node:internal/m..

이 오류는 React 컴포넌트의 prop 유형을 propTypes 대신 PropTypes 사용하여 선언할 때 발생합니다. 참고로 propTypes 객체는 부모로부터 전달받은 props의 데이터 유형 및 유효성 검사 규칙을 지정하는 속성입니다. ERROR Warning: Component Input declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment? 예를 들어 다음과 같이 PropTypes을 선언하는 대신 import PropTypes from 'prop-types'; ... Input.PropTypes = { title: PropTypes.string.isRequired, placeholder: Pro..

구조 분해 할당은 배열이나 객체에서 값을 추출하고 간결한 방식으로 변수에 할당할 수 있는 JavaScript의 기능입니다. 이 기능은 ECMAScript 6(ES6)에서 도입되었습니다. 배열 구조 분해 할당 다음은 구조 분해 할당을 사용하여 배열에서 값을 추출하는 예입니다. const numbers = [1, 2, 3]; const [a, b, c] = numbers; console.log(a); // 1 console.log(b); // 2 console.log(c); // 3 위의 예에서는 세 개의 숫자가 포함된 배열을 만듭니다. 그런 다음 구조 분해 할당을 사용하여 배열 값을 변수 a, b, c에 할당합니다. 그 결과 numbers[0], numbers[1], numbers[2]가 아닌 a, b, ..

React에서 useState는 상태를 추가하고 관리할 수 있게 해주는 hook입니다. 상태란 시간이 지남에 따라 변경될 수 있는 값으로 이 값을 저장하고 관리하는 데 useState를 사용합니다. useState 사용법 먼저 useState의 사용법은 다음과 같습니다. const [상태 변수, 상태 변경 함수] = useState(초기값); useState함수에 초기 상태 값을 매개변수로 호출하면 배열이 반환됩니다. 이 배열에는 현재 값을 나타내는 상태 변수와 상태 값을 변경하는데 사용하는 함수가 들어가 있습니다. 예를 들면 다음과 같습니다. import React, { useState } from 'react'; function Counter() { const [count, setCount] = us..