nata_developer

1.REACT REF란? Ref는 render 메서드에서 생성된 DOM 노드나 React 엘리먼트에 접근하는 방법을 제공합니다.' 일반적인 React의 데이터 플로우에서 props는 부모 컴포넌트가 자식과 상호작용할 수 있는 유일한 수단입니다. 자식을 수정하려면 새로운 props를 전달하여 자식을 다시 렌더링해야 합니다. 그러나, 일반적인 데이터 플로우에서 벗어나 직접적으로 자식을 수정해야 하는 경우도 가끔씩 있습니다. 수정할 자식은 React 컴포넌트의 인스턴스일 수도 있고, DOM 엘리먼트일 수도 있습니다. React는 두 경우 모두를 위한 해결책을 제공합니다. 2.REF를 사용해야 할 때 Ref의 바람직한 사용 사례는 다음과 같습니다. 포커스, 텍스트 선택영역, 혹은 미디어의 재생을 관리할 때. 애..

JavaScript Library 2020. 8. 10. 15:44

1.Babel이란 무엇인가? 바벨은 주로 ES16코드를 이전 버전의 호환가능한 자바스크립트로 변환시켜주는 툴체인이다. 2. .babelrc babel의 설정을 관리하는 파일 3.plugin 바벨은 컴파일러입니다.(소스코드 => 결과물 코드로 변환 시켜주는) 다른 많은 컴파일러들과 같이 바벨은 3 단게로 동작합니다. 파싱, 변환, 출력. 이것들을 가능하게 하것이 바로 플러그인 입니다. 바벨은 별도의 설치나 구성없이는 아무 것도 동작하지 않습니다. 바벨이 동작하게 하려면 플러그인을 추가시켜야 합니다. 개별적인 플러그인 대신에 플러인의 집합인 preset을 사용할 수도 있습니다. 참고-https://babeljs.io/docs/en/plugins Babel · The compiler for next gener..

JavaScript Library 2020. 8. 9. 13:09

1.path.resolve() path.resolve() 메써드는 일련의 경로들 혹은 경로 조각들을 절대 경로로 합친다. path: path.resolve(__dirname, 'dist') 참고-https://nodejs.org/api/path.html Path | Node.js v14.7.0 Documentation Path# Source Code: lib/path.js The path module provides utilities for working with file and directory paths. It can be accessed using: const path = require('path'); Windows vs. POSIX# The default operation of the path m..

JavaScript Library 2020. 8. 7. 18:27

1.Why Lodash? 로데쉬는 arrays, numbers, objects, strings 등을 잘 헤쳐나갈 수 있도록 함으로써 자바스크립트를 더욱 쉽게 만들어줍니다. 로데쉬의 모듈러는 이런 것에 훌륭합니다 : arrays, objects & strings 반복 values 테스팅 및 조작 composite functions 만들기 2.Lodash의 문법들 2-1) _.join(array, [separator=',']) 배열의 모든 요소들을 seperator에 의해 분리된 string으로 바꾸어줍니다. _.join(['a', 'b', 'c'], '~'); // => 'a~b~c' 2-2) _.pick(object, [paths]) 선택된 object properties로 구성된 object를 생성합니..

JavaScript Library 2020. 8. 7. 17:51

*인프런의 프론트엔드 개발자를 위한 웹팩(캡틴판교)를 참고하였습니다. 1.WEBPACK이란? 웹팩이란 최신 프런트엔드 프레임워크에서 가장 많이 사용되는 모듈 번들러(Module Bundler)입니다. 모듈 번들러란 웹 애플리케이션을 구성하는 자원(HTML, CSS, Javscript, Images 등)을 모두 각각의 모듈로 보고 이를 조합해서 병합된 하나의 결과물을 만드는 도구를 의미합니다. 1-1)왜 WEBPACK을 사용하려 할까? 파일 안의 변수 등이 충돌할 수 있기 때문에 파일 단위로 변수를 관리하고 싶은 욕구를 충족하고자 WEBPACK이 등장하였다. 1-2)WEBPACK으로 해결하고자 하는 문제 자바스크립트 변수 유효 범위 브라우저별 HTTP 요청 숫자의 제약 사용하지 않는 코드의 관리 Dynam..

JavaScript Library 2020. 8. 7. 17:30