러닝 리액트12 [Learning React] 4장 - 리액트의 작동 원리 4.1 페이지 설정 - React 라이브러리; 뷰를 만들기 위한 라이브러리 - ReactDOM 라이브러리; UI를 실제로 브라우저에 렌더링할 때 사용하는 라이브러리 - 항상 페이지에서 리액트 관련 라이브러리를 읽어들인 다음에 JS 코드 넣어야 함 4.2 리액트 엘리먼트 - 리액트는 브라우저 DOM을 갱신해주기 위해 만들어진 라이브러리 - 코드로 DOM API 직접 조작하지 않음 - 리액트에게 어떤 UI를 생성할지 지시하면, 리액트가 명령에 맞춰 Element 렌더링을 조절해 줌 - 가상 DOM은 리액트 Element로 이뤄짐 (JS 객체) - 개발자가 가상 DOM을 변경하면 리액트는 DOM API를 통해 변경 사항을 효율적으로 렌더링해 줌 - 리액트 엘리먼트는 브라우저 DOM을 만드는 방법을 알려주는 명.. 2022. 1. 31. [Learning React] 3장 - 자바스크립트를 활용한 함수형 프로그래밍 3.0 자바스크립트를 활용한 함수형 프로그래밍 - 1930년대 Lambda Calculus (람다 계산법, 알론조 처치 발명) - 고차 함수; 다른 함수를 조작하고, 함수를 인자로 받거나 반환하는 것이 가능한 복잡한 함수 - 1950년대 Lisp (존 맥카시) - 함수가 1급 시민/1급 멤버라는 개념 구현 - 변수에 함수 대입 가능, 함수를 다른 함수에 인자로 넘길 수 있음, 함수에서 함수를 만들어서 반환 가능 3.1 함수형이란 무엇인가? - JS에서 함수가 1급 시민이므로 JS는 함수형 프로그래밍 지원 - 1급 시민: 함수를 값처럼 활용 가능 - 함수를 일반적인 데이터로 취급 가능 - 함수를 일반적인 값과 마찬가지로 저장하거나 읽어오거나, 애플리케이션에서 흘려보낼 수 있음 - JS에서는 함수가 애플리케.. 2022. 1. 30. [Learning React] 2장 - 리액트를 위한 자바스크립트 2.0 리액트를 위한 자바스크립트 - 초기 JS는 웹 페이지에 상호작용 추가하기 위해 만들어진 용도 - ECMAScript - ES5: 2009년, 새로운 배열 처리 메서드, 객체 프로퍼티, JSON 지원 라이브러리 등 - ES6 (ES2015) - ESNext (현재 제안 단계): 향후 자바스크립트 명세에 들어갈 요소 2.1 변수 선언하기 - ES2015 전까지는 var 사용 - const 키워드 - 상수: 값을 변경할 수 없는 변수 - 상수에 값 재할당 불가 (TypeError 발생) - let 키워드 - JS는 Lexical Variable scoping 지원 - 변수의 영역을 코드 블록 안으로 한정시킬 수 있음 - 블록 안에서 글로벌 변수 보호 가능 - 템플릿 문자열 - 문자열 concatenat.. 2022. 1. 28. [Learning React] 1장 - 리액트 소개 1.0 리액트 소개 - Why React? (피트 헌트) - 작은 라이브러리 - JS 안에서 HTML 코드 작성 가능 (JSX) - 전처리 필요 => 웹팩 - 생산성 높음 1.1 튼튼한 토대 - 사전 학습: JS (배열, 객체, 함수, ...) - 함수형 프로그래밍 - 가독성, 재사용성, 테스트 가능성 좋은 패턴 더 많이 활용 -> 더 뛰어난 JS 개발자로 성장 - 컴포넌트를 사용한 UI 구현 - 컴포넌트 compose (합성), prop과 state를 이용하여 로직 추가 - 리액트 훅스; 컴포넌트에 대한 상태 로직 재사용 가능 - 훅스와 서스펜스; 데이터 읽어올 때 도움 - 라우팅, 테스팅, 서버 사이드 렌더링 1.2 리액트의 과거와 미래 - 페이스북 엔지니어 조던 워크가 리액트 개발 - JS Conf.. 2021. 12. 11. 이전 1 2 3 다음 반응형