개발세발

📍TypeScript : 타입이 있는 자바스크립트 - 타입을 명시하여 혹시 일어날 수 있는 문제점을 예방 function makePerson (name, age) {} makePerson("철수", "20") // 숫자가 문자 형태로 들어가서 연산이 제대로 되지 않음 function makePerson(name : string, age : number) {} makePerson("철수", "20") //error!! ◼️ 특징 ▪️ 변수 값에 데이터 타입 지정이 가능 - 예측 가능한 코드 작성 가능 - 디버깅 편리 ▪️ 객체지향 프로그래밍 가능 - ES6부터 사용가능한 클래스 기능을 제공 (TS가 ES6 다음에 나왔으므로) ▪️ 확장자가 .ts ➡️ 자바스크립트(.js)로 컴파일을 해줘야 함 $ npm ..

[노션 기록] [잘한 점] ☑️확실하게 몰입하기 몰입이 필요할 땐 확실하게 집중하게 하는 힘이 새싹을 시작할 때보다 확실히 커졌다. 그만큼 할게 많고 급하긴 했지만 전엔 이러한 상황에서도 몰입이 잘 되지 않을때가 많았는데 요즘엔 잘 되는 느낌이다.. 특히 12월에 접어들면서 잔가지로 하는 일들이 다 끝나서인지 한가지에만 몰입할 수 있어서 집중해서 하고 결과를 만들어 낼 수 있었다. 확실히 무엇을 하든 한 번에 여러가지를 하려고 덤비는 것 보다는 확실한 하나를 끝마치는 것이 더 좋은 결과를 만들어내는 것 같다. 아니면 적어도 맺고 끊고를 확실하게 하든지 나만의 몰입요건이 조금은 생긴 느낌이고 그것이 충족될 때 확실하게 해낼 수 있다는 경험을 해낼 수 있어서 좋았다. ☑️많이 고민하고 할 수 있는 방법으로 ..

📍ueReducer() : 컴포넌트의 상태를 관리할 때 사용하는 Hooks const [state, dispatch] = useReducer(reducer, initialState); 값 설명 state 컴포넌트에서 사용할 상태 값 dispatch 액션을 발생시키는 함수 reducer reducer 함수 : 개발자가 직접 정의해야 하는 함수 initialState 초기 상태 값 dispatch( { type : value} ) // 액션이 생긴 모양이 객체 function reducer(state(현재 변수의 상태값), action(dispatch의 객체 = 업데이트를 할 정보)) { // 새로운 상태를 만드는 로직 return 새로운 상태; } - 특징 : 컴포넌트 상태 업데이트 로직을 컴포넌트에서 분..

Hooks : 리액트 버전 16.8에 새로 도입된 기능 - 함수형 컴포넌트에서 상태 관리를 할 수 있는 기능 제공 ◼️ 종류 useState useEffect useRef useReducer useMemo useCallback 📍useState() const [state, setState] = useState(초기값); //예시 const [number, setNumber] = useState(3); // number =3 setNumber(6) // number = 6 - 가장 기본적인 Hook - 함수형 컴포넌트가 가변적인 상태를 지닐 수 있도록 해 줌 (*) 실습 1 - 숫자 증감 시키기 Counter.jsx import { useState } from 'react'; const Counter = ..