Category: React

2020
0
DevelopReact

useReactRouter Hook [5]

React Router with Velopert - 05 - useReactRouter Hook RouterHookSample.js Profiles.js Chap 4. useReactRouter Hook useReactRouter HookwithRouter로 라우트를 사용하지 않은 컴포넌트에서도 match, location, history등

0
DevelopReact

라우터 부가기능 [4]

React Router with Velopert - 04 - history 객체 src/HistorySample.js src/App.js withRouter HoC src/WithRouterSample.js src/Profiles.jsx Switch src/App.js NavLink src/Profiles.js 기타 Chap 4.

0
DevelopReact

서브 라우트 [3]

React Router with Velopert - 03 - 서브 라우트 만들어보기 src/Profiles.jsx src/App.js src/Profile.jsx Chap 3. 서브라우트 라우트 내부에 라우트를 만드는 것. 컴포넌트를 만들고 Route 컴포넌트를 렌더링하면 된다. 서브 라우트 만들어보기src/Profiles.jsx 12345

0
DevelopReact

파라미터와 쿼리 [2]

React Router with Velopert - 02 - 파라미터와 쿼리 URL Parameter Parameter 받아오기 Query QueryString 받아오기 Chap 2. 파라미터와 쿼리 파라미터와 쿼리Parameter : /profiles/:username 파라미터는 match 객체의 params 를 사용한다. 1const

0
DevelopReact

SPA 와 react-router [1]

React Router with Velopert - 01 - SPA SPA 란? non-SPA SPA 장점 SPA 단점 주로 사용되는 리액트 라우터 라이브러리 리액트 라우터 react-router next 리액트 라우터 react-router BrowserRouter HashRouter MemoryRouter StaticRouter Route L

0
DevelopReact

React로 사고하기

React Official Document주요개념 : React로 사고하기 목업으로 시작하기 1단계 : UI를 컴포넌트 계층 구조로 분할하기 2단계 : React로 정적인 버전 만들기 3단계 : UI state에 대한 최소한의 (하지만 완전한) 표현 찾아내기 4단계: State가 어디에 있어야 할 지 찾기 5단계: 역방향 데이터 흐름 추가하기

0
DevelopReact

합성(Composition) vs 상속(Inheritance)

React Official Document주요개념 : 합성(Composition) vs 상속(Inheritance) 컴포넌트에서 다른 컴포넌트를 담기 특수화 React에서 상속은? React Official Document주요개념#10. 합성(Composition) vs 상속(Inheritance) React는 상속 대신 합성을 사용하여 컴포넌트

2019
0
DevelopReact

State 끌어올리기

React Official Document주요개념 : State 끌어올리기 온도계산기 기본 컴포넌트 생성 두번째 Input 추가 하기 변환 함수 작성 State 끌어올리기 Calculator 변경사항 요약 Calculator 컴포넌트 수정하기 정리 교훈 React Official Document주요개념#9. State 끌어올리기온도 계산기기본

0
DevelopReact

폼

React Official Document주요개념 : 폼 HTML 에서의 Form React에서의 Form 제어 컴포넌트(Controlled Components) textarea 태그 select 태그 file input 태그 다중 입력 제어하기 제어되는 Input Null 값 React Official Document주요개념#8. 폼HTML

0
DevelopReact

리스트와 Key

React Official Document주요개념 : 리스트와 Key 자바스크립트에서 리스트 변환 리액트에서 여러개의 컴포넌트 렌더링 하기 기본 리스트 컴포넌트 Key Key로 컴포넌트 추출하기 Key는 주변 배열의 context에서만 의미를 지니고 있다. Key는 형제 사이에서만 고유한 값을 지녀야 한다. React에서 Key는 컴포넌트로 전달되지는