React prop-types
·
React/다시 공부하는 리액트
1. Props-types 란?props-types는 React 컴포넌트에 전달되는 props의 데이터 타입과 유효성을 검사하는 라이브러리이다. 이 기능을 사용하면, 컴포넌트가 기대하는 props를 정확히 전달받고 있는지 확인할 수 있으며, 개발 중 오류를 예방하고 코드의 안정성을 높일 수 있다. 설치 방법npm install prop-types 왜 사용하는가?1. 디버깅 도구 제공 : 잘못된 props 전달 시 경고 메세지를 출력하여 개발자에게 문제를 알림2. 코드 가독성 향상 : 어떤 props가 필수인지, 데이터 구조는 어떤지 명확히 정의할 수 있다.3. 예측 가능성 증가 : 전달받은 데이터가 예상치 못한 값일 경우 방지한다. 2. 사용 예제2-1. 간단한 예제import PropTypes from..
React 객체 불변성 (feat. immer)
·
React/다시 공부하는 리액트
1. 객체 불변성이란?객체의 상태를 직접 변경하지 않고, 새로운 객체를 생성하여 상태를 업데이트하는 원칙을 의미한다. React와 같은 라이브러리에서 상태 관리 시 불변성을 유지하는 것이 매우 중요하다. 한번 만들어진 state는 변경되지 않는다. 만약 값이 변경이 된다면 state가 새로운 값으로 생기는 것이므로, 원본이 변경 되면 안된다. 하지만 얕은 참조를 하게 되면 원본도 같이 변경된다. 한 번 생성된 state는 직접 변경되지 않아야 하며, 변경이 필요한 경우에는 새로운 객체를 생성하여 변경된 값을 담아야 한다.React에서는 상태를 직접 변경하면 상태 변경 감지가 제대로 이뤄지지 않기 때문에 불변성을 유지해야 한다.불변성 안되는 코드(상태 변경이 어렵다)const address = user.e..
React 코드 컨벤션
·
React/다시 공부하는 리액트
버튼 만들 때, 아래와 같이 타입을 지정해줄수도 있고, 안할수도 있다.이는 코드 컨벤션 정해야한다. 명시적으로 type=’button’으로 할지 정해야 한다.  return ( - handleReset(event)}>0 + {count} );} return ( - handleReset(event)}> 0 + {count} );본질적으로 type='button'으로 꼭 해야 합니다.
[모던자바스크립트 Deep Dive] 48장. 모듈
·
JavaScript
1. 모듈 Module모듈이란, 애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각을 말한다. 일반적으로 모듈은 기능을 기준으로 파일 단위로 분리한다. 이때 모듈이 성립하려면 모듈은 자신만의 파일 스코프(모듈 스코프)를 가질 수 있어야 한다. 자신만의 파일 스코프를 갖는 모듈의 자산(모듈에 포함되어 있는 변수, 함수, 객체 등)은 기본적으로 비공개 상태이다. 다시 말해, 자신만의 파일 스코프를 갖는 모듈의 모든 자산은 캡슐화되어 다른 모듈에서 접근할 수 없다. 즉, 모듈은 개별적 존재로서 애플리케이션과 분리되어 존재한다. 하지만 애플리케이션과 완전히 분리되어 개별적으로 존재하는 모듈은 재사용이 불가능하므로 존재의 의미가 없다.모듈은 애플리케이션이나 다른 모듈에 의해 재사용되어야 의미가 있다...
[모던자바스크립트 Deep Dive] 46장. async, await
·
JavaScript
1. async 함수await 키워드는 반드시 async 함수 내부에서 사용해야 한다. async 함수는 async 키워드를 사용해 정의하며 언제나 프로미스를 반환한다. async 함수가 명시적으로 프로미스를 반환하지 않더라도 async 함수는 암묵적으로 반환값을 resolve하는 프로미스를 반환한다.// async 함수 선언문async function foo(n) {return n;}foo(1).then(v => console.log(v)); // 1// async 함수 표현식const bar = async function(n) {return n };bar(2).then(v => console.log(v)); // 2// async 화살표 함수const baz = async n => n;bar(3).t..
yarn 과 npm의 차이
·
JavaScript
1.npm(Node Package Manager)npm은 Node.js와 함께 설치되는 기본 패키지 매니저이다. JavaScript 개발 환경에서 의존성을 관리하고 배포할 때 널리 사용된다. npm은 커맨드라인 독와 npm Registry(패키지 저장소)로 구성되어 있으며, JavaScript 패키지를 다운로드하고 관리할 수 있도록 도와준다. npm의 특징세계에서 가장 많은 패키지가 등록된 저장소를 제공한다.별도의 설치 없이 Node.js를 설치하면 함께 제공이 된다.많은 오픈소스 프로젝트와 라이브러리가 npm에 등록되어 있다.의존성 일관성을 유지하고, 동일한 환경에서 동일한 패키지를 설치할 수 있도록 보장한다.명령어 : npm install, npm run, npm init 등이 있다. 2. Yarny..
오류확인자
'분류 전체보기' 카테고리의 글 목록 (5 Page)