태그 : react 요약보기전체보기목록닫기

1 2

01.18 Code Splitting

React.js01.18. 리액트 코드 스플리팅싱글 페이지 애플리케이션의 단점은 페이지 로딩 속도가 지연될 수 있다는 것이다. 로딩 속도가 지연되는 이유는 자바스크립트 번들 파일에 모든 애플리케이션의 로직을 불러오므로 규모가 커지면서 용량도 커지기 때문이다. 하지만 이 문제는 코드 스플리팅(code splitting)을 하면 해결할 수 있다.코드 스플리...

01.17 React Router

01.16 리덕스 미들웨어와 외부데이터 연동

01.15 리덕스 편하게 사용하는 방법

React.js01.15. 리덕스를 편하게 사용하는 방법리덕스를 사용하여 멀티 카운터를 만들면서 불편했던 점이 있다.액션을 만들 때마다 세 가지 파일 ( 액션 타입, 액션 생성 함수, 리듀서)을 수정해야한다는 점, 전개 연산자(...)와 slice 함수로 배열 내부의 아이템을 수정하는 데 가독성이 낮다는 점 등이다.이런 불편한 점을 해결하여 리덕스를 사...

01.14 리덕스를 이용한 리액트 애플리케이션 생성

01.13 React Redux(리덕스)

React.js01.13. React Redux리액트로 프로젝트에서는 최상위 컴포넌트에서 상태 관리 로직이 너무 많아져 코드가 길어지고 가독성이 떨어진다. 불필요한 리렌더링을 방지하기 위해서 하위 컴포넌트에서 shouldComponentUpdate를 구현하여 방지한다 하더라도 프로젝트가 복잡해질 경우 여러 컴포넌트를 거쳐 porps를 전달하는 ...

01.12 리액트 컴포넌트 리렌더링 최적화

React.js01.12. React Component Rerendering 최적화리액트에서는 Virtual DOM을 사용하여 필요한 DOM만 업데이트한다고 했는데, 왜 최적화가 필요할까?리액트는 부모 컴포넌트가 리렌더링되면 자식 컴포넌트도 리렌더링된다. 여기에서 불필요한 리렌더링이란 실제 웹 브라우저의 페이지에 나타난 DOM의 렌더링이 아니라 Virt...

01.11 리액트 컴포넌트 CSS 적용 ( CSS Module, Sass, styled-components )

React.js01.11. 컴포넌트 CSS 적용 ( CSS Module, Sass, styled-components )CSS Module :     모듈화된 CSS로 CSS 클래스를 만들면 자동으로 고유한 클래스네임을 생성하여 스코프를 지역적으로 제한하는 방법이다.Sass :     CSS 전처리기 중 하나로, 확장된...

01.10 리액트 함수형 컴포넌트

React.js01.10. 함수형 컴포넌트지금까지 컴포넌트는 class 문법을 사용하여 정의하였다. import React , { Component } from 'react';class NewComponent extends React.Component { render() { return ( <div&g...

01.9 React 컴포넌트 라이프사이클

React.js01.9. 컴포넌트의 라이프 사이클리액트 컴포넌트에는 라이트사이클이 존재한다. 페이지에 렌더링되기 전 준비과정에서 시작하여 페이지에서 사라질 때 끝이난다.라이프사이클 메서드는 총 열가지로 Will 접두가사 붙은 메서드는 어떤 작업을 작동하기 전에 실행되고, Did 접두사가 붙은 메서드는 어떤 작업을 작동한 후에 실행되는 메서드이다.라이프사...
1 2