기록하는 공부

강의출처 https://youtu.be/qTpUvdjO0PE useEffect useEffect는 React Hooks API 중 하나로, 함수형 컴포넌트에서 부작용(side effect)을 처리할 때 사용된다. 부작용이란, 컴포넌트의 상태(state)나 프로퍼티(props) 이외의 외부 요인에 의해 발생하는 작업을 말한다. 예를 들면, API 호출, 타이머 설정, 이벤트 리스너 등이 있다. useEffect는 컴포넌트가 렌더링 될 때마다 실행된다. 이후, 의존성 배열(deps)에 지정된 값이 변경되면 다시 실행된다. 이때, 첫 번째 인자로 전달된 콜백 함수가 실행되며, 부작용을 처리한다. 부작용을 처리하는 콜백 함수에서는, 주로 상태를 업데이트하거나, 외부 요인에 의해 발생한 작업을 수행한다. useE..

강의출처 https://youtu.be/2C2B4k3JOBg useTabs import React, { useState } from "react"; import ReactDOM from "react-dom"; import { StrictMode } from "react"; const content = [ { tab: "Section 1", content: "I'm the content of the Section 1" }, { tab: "Section 2", content: "I'm the content of the Section 2" } ]; const useTabs = (initialTab, allTabs) => { const [currentIndex, setCurrentIndex] = useState..

강의출처 https://youtu.be/W6KX48dnH6I useState useState는 항상 2개의 값을 반환한다. 첫 번째 값은 현재 상태값, 두 번째 값은 상태값을 업데이트하는 함수를 작성한다. 그리고 useState는 초기상태를 설정할 수 있는 옵션을 제공한다. 아래와 같이 작성될 수 있다. // 첫 번째 요소는 현재 상태값 item // 두 번째 요소는 상태값 item을 업데이트하는 함수 setItem // useState의 초기값으로 1 지정 const [item, setItem] = useState(1); 버튼을 누르면 값이 증가, 감소하는 코드를 useState를 사용한 코드와 사용하지 않은 코드 두 가지를 비교하여 살펴보자. useState를 사용한 코드 (12줄) //import ..

ES6 ES6 (ECMAScript 6)은 자바스크립트의 최신 버전 중 하나로, 2015년에 출시되었습니다. ES6은 기존의 자바스크립트에 몇 가지 새로운 기능을 추가하여 코드 작성을 보다 쉽고 효율적으로 만들어줍니다. ES6의 주요 기능 let 및 const 키워드 기존의 var 키워드 대신에 let과 const 키워드를 사용하여 변수를 선언할 수 있습니다. let은 블록 스코프 변수를, const는 상수를 선언하는 데 사용됩니다. 기존의 var 키워드를 사용하지 않는 이유는 var가 변수의 중복 선언이 가능하기 때문입니다. var를 중복 선언 했음에도 불구하고, 또 그 아래에 중복 선언한 변수를 선언을 할 수 있습니다. 중복 선언을 하면 기존에 선언되어 있던 변수는 다른 값을 가지게 됩니다. 이러한 ..