오아시스 이야기

some 메서드 사용 방법 Array.prototype.some Array.prototype.some(callback(currentElement, index)) find와 findIndex는 조건을 만족하는 값과 인덱스를 리턴했다면, some 메서드는 조건을 만족하는지에 대한 참/거짓 여부를 리턴합니다. 이번에도 배열에 5보다 큰 원소가 있는지 찾아봅시다. const array = [2, 4, 6, 8, 10]; console.log(array.some((el) => el > 3)); // ==> true

책보고 코딩 했는데 오류 발생. React Hook "useState" cannot be called at the top level. React Hooks must be called in a React function component or a custom React Hook function ----------------------------------------- type CalcPropsType = { x: number; y: number; oper: string; }; const Calc = (props: CountryListPropsType) => { let result: number = 0; switch(props.oper) { case "+": result = props.x + props.y;..

import styled from 'styled-components/native`; 아래 꺼 다해도 오류 났는데.. 위에꺼 그냥 붙여 넣기하고 native 삭제 했는데.. 에러가 안난다.. 이런 일이.. 어디서 잘못 됐었는지 확인 할 방법이 없네. 설치 npm i --save-dev @types/styled-components package.json 수정 "styled-components": "^6.0.2", "@types/styled-components": "^5.1.26", npm 재설치 npm i

원도우 설정 > 장치 > 마우스 > 아래 쪽 "추가 마우스 설정" 포인터 자국 표시"에 체크 후 포인터 자국은 최대한 짧게 설정, 적용 후 확인버튼 클릭

https://git-scm.com/download/win 설치

public\index.html src\index.tsx import React from 'react'; import ReactDOM from 'react-dom/client'; const root = ReactDOM.createRoot( document.getElementById('root') as HTMLElement ); root.render( 가위바위보 가위 바위 보 );

1. 아래의 Nodejs 사이트에 접속하여 LTS라고 써있는 버전을 다운받아 설치합니다. https://nodejs.org/ko/ – 설치 경로는 C드라이브를 권장합니다. 2. 아래의 Visual Studio Code 사이트에 접속하여 최신 버전을 다운받아 설치합니다. https://code.visualstudio.com/ 리액트 프로젝트 생성 C 드라이브에 FRONT 폴더를 생성합니다. FRONT 폴더를 선택하고 Shift키를 누르고 오른쪽 마우스 클릭하여 “여기에 PowerShell 창 열기”를 선택합니다. 아래와 같이 입력하여 프로젝트를 선택합니다. ※ aboutw3는 자신의 프로젝트명으로 바꾸어 생성해도 됩니다. - React Typescript 프로젝트 생성 npx create-react-app..

1.1 React 개요 메타에서 개발한 오픈 소스 자바스크립트 라이브러리 이다. GitHub Star 수와 npm 패키지 다운로드 수는 React가 가장 많다. SPA을 전제로 하고 있으며, Dirty checking과 Virtual DOM을 활용하여 업데이트 해야하는 DOM 요소를 찾아서 해당 부분만 업데이트하기 때문에, 리렌더링이 잦은 동적인 모던 웹에서 엄청나게 빠른 퍼포먼스를 내는게 가능하다. 기본적으로 모듈형 개발이기 때문에 생산성 또한 상당히 높은 라이브러리인지라 순식간에 대세로 떠올랐다. 거기에 기본적으로 프레임워크가 아니라 라이브러리인지라 다른 프레임워크에 간편하게 붙여서 사용하는 것도 가능하며, React Hooks라는 강력한 메소드들을 지원하면서 사실상 웹 프론트엔드 개발의 표준으로 자..

delete 연산자 delete 연산자는 객체의 속성을 제거합니다. 제거한 객체의 참조를 어디에서도 사용하지 않는다면 나중에 자원을 회수합니다. 시도해보기 구문 JSCopy to Clipboard delete expression expression은 속성 참조여야 합니다. 예컨대, JSCopy to Clipboard delete object.property delete object['property'] 매개변수 object 객체의 이름, 또는 평가했을 때 객체를 반환하는 표현식. property 제거하려는 속성. 반환 값 true. 단, 비엄격 모드에서 속성이 자신의 속성이며 설정 불가능 (en-US)한 경우 false. 예외 엄격 모드에서, 속성이 자신의 속성이며 설정 불가능한 경우 TypeError...

useCallback 은 특정 함수를 새로 만들지 않고 재사용하고 싶을때 사용합니다. 메모이제이션된 콜백을 반환합니다. 인라인 콜백과 그것의 의존성 값의 배열을 전달하세요. useCallback은 콜백의 메모이제이션된 버전을 반환할 것입니다. 그 메모이제이션된 버전은 콜백의 의존성이 변경되었을 때에만 변경됩니다. 이것은, 불필요한 렌더링을 방지하기 위해 (예로 shouldComponentUpdate를 사용하여) 참조의 동일성에 의존적인 최적화된 자식 컴포넌트에 콜백을 전달할 때 유용합니다. useCallback(fn, deps)은 useMemo(() => fn, deps)와 같습니다. const memoizedCallback = useCallback( () => { doSomething(a, b); },..